Comments (6)
Reopening for design / front-end review.
from demos-old.
[slightly related]
if
<path>
element of SVG hasfill-opacity
property set and the element is using a marker, the opacity would be inherited by marker, even if marker element is not the child of path.
Given this code:
<svg xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
<marker id="m1" style="overflow: visible; fill: #700;" orient="auto">
<path style="fill-rule: evenodd; stroke: black; stroke-width: 1pt;" transform="matrix(0.8 0 0 0.8 5.70039 0.8)" d="M -2.5 -1 C -2.5 1.76 -4.74 4 -7.5 4 C -10.26 4 -12.5 1.76 -12.5 -1 C -12.5 -3.76 -10.26 -6 -7.5 -6 C -4.74 -6 -2.5 -3.76 -2.5 -1 Z" />
</marker>
<marker id="m2" style="overflow: visible; fill: #070;" orient="auto">
<path style="fill-rule: evenodd; stroke: black; stroke-width: 1pt;" transform="scale(-0.8)" d="M 5.77 0 L -2.88 5 L -2.88 -5 L 5.77 0 Z" />
</marker>
<marker id="m3" style="overflow: visible; fill: #007;" orient="auto">
<path style="fill-rule: evenodd; stroke: black; stroke-width: 1pt;" transform="scale(0.8)" d="M -5 -5 L -5 5 L 5 5 L 5 -5 L -5 -5 Z" />
</marker>
<path style="fill: none; fill-opacity: 0.75; fill-rule: evenodd; marker-end: url('#m1'); marker-mid: url('#m2'); marker-start: url('#m3'); stroke: red; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 4; stroke-opacity: 1; stroke-width: 2.5;" d="M 240 180 C 260 160 280 160 300 180 C 320 200 340 200 360 180"/>
</svg>
Result:
Is this an undefined behavior in spec or a bug in IE10+ and Edge?
from demos-old.
@molant do you know who the original author is on this one?
from demos-old.
No idea :(
-----Original Message-----
From: "Melanie Richards" [email protected]
Sent: 6/19/2015 9:19 AM
To: "MicrosoftEdge/Demos" [email protected]
Cc: "Anton Molleda" [email protected]
Subject: Re: [Demos] Style svggradientbackgroundmaker (#19)
@molant do you know who the original author is on this one?
—
Reply to this email directly or view it on GitHub.
from demos-old.
Actually this issue was reported on Connect quite a while back, but not sure if it is the violation of spec or undefined behavior: https://connect.microsoft.com/IE/feedback/details/772099/wrong-inheritance-with-svgs-fill-opacity.
Would be really cool if we get a repository on GitHub (say MicrosoftEdge/SpecTests) where we can submit tests cases in an organized way, for instance; input and expected output in TODO folder (like TODO/SVG/Inheritance/1/path-inheritance.[svg/png]
, TODO/JavaScript/..
etc.). This will probably make it easier for the teams to move tests form TODO to DONE folder once the feature is implemented or the bug is fixed, so community can follow-up on their concerns. :)
I know you guys are very busy at the moment, but please consider this in future. With that said, thank you for bringing great new features to Edge. 👍
from demos-old.
Closed. Duplicate of issue #161
from demos-old.
Related Issues (20)
- [Variable fonts] Add markup for hero animation area HOT 1
- [Variable fonts] Animate the contents of the poem HOT 2
- [Variable fonts] Finish content
- [Variable fonts] Integrate finished content into demo
- [Variable fonts] Finish pull quote example HOT 2
- [Variable fonts] Decovar animation HOT 6
- [Variable fonts] Design mini-demos to support content
- [Variable fonts] Position ice floes behind main content
- [Variable fonts] Slightly animated ice floes positioned behind content (if time)
- [Variable fonts] Animate the headings as they scroll into view HOT 1
- [Demo template] Add a smooth scrolling hash function HOT 1
- [EME] Video freezes if playbackRate is changed to 4x or 8x
- [Variable Fonts] Polyfil for intersectionObserver
- [Variable Fonts] Add description in <head>
- [Variable Fonts] Interactive Examples? HOT 1
- Missing sandbox demo HOT 2
- Service unavailable error on several demos HOT 1
- Some demos render as blank pages HOT 2
- Allow Icon-Only in Favorites bar
- Online HTML5 Hover Demo doesn't work
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from demos-old.