O'Reilly logo

Splunk Developer's Guide by Kyle Smith

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Custom D3 visualization

Now that we have a slide-out, let's move on to visualizations. We now want to add an information graphic that displays some statistics about the prices of the products. So let's use a box plot! D3 offers a nice example at http://bl.ocks.org/mbostock/4061502. We will take this code and adapt it for use with this dashboard. Let's start with the CSS for the boxplots. This is located in the index.html section of the tutorial. Copy all of the CSS except for the body class to the dashboard.css file in the app. In that same section, find the function irq, and copy that into the dashboard.js file. Now, find the box.js section. Copy the entire function to a file under appserver/static/js. Download and place a copy of d3.min.js

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required