JSCharts 免费的网页统计图表生成 JavaScript 插件
JScharts 是一个用来在浏览器上直接绘制图表的 JavaScript 工具包，JScharts 支持柱状图、圆饼图以及简单的曲线图。直接将这个库引入进网页，然后从 XML 文件或 JavaScript 数组变量调用数据。生成的图表可保存为 PNG 格式，兼容所有主要浏览器。
安装启用
1、只有一个 JavaScript 文件被包括在内，它主要包含代码和 Canvas 的功能与 Internet Explorer 兼容。
<script type="text/javascript" src="jscharts.js"></script>
包括脚本文件到你的页面 <head>，jscharts.js 包含主要的图表插件，代码很容易画文本在图表和帆布的 Internet Explorer 所需的功能，在 Firefox、Opera 和 Safari 来实现。
2、Container
第二步是准备容器将举行一个图表。这可以是一个简单的 <div> 标签。它是强制性的标签有一个独特的 ID 集。
<div id="chartcontainer"> This is just a replacement in case Javascript is not available or used for SEO purposes </div>
容器的例子容器的内容将被 jscharts。
3、First chart
接下来编写几行 JavaScript 代码是你的第一个图需要。 首先，图表数据准备，一个简单的数组包含其他 阵列，每两个元素。这两个元素的数组 代表一个线图形中的一个点，或者一条条形图，或 在一个饼图饼节。 该数据存储在 MYDATA 变量如下。
<script type="text/javascript">
var myData = new Array([10, 20], [15, 10], [20, 30], [25, 10], [30, 5]);
var myChart = new JSChart('chartcontainer', 'line');
myChart.setDataArray(myData);
myChart.draw();
</script>简单的线图
- 第二行初始化图所提供的容器的 ID、图表类型（可能值线，条形图和饼图）。
- 第三线介绍数据的 JSChart 对象。
- 最后第四行执行图的绘制。
<script type="text/javascript">
var myData = new Array(['unit', 20], ['unit two', 10], ['unit three', 30], ['other unit', 10], ['last unit', 30]);
var myChart = new JSChart('chartcontainer', 'bar');
myChart.setDataArray(myData);
myChart.draw();
</script>示例下载：JSCharts3_demo
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论