Marker animation along SVG "path" element with D3.js: animating "path" and marker movement synchronously, marker rotate according to tangent line to path.
xxxxxxxxxx
<html lang="en">
<meta charset="utf-8">
<head>
<title>SVG path animation</title>
<link href="style.css" rel="stylesheet">
<script src="https://d3js.org/d3.v3.min.js"></script>
<script src="https://d3js.org/queue.v1.min.js"></script>
</head>
<body>
<!-- start -->
<div id="pathAnimation">
<script src="pathAdvancedFollow.js"></script>
<form>
<input type="checkbox" id="pathTrigger" name="visibility" value="hidden">Show/Hide path</br>
</form>
</div>
<!-- end -->
</body>
</html>
Modified http://d3js.org/d3.v3.min.js to a secure url
Modified http://d3js.org/queue.v1.min.js to a secure url
https://d3js.org/d3.v3.min.js
https://d3js.org/queue.v1.min.js