AngularJS with NvD3

JSON generated from JSON Generator. Charting based on NvD3 Chart example

by Avi Algaly

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/nvd3/1.7.0/nv.d3.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js"></script>
<div id="chart" ng-controller="MainCtrl as mainCtrl">
    <svg></svg>
    <button ng-click="mainCtrl.getExplosions()">Explosions</button>
    <button ng-click="mainCtrl.getConfetti()">Confetti</button>
</div>

CSS

#chart svg {
    height: 400px;
    width: 600px;
}

JavaScript

var fooData = [{
    "day": 0,
        "explosions": 66,
        "confetti": 77,
        "machineType": "toaster"
}, {
    "day": 1,
        "explosions": 66,
        "confetti": 79,
        "machineType": "toaster"
}, {
    "day": 2,
        "explosions": 57,
        "confetti": 74,
        "machineType": "toaster"
}, {
    "day": 3,
        "explosions": 67,
        "confetti": 76,
        "machineType": "toaster"
}, {
    "day": 4,
        "explosions": 50,
        "confetti": 80,
        "machineType": "toaster"
}, {
    "day": 5,
        "explosions": 60,
        "confetti": 78,
        "machineType": "toaster"
}, {
    "day": 6,
        "explosions": 69,
        "confetti": 80,
        "machineType": "toaster"
}, {
    "day": 0,
        "explosions": 55,
        "confetti": 77,
        "machineType": "microwave"
}, {
    "day": 1,
        "explosions": 61,
        "confetti": 75,
        "machineType": "microwave"
}, {
    "day": 2,
        "explosions": 70,
        "confetti": 77,
        "machineType": "microwave"
}, {
    "day": 3,
        "explosions": 53,
        "confetti": 81,
        "machineType": "microwave"
}, {
    "day": 4,
        "explosions": 54,
        "confetti": 86,
        "machineType": "microwave"
}, {
    "day": 5,
        "explosions": 55,
        "confetti": 88,
        "machineType": "microwave"
}, {
    "day": 6,
        "explosions": 52,
        "confetti": 85,
        "machineType": "microwave"
}, {
    "day": 0,
        "explosions": 64,
        "confetti": 76,
        "machineType": "refridgerator"
}, {
    "day": 1,
        "explosions": 69,
        "confetti": 90,
        "machineType": "refridgerator"
}, {
    "day": 2,
        "explosions": 63,
        "confetti": 84,
        "machineType": "refridgerator"
}, {
    "day": 3,
        "explosions": 70,
        "confetti": 72,
        "machineType": "refridgerator"
}, {
    "day": 4,
        "explosions": 65,
        "confetti": 82,
        "machineType": "refridgerator"
},...