HTML之环形图

HTML之环形图,第1张

Chart.js允许通过HTML5的canvas进行图表绘制。这里我们希望绘制一个环形图,点击图上各segment时可以显示自定义的圆形tooltip。Chart.js支持通过几个变量添加tooltip,它提供一个tooltipTemplate但是却不支持自定义tooltip的HTML!于是决定自行绘制tooltip手动添加上去。

在 HTML 页面上显示出有交互的统计图有2种方法:

一、用JavaScript做出饼状图或柱形图,需要精通JS代码。

二、利用第三方网站提供的组件

1、Open Flash Chart是一个开源的Flash制图组件。

2、 XML SWF Charts是一个简单,但强大,利用Flash和动态生成XML数据来产生web chart的工具。

3、 Flotr是一个基于Prototype开发的javascript绘图工具。支持图例,鼠标跟踪,图片区域选择,图片缩放,添加事件钩子(event hook),通过CSS设置样式等。

4、FusionCharts Free是一个制图组件用于创建好看,数据驱动,拥有动画效果的Flash charts。它能够与PHP、Python、Ruby on Rails、ASP、http://ASP.NET、JSP、ColdFusion、HTML页面等一起使用。这个组件是FusionCharts的免费版,但功能仍然很强大。

html5的画布,用JS *** 作算出统计数据百分比然后生成图像,这个和css没什么关系。

百度:html5 Canvas

这种东西你自己开发麻烦,就用你图中这种开发好的现成js库,看看参数说明调用就能生成..


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7667410.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-08
下一篇 2023-04-08

发表评论

登录后才能评论

评论列表(0条)

保存