<!DOCTYPE html>
<html lang="en">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<link media="all" href="http://rawgithub.com/novus/nvd3/master/nv.d3.css" type="text/css" rel="stylesheet" />
<script src="http://rawgithub.com/mbostock/d3/master/d3.min.js" type="text/javascript"></script>
<script src="http://rawgithub.com/novus/nvd3/master/nv.d3.min.js" type="text/javascript"></script>
</head>



<h2>linePlusBarWithFocusChart</h2>

<div id="linePlusBarWithFocusChart"><svg style="height:350px;"></svg></div>


<script>
    $(function(){nv.addGraph(function() {
        var chart = nv.models.linePlusBarWithFocusChart();
        chart.margin({top: 30, right: 60, bottom: 50, left: 70})
            .x(function(d,i) { return i });
        chart.height(350);

        chart.y2Axis
            .tickFormat(function(d) { return d3.format(',.2f')(d) });
        chart.x2Axis
            .tickFormat(function(d) {
                var dx = data_linePlusBarWithFocusChart[0].values[d] && data_linePlusBarWithFocusChart[0].values[d].x || 0;
                return d3.time.format('%d %b %Y')(new Date(dx));
            });
        chart.y4Axis
            .tickFormat(function(d) { return d3.format(',.2f')(d) });
        chart.y3Axis
            .tickFormat(d3.format(',f'));
        chart.xAxis
            .tickFormat(function(d) {
                var dx = data_linePlusBarWithFocusChart[0].values[d] && data_linePlusBarWithFocusChart[0].values[d].x || 0;
                if (dx > 0) { return d3.time.format('%d %b %Y')(new Date(dx)) }
                return null;
            });
        chart.y1Axis
            .tickFormat(d3.format(',f'));
        chart.tooltipContent(function(key, y, e, graph) {
            var x = d3.time.format('%d %b %Y')(new Date(parseInt(graph.point.x)));
            var y = String(graph.point.y);
            if(key.indexOf('Count') > -1 ){
                var y = '$ ' +  String(graph.point.y) ;
            }
            if(key.indexOf('Duration') > -1 ){
                var y =  String(graph.point.y)  + ' min';
            }
            tooltip_str = '<center><b>'+key+'</b></center>' + y + ' on ' + x;
            return tooltip_str;
        });
        chart.showLegend(true);
        d3.select('#linePlusBarWithFocusChart svg')
            .datum(data_linePlusBarWithFocusChart)
            .transition().duration(500)
            .attr('height', 350)
            .call(chart);

    return chart;
});
});data_linePlusBarWithFocusChart=[{"bar": "true", "values": [[1338534000000, 5], [1339534000000, 11], [1340534000000, 4], [1341534000000, 4], [1342534000000, 7], [1343534000000, 11], [1344534000000, 16], [1345534000000, 8], [1346534000000, 18], [1347534000000, 12], [1348534000000, 20], [1349534000000, 15], [1350534000000, 14], [1351534000000, 15], [1352534000000, 23], [1353534000000, 20], [1354534000000, 23], [1355534000000, 19], [1356534000000, 28], [1357534000000, 28], [1358534000000, 21], [1359534000000, 31], [1360534000000, 32], [1361534000000, 33], [1362534000000, 27], [1363534000000, 34], [1364534000000, 27], [1365534000000, 35], [1366534000000, 38], [1367534000000, 32], [1368534000000, 39], [1369534000000, 38], [1370534000000, 36], [1371534000000, 42], [1372534000000, 35], [1373534000000, 41], [1374534000000, 46], [1375534000000, 47], [1376534000000, 42], [1377534000000, 41], [1378534000000, 48], [1379534000000, 45], [1380534000000, 47], [1381534000000, 47], [1382534000000, 47], [1383534000000, 51], [1384534000000, 53], [1385534000000, 48], [1386534000000, 58], [1387534000000, 59], [1388534000000, 60], [1389534000000, 57], [1390534000000, 57], [1391534000000, 56], [1392534000000, 57], [1393534000000, 61], [1394534000000, 57], [1395534000000, 59], [1396534000000, 65], [1397534000000, 61], [1398534000000, 64], [1399534000000, 63], [1400534000000, 64], [1401534000000, 72], [1402534000000, 70], [1403534000000, 74], [1404534000000, 72], [1405534000000, 68], [1406534000000, 70], [1407534000000, 79], [1408534000000, 72], [1409534000000, 73], [1410534000000, 76], [1411534000000, 78], [1412534000000, 76], [1413534000000, 76], [1414534000000, 80], [1415534000000, 83], [1416534000000, 82], [1417534000000, 84], [1418534000000, 85], [1419534000000, 91], [1420534000000, 86], [1421534000000, 92], [1422534000000, 88], [1423534000000, 86], [1424534000000, 95], [1425534000000, 96], [1426534000000, 92], [1427534000000, 96], [1428534000000, 100], [1429534000000, 94], [1430534000000, 93], [1431534000000, 100], [1432534000000, 100], [1433534000000, 103], [1434534000000, 101], [1435534000000, 99], [1436534000000, 100], [1437534000000, 100], [1438534000000, 108], [1439534000000, 111], [1440534000000, 111], [1441534000000, 104], [1442534000000, 112], [1443534000000, 111], [1444534000000, 114], [1445534000000, 110], [1446534000000, 111], [1447534000000, 117], [1448534000000, 118], [1449534000000, 120], [1450534000000, 119], [1451534000000, 119], [1452534000000, 121], [1453534000000, 123], [1454534000000, 123], [1455534000000, 127], [1456534000000, 124], [1457534000000, 121], [1458534000000, 125], [1459534000000, 126], [1460534000000, 128], [1461534000000, 130], [1462534000000, 132], [1463534000000, 131], [1464534000000, 136], [1465534000000, 133], [1466534000000, 130], [1467534000000, 132], [1468534000000, 135], [1469534000000, 140], [1470534000000, 137], [1471534000000, 141], [1472534000000, 142], [1473534000000, 137], [1474534000000, 146], [1475534000000, 140], [1476534000000, 147], [1477534000000, 146], [1478534000000, 146], [1479534000000, 149], [1480534000000, 146], [1481534000000, 149], [1482534000000, 149], [1483534000000, 149], [1484534000000, 153], [1485534000000, 149], [1486534000000, 158], [1487534000000, 150], [1488534000000, 159], [1489534000000, 157], [1490534000000, 156], [1491534000000, 154], [1492534000000, 163], [1493534000000, 156], [1494534000000, 157], [1495534000000, 160], [1496534000000, 164], [1497534000000, 163], [1498534000000, 166], [1499534000000, 163], [1500534000000, 170], [1501534000000, 173], [1502534000000, 170], [1503534000000, 175], [1504534000000, 167], [1505534000000, 176], [1506534000000, 174], [1507534000000, 179], [1508534000000, 178], [1509534000000, 177], [1510534000000, 174], [1511534000000, 180], [1512534000000, 176], [1513534000000, 179], [1514534000000, 181], [1515534000000, 179], [1516534000000, 182], [1517534000000, 183], [1518534000000, 186], [1519534000000, 189], [1520534000000, 186], [1521534000000, 185], [1522534000000, 187], [1523534000000, 186], [1524534000000, 191], [1525534000000, 196], [1526534000000, 191], [1527534000000, 196], [1528534000000, 192], [1529534000000, 195], [1530534000000, 195], [1531534000000, 197], [1532534000000, 198], [1533534000000, 204], [1534534000000, 197], [1535534000000, 200], [1536534000000, 208], [1537534000000, 207]], "key": "Count"}, {"values": [[1338534000000, 209], [1339534000000, 214], [1340534000000, 211], [1341534000000, 214], [1342534000000, 206], [1343534000000, 204], [1344534000000, 209], [1345534000000, 209], [1346534000000, 202], [1347534000000, 202], [1348534000000, 206], [1349534000000, 202], [1350534000000, 198], [1351534000000, 204], [1352534000000, 201], [1353534000000, 195], [1354534000000, 203], [1355534000000, 194], [1356534000000, 193], [1357534000000, 198], [1358534000000, 194], [1359534000000, 197], [1360534000000, 188], [1361534000000, 192], [1362534000000, 192], [1363534000000, 186], [1364534000000, 185], [1365534000000, 191], [1366534000000, 187], [1367534000000, 188], [1368534000000, 183], [1369534000000, 180], [1370534000000, 180], [1371534000000, 181], [1372534000000, 177], [1373534000000, 184], [1374534000000, 181], [1375534000000, 178], [1376534000000, 180], [1377534000000, 180], [1378534000000, 177], [1379534000000, 168], [1380534000000, 171], [1381534000000, 174], [1382534000000, 170], [1383534000000, 170], [1384534000000, 165], [1385534000000, 169], [1386534000000, 171], [1387534000000, 170], [1388534000000, 168], [1389534000000, 163], [1390534000000, 164], [1391534000000, 165], [1392534000000, 159], [1393534000000, 161], [1394534000000, 155], [1395534000000, 159], [1396534000000, 151], [1397534000000, 159], [1398534000000, 151], [1399534000000, 156], [1400534000000, 157], [1401534000000, 156], [1402534000000, 146], [1403534000000, 145], [1404534000000, 152], [1405534000000, 146], [1406534000000, 143], [1407534000000, 148], [1408534000000, 143], [1409534000000, 138], [1410534000000, 141], [1411534000000, 137], [1412534000000, 143], [1413534000000, 144], [1414534000000, 134], [1415534000000, 138], [1416534000000, 131], [1417534000000, 136], [1418534000000, 134], [1419534000000, 133], [1420534000000, 132], [1421534000000, 127], [1422534000000, 128], [1423534000000, 129], [1424534000000, 131], [1425534000000, 127], [1426534000000, 127], [1427534000000, 129], [1428534000000, 129], [1429534000000, 126], [1430534000000, 119], [1431534000000, 126], [1432534000000, 119], [1433534000000, 118], [1434534000000, 119], [1435534000000, 112], [1436534000000, 117], [1437534000000, 116], [1438534000000, 117], [1439534000000, 113], [1440534000000, 111], [1441534000000, 107], [1442534000000, 115], [1443534000000, 107], [1444534000000, 104], [1445534000000, 108], [1446534000000, 103], [1447534000000, 108], [1448534000000, 108], [1449534000000, 101], [1450534000000, 99], [1451534000000, 99], [1452534000000, 105], [1453534000000, 104], [1454534000000, 99], [1455534000000, 93], [1456534000000, 95], [1457534000000, 92], [1458534000000, 99], [1459534000000, 93], [1460534000000, 92], [1461534000000, 88], [1462534000000, 90], [1463534000000, 85], [1464534000000, 83], [1465534000000, 92], [1466534000000, 86], [1467534000000, 82], [1468534000000, 79], [1469534000000, 78], [1470534000000, 78], [1471534000000, 77], [1472534000000, 84], [1473534000000, 75], [1474534000000, 80], [1475534000000, 80], [1476534000000, 74], [1477534000000, 74], [1478534000000, 69], [1479534000000, 69], [1480534000000, 70], [1481534000000, 66], [1482534000000, 65], [1483534000000, 74], [1484534000000, 68], [1485534000000, 66], [1486534000000, 65], [1487534000000, 64], [1488534000000, 61], [1489534000000, 67], [1490534000000, 60], [1491534000000, 58], [1492534000000, 56], [1493534000000, 62], [1494534000000, 60], [1495534000000, 58], [1496534000000, 55], [1497534000000, 56], [1498534000000, 55], [1499534000000, 57], [1500534000000, 57], [1501534000000, 47], [1502534000000, 49], [1503534000000, 52], [1504534000000, 49], [1505534000000, 45], [1506534000000, 46], [1507534000000, 45], [1508534000000, 48], [1509534000000, 42], [1510534000000, 44], [1511534000000, 37], [1512534000000, 40], [1513534000000, 36], [1514534000000, 38], [1515534000000, 38], [1516534000000, 37], [1517534000000, 40], [1518534000000, 39], [1519534000000, 31], [1520534000000, 28], [1521534000000, 28], [1522534000000, 28], [1523534000000, 34], [1524534000000, 32], [1525534000000, 26], [1526534000000, 30], [1527534000000, 28], [1528534000000, 29], [1529534000000, 22], [1530534000000, 17], [1531534000000, 19], [1532534000000, 15], [1533534000000, 16], [1534534000000, 18], [1535534000000, 13], [1536534000000, 11], [1537534000000, 20]], "key": "Duration"}].map(function(series) {series.values = series.values.map(function(d) { return {x: d[0], y: d[1] } });return series; });
</script>
</body></html>