27 มกราคม 2558

Try dygraphs

            Dygraphs เป็นอีกทางเลือกหนึ่งสำหรับการสร้าง Data Visualization ข้อดีคือ สามารถใช้งานได้ฟรี ลักษณะการทำงานคล้ายกับ processing.js คือเขียนเป็นสคริปสั้นๆ ก็สามารถสร้างกราฟอย่างง่ายได้ทันที แต่มีข้อเสียคือ สามารถสร้างได้เพียงกราฟในลักษณะกราฟเส้น เท่านั้น และค่าของแกน x สามารถเป็นได้เพียงตัวเลข หรือวันที่ เท่านั้น
ข้อมูล จำนวนผู้เสียชีวิต 7 วันอันตรายปี 2015 (30/12/2014 – 05/01/2015)
30/12/2014 เสียชีวิต 56 คน
31/12/2014 เสียชีวิต 62 คน
01/01/2015 เสียชีวิต 60 คน
02/01/2015 เสียชีวิต 32 คน
03/01/2015 เสียชีวิต 15 คน
04/01/2015 เสียชีวิต 12 คน
05/01/2015 เสียชีวิต 32 คน
ตัวอย่าง สคริปอย่างง่าย

<html>
<head>
<script src="http://dygraphs.com/1.1.0/dygraph-combined.js" type="text/javascript"></script>
</head>
<body>
<div id="graph">
</div>
<script type="text/javascript">
    g = new Dygraph(document.getElementById("graph"),

    // data
    "Date,The Number of Death\n" +
    "2014-12-30,56\n" +
    "2014-12-31,62\n" +
    "2015-01-01,60\n" +  
    "2015-01-02,32\n" +  
    "2015-01-03,15\n" +
    "2015-01-04,12\n" +
    "2015-01-05,32\n",
    {
    // options
      legend: 'always',
      animatedZooms: true,
      title: '7 Critical Day'
    });
</script>
</body>
</html>


ไม่มีความคิดเห็น:

แสดงความคิดเห็น