Custom data visualization with SVG.js

The final example in this chapter is another example of doing a custom data visualization. We're going to once again revisit the visualization representing David Ortiz's home runs over his career as a member of the Boston Red Sox.

Since we've seen this multiple times, we can simply focus on the ways that SVG.js can help us do this work. 

The first file you'll see is the HTML file. The only differences between this and the vanilla JS Version are the inclusion of the SVG.js source file from node_modules and the absence of a base SVG element: 

  <div class="container-fluid">    <div class="row">      <div class="col-12" id="target">              </div>    </div>  </div> <script src="node_modules/svg.js/dist/svg.min.js"></script> ...

Get Mastering SVG now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.