图表插件Charts.js的使用

Charts.js的介绍自行百度 首先下载Charts.js,官网:http://chartjs.cn/

charts.js 托管在了github上,下载下来后加解压出src中的文件即可。其中有charts.js文件,其中就是对其他文件的引用。

开始使用:

具体的使用咋官网Api中都有详细的说明,可自行查阅,传送门:http://www.chartjs.org/docs/#chart-configuration-chart-data

<script src="Chart.js"></script>

为了创建图表,我们要实例化一个Chart对象。为了完成前面的步骤,首先需要需要传入一个绘制图表的2d context。

<canvas id="myChart" width="400" height="400"></canvas>

时间: 2024-10-07 10:13:05

图表插件Charts.js的使用的相关文章

提供一个好用的图表插件(js图表类库)颠覆性的设计器

图表类库,大家肯定想到Hghcharts,Echarts这类通过给API接口来作图的工具.今天介绍的这个Okaycharts,api接口和文档也提供,但设计性的提供了一个图表设计器,通过可视化的编辑,做出相应的图表,最后一键复制js,拿到调用js库的代码~当然也有api文档,提供给有特殊需求的图表. 网址是www.okaycharts.com可以自己去看看,有介绍和帮助文档,这里不做赘述. 这里是okaycharts设计器的界面图.首先选择图形种类,折线图柱状图条形图,饼图环形图仪表盘,股价图堆

图表插件dygraphs.js插件使用

本文旨在记录自己的使用过程 dygraphs其实和echarts差不多,个人觉得前者的自我定制功能很强且不是基于canvas所以性能较echarts会好很多.下面开始: 1.准备一个div <div id="container_dy" style="width:600px; height:300px;"></div> 2.数据准备及数据格式要求 dygraphs官网对数据格式给出了五种说明(http://dygraphs.com/data.h

移动端图表插件jChart.js的修改

注: 1.我自己都忘了改哪里,反正是改了一些bug 2.原项目地址是https://github.com/shixy/JChart window.JingleChart = JChart = { version : '0.1', animationOptions : { linear : function (t){ return t; }, easeInQuad: function (t) { return t*t; }, easeOutQuad: function (t) { return -

js图表插件

1. Flotr2 Flotr2 是个独立框架库,支持HTML5图表和图形.它是 flotr 的一个分支版本,移除了 Prototype 依赖性,并且有很多改进.支持:线图.条图.蜡状图.饼图.气泡图.诸如 IE6 类的老浏览器也支持. 2. Rickshaw Rickshaw 是个用于创建交互式时序图的JS工具.它依赖 D3 可视化库和其他一些 jQuery 和 jQuery UI 的插件. 3. D3 D3 是一款著名且高效的可视化库. 4. Awesome Chart JS Awesome

【jQuery】兼容IE6的图表插件Highcharts

在网页中有时候需要画出统计图,尤其是一些OA系统中,这样能够给各位看官一个直观的数据显示.图表用很多东西都能画出来,比如JSP可以利用JAVA本身就有的绘图函数,php有jpgraph插件,具体请看<[php]使用jpgraph完成投票系统的普通用户部分>(点击打开链接),等等,但毕竟属于现实层的内容,还是用前端插件更好一点.网上的JavaScript/jQuery图标插件到处东西,但是试过JS charts还是觉得Highcharts图表插件最好.因为它兼容IE6.其它不兼容IE6的东西太先

wx-charts 微信小程序图表插件

阅读数:9460 微信小程序图表插件(wx-charts)基于canvas绘制,体积小巧,支持图表类型饼图.线图.柱状图 .区域图等图表图形绘制,目前wx-charts是微信小程序图表插件中比较强大好使的一个 支持图标类型 饼图 pie 圆环图 ring 线图 line 柱状图 column 区域图 area 雷达图 radar 如何使用? 直接引用编译好的文件 dist/charts.js(js下载地址) .wxml中定义 <canvas canvas-id="lineCanvas&qu

JQuery中jsCharts图表插件(十)

一:1.jsCharts图表插件 注意:从官方下来的例子都没指定页面编码,在这种情况下,浏览器就会使用默认设置中文编码:GB2312,GBK等:导致无法执行. 请在html代码中的<head></head>标签对里加入 <meta http-equiv=”content-type” content=”text/html;charset=utf-8″>,也就是指定页面编码[只要不是中文编码就行] 2.下载地址: 官方地址:http://www.jumpeyecompone

推荐10款免费而优秀的图表插件

开发人员很多时候需要使用图表来表现一些数据,而一张图表往往能够比几行密密麻麻的数字表格更能直观地展示数据内容.随着Web技术的发展,从传统只能依靠于flash.IE的vml,各个浏览器尚不统一的svg,到如今规范统一的canvas.svg为代表的html5技术,表现点.线.面要素的技术已经越来越规范成熟.我在本篇文章中收集了10款免费开源且比较优秀的图表制作插件,以供各位参考. 1,ichartjs(国产) ichartjs是一款优秀的国产开源插件,作者是王鹤,英文名taylor,毕业于南昌大学

[转载]jQuery 图表插件 jqChart 使用

jQuery 图表插件 jqChart显示效果效果非常好.支持以下几种图表: Area Bar Bubble Column Financial Chart - Candlestick Financial Chart - Stock Line Pie Radar Area Radar Line Radar Spline Area Radar Spline Scatter Spline Area Spline Stacked Column Stacked Bar 可见支持的种类非常之多.在这里我们使