D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
mbostock
Full window
Github gist
D3 PJAX
<!DOCTYPE html> <meta charset="utf-8"> This page was generated at <script>document.write(new Date)</script>. <div id="main"> <ul> <li><a href="a.html">Anteater</a></li> <li><a href="b.html">Baobao</a></li> <li><a href="c.html">Cuttlefish</a></li> </ul> Hello, PJAX! </div> <script src="//d3js.org/d3.v3.min.js"></script> <script> pjax("ul li a", "#main"); function pjax(links, content) { d3.selectAll(links).on("click", function() { history.pushState(this.href, this.textContent, this.href); load(this.href); d3.event.preventDefault(); }); function load(href) { d3.html(href, function(fragment) { var target = d3.select(content).node(); target.parentNode.replaceChild(d3.select(fragment).select(content).node(), target); pjax(links, content); // reapply }); } d3.select(window).on("popstate", function() { if (d3.event.state) load(d3.event.state); }); } </script>
https://d3js.org/d3.v3.min.js