38 lines
1.4 KiB
JSON
Executable File
38 lines
1.4 KiB
JSON
Executable File
<!-- required files -->
|
|
<link href="../assets/plugins/nvd3/build/nv.d3.css" rel="stylesheet" />
|
|
<script src="../assets/plugins/d3/d3.min.js"></script>
|
|
<script src="../assets/plugins/nvd3/build/nv.d3.min.js"></script>
|
|
|
|
<div id="nv-bar-chart" class="h-250px"></div>
|
|
|
|
<script>
|
|
var barChartData = [{
|
|
key: 'Cumulative Return',
|
|
values: [
|
|
{ 'label' : 'A', 'value' : 29, 'color' : app.color.red },
|
|
{ 'label' : 'B', 'value' : 15, 'color' : app.color.orange },
|
|
{ 'label' : 'C', 'value' : 32, 'color' : app.color.success },
|
|
{ 'label' : 'D', 'value' : 196, 'color' : app.color.cyan },
|
|
{ 'label' : 'E', 'value' : 44, 'color' : app.color.blue },
|
|
{ 'label' : 'F', 'value' : 98, 'color' : app.color.purple },
|
|
{ 'label' : 'G', 'value' : 13, 'color' : app.color.gray500 },
|
|
{ 'label' : 'H', 'value' : 5, 'color' : app.color.componentColor }
|
|
]
|
|
}];
|
|
|
|
nv.addGraph(function() {
|
|
var barChart = nv.models.discreteBarChart()
|
|
.x(function(d) { return d.label })
|
|
.y(function(d) { return d.value })
|
|
.showValues(true)
|
|
.duration(250);
|
|
|
|
barChart.yAxis.axisLabel("Total Sales");
|
|
barChart.xAxis.axisLabel('Product');
|
|
|
|
d3.select('#nv-bar-chart').append('svg').datum(barChartData).call(barChart);
|
|
nv.utils.windowResize(barChart.update);
|
|
|
|
return barChart;
|
|
});
|
|
</script> |