This tutorial demonstrates how to use a CSV file to plot a chart graph using DyGraph jQuery API which is a JavaScript. Dygraphs is a fast, flexible open source JavaScript charting library.It allows users to explore and interpret dense data sets. Check dygraphs tutorials and gallery for more. Here goes the code:
<html>
<head>
<script type="text/javascript" src="/Scripts/dygraph-combined-dev.js"></script>
</head>
<body>
<div id="graphdiv2" style="width: 100%; height: 100%;">
</div>
<script type="text/javascript">
g2 = new Dygraph(
document.getElementById("graphdiv2"),
"timecpu.csv",
{
xlabel: " Time (ms) --> ",
ylabel: " Usage (%) -->",
title: "Time vs System Load",
showRangeSelector: true,
rangeSelectorHeight: 30,
rangeSelectorPlotStrokeColor: 'black',
rangeSelectorPlotFillColor: 'grey'
}
);
</script>
</body>
</html>
Output:
CSV file: http://www.mediafire.com/view/ikgimeqo24onna4/timecpu.csv
DyGraph JavaScript: http://dygraphs.com/download.html
No comments:
Post a Comment
Note: Only a member of this blog may post a comment.