Bearcart Area (Non Timeseries)

<!doctype>
<head>
  <link rel="stylesheet" href="rickshaw.min.css">
	<script src="https://d3js.org/d3.v3.min.js" charset="utf-8"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
	<script src="rickshaw.min.js"></script>

var palette = new Rickshaw.Color.Palette( {scheme: 'spectrum14'} );

d3.json('random_data.json', function(error, json) {

var graph = new Rickshaw.Graph( {
                element: document.querySelector("#chart"),
                width: 750,
                height: 400,
                renderer: 'area',
                series: [
                         {name: 'Data 1', 
                          color: palette.color(),
                          data: json[0].data},
                          
                         {name: 'Data 2', 
                          color: palette.color(),
                          data: json[1].data},
                          
                         {name: 'Data 3', 
                          color: palette.color(),
                          data: json[2].data}
                          ]
                })

var xAxis = new Rickshaw.Graph.Axis.X( {
    graph: graph
} );

var y_axis = new Rickshaw.Graph.Axis.Y( {
        graph: graph,
        orientation: 'left',
        tickFormat: Rickshaw.Fixtures.Number.formatKMBT,
        element: document.getElementById('y_axis')
} );

var hoverDetail = new Rickshaw.Graph.HoverDetail( {
    graph: graph,
    xFormatter: function(x){return Math.floor(x / 10) * 10}
} );

var legend = new Rickshaw.Graph.Legend( {
    graph: graph,
    element: document.getElementById('legend')

} );

var shelving = new Rickshaw.Graph.Behavior.Series.Toggle({
    graph: graph,
    legend: legend
});

graph.render();

});

</script>

</body>

Modified http://d3js.org/d3.v3.min.js to a secure url

https://d3js.org/d3.v3.min.js

https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js