D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
jasondavies
Full window
Github gist
IRI Retrieval Bug
Test case for
WebKit bug 113573
.
<!DOCTYPE html> <meta charset="utf-8"> <style> body { font-family: sans-serif; } </style> <svg xmlns="https://www.w3.org/2000/svg" width="100" height="100"> <defs> <radialGradient id="fill" cx="75%" cy="25%"> <stop offset="5%" stop-color="#ebebef" stop-opacity="0.5"/> <stop offset="100%" stop-color="#a2abb3" stop-opacity="0.5"/> </radialGradient> </defs> <g style="fill: url(#fill)" id="test"> <rect width="100" height="100"/> </g> </svg> <ul> <li>window.getComputedStyle(element, null).getPropertyValue("fill"): <span id="computed-style-property"></span> <li>window.getComputedStyle(element, null).fill: <span id="computed-style-fill"></span> <li>element.style.getPropertyValue("fill"): <span id="element-style-property"></span> <li>element.style.fill: <span id="element-style-fill"></span> <li>element.getAttribute("style"): <span id="element-attribute"></span> </ul> <script> var e = document.getElementById("test"); //e.style.setProperty("fill", "url(#fill)"); document.getElementById("computed-style-property").textContent = window.getComputedStyle(e, null).getPropertyValue("fill"); document.getElementById("computed-style-fill").textContent = window.getComputedStyle(e, null).fill; document.getElementById("element-style-property").textContent = e.style.getPropertyValue("fill"); document.getElementById("element-style-fill").textContent = e.style.fill; document.getElementById("element-attribute").textContent = e.getAttribute("style"); </script>