UNPKG

dygraphs

Version:

dygraphs is a fast, flexible open source JavaScript charting library.

60 lines (52 loc) 2.01 kB
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>gviz</title> <link rel="stylesheet" type="text/css" href="../dist/dygraph.css" /> <link rel="stylesheet" type="text/css" href="../common/vextlnk.css" /> <script type="text/javascript" src="../dist/dygraph.js"></script> <script type="text/javascript" src="https://www.google.com/jsapi"></script> <script type="text/javascript"><!--//--><![CDATA[//><!-- Dygraph.onDOMready(function onDOMready() { google.load('visualization', '1', {packages: ['linechart']}); function createDataTable(dateType) { data = new google.visualization.DataTable(); data.addColumn(dateType, 'Date'); data.addColumn('number', 'Column A'); data.addColumn('number', 'Column B'); data.addRows(4); data.setCell(0, 0, new Date("2009/07/01")); data.setCell(0, 1, 1); data.setCell(0, 2, 7); data.setCell(1, 0, new Date("2009/07/08")); data.setCell(1, 1, 2); data.setCell(1, 2, 4); data.setCell(2, 0, new Date("2009/07/15")); data.setCell(2, 1, 3); data.setCell(2, 2, Infinity); data.setCell(3, 0, new Date("2009/07/22")); data.setCell(3, 1, 4); data.setCell(3, 2, 0); return data; } function drawVisualization() { data = createDataTable('date'); new google.visualization.LineChart( document.getElementById('gviz')).draw(data, null); var chart1 = new Dygraph.GVizChart(document.getElementById('dygraphs')) .draw(data, { }); } google.setOnLoadCallback(drawVisualization); }); //--><!]]></script> </head> <body> <p>This tests that infinite values don't break dygraphs.</p> <p>gviz line chart:</p> <div id="gviz" style="width:600px; height:300px;"></div> <p>same data drawn using dygraphs:</p> date column: <div id="dygraphs" style="width:600px; height:300px;"></div> </body> </html>