Created
July 26, 2014 03:22
-
-
Save hnakamur/f203e1cb6adedb56eca8 to your computer and use it in GitHub Desktop.
SVG path getTotalLength() in Firefox returns 0 or a wrong large value for some cubic bezier segments. try http://bl.ocks.org/hnakamur/f203e1cb6adedb56eca8
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<head> | |
<meta charset='utf-8'> | |
</head> | |
<body> | |
<div id='example'> | |
<svg width="300" height="300"> | |
<path id="path1" d="M229.99999999999994,196.66666666666666C229.99999999999997,213.33333333333331,229.99999999999997,246.66666666666666,241.66666666666663,263.3333333333333" stroke="black" fill="none"/> | |
<path id="path2" d="M241.66666666666663,263.3333333333333C253.33333333333331,280,276.66666666666663,280,288.3333333333333,280" stroke="black" fill="none"/> | |
</svg> | |
</div> | |
<pre> | |
Chrome 36.0.1985.125 | |
path1.length 68.57687377929688 | |
path2.length 51.637718200683594 | |
Safari 6.1.5 (8537.77.4) | |
path1.length 68.57698059082031 | |
path2.length 51.63789749145508 | |
Firefox 31.0 | |
path1.length 0 # wrong! | |
path2.length 123295481856 # wrong! | |
Firefox Nightly 34.0a1 (2014-07-25) | |
path1.length 0 # wrong! | |
path2.length 123295481856 # wrong! | |
</pre> | |
<script> | |
var n = 2, i, path; | |
for (i = 1; i <= n; i++) { | |
path = document.getElementById('path' + i); | |
if (path) { | |
console.log('path' + i, path); | |
console.log('path' + i + '.length', path.getTotalLength()); | |
} | |
} | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment