File: example_pie.html

Recommend this page to a friend!
  Classes of Arturs Sosins   Easy Chart   example_pie.html   Download  
File: example_pie.html
Role: Example script
Content type: text/plain
Description: Pie type example
Class: Easy Chart
Display several types of charts in Canvas
Author: By
Last change:
Date: 12 years ago
Size: 1,673 bytes


Class file image Download
<!-- /************************************************************* * This script is developed by Arturs Sosins aka ar2rsawseen, * Feel free to distribute and modify code, but keep reference to its creator * * Easy chart package allows you to easily draw chart from provided data. * It supports line, scatter, columns, bars and pie chart types * IT is also possible to set events for interaction with chart data * * For more information, examples and online documentation visit: * **************************************************************/ --> <html> <head> </head> <body> <div id='chart_div' style='float: left; margin-right: 20px;'></div> <div id='legend'></div> <script src="./chart.packed.js" type="text/javascript"></script> <script> var c = new chart("chart_div", { type:"pie", onclick: function(value, label){ alert(label + "(" + value + ")"); }, onmouseover: function(value, label){ var canv = document.getElementById("chart_div"); = "pointer"; = "hand"; var l = document.getElementById("legend"); l.innerHTML = "<p>Label: " + label + "</p><p>Value: " + value + "</p>"; }, onmouseout: function(value, label){ var canv = document.getElementById("chart_div"); = "default"; document.getElementById("legend").innerHTML = ""; }, width: 800, height: 600 }); c.add(10, "green", "Green one"); c.add(50, "red", "Fifty Fifty"); c.add(80, "blue", "80! Enough?"); c.add(100, "yellow", "One hundret"); c.draw(); </script> </body> </html>