chart.js参数问题
2015-11-12 14:06
495 查看
var lineChartData = { labels : ["09/12","09/13","09/14","09/15","09/16","09/17","09/18"], //X轴 坐标 datasets : [ { fillColor : "transparent", // 背景色 strokeColor : "#ef7c1f", // 线 pointColor : "#ef7c1f", // 点 pointStrokeColor : "#fff", // 点的包围圈 data : [120,140,110,130,150,170,160] // Y轴坐标 }, { fillColor : "transparent", strokeColor : "#3dc448", pointColor : "#3dc448", pointStrokeColor : "#fff", data : [80,90,80,100,110,130,100] } ] } var defaults = { //Boolean - If we show the scale above the chart data scaleOverlay : false, //Boolean - If we want to override with a hard coded scale scaleOverride : false, //** Required if scaleOverride is true ** //Number - The number of steps in a hard coded scale scaleSteps : null, //Number - The value jump in the hard coded scale scaleStepWidth : 20, // Y 轴的起始值 scaleStartValue : null, // Y/X轴的颜色 scaleLineColor : "rgba(0,0,0,.1)", // X,Y轴的宽度 scaleLineWidth : 1, // 刻度是否显示标签, 即Y轴上是否显示文字 scaleShowLabels : true, // Y轴上的刻度,即文字 scaleLabel : "<%=value%>", // 字体 scaleFontFamily : "'Arial'", // 文字大小 scaleFontSize : 12, // 文字样式 scaleFontStyle : "normal", // 文字颜色 scaleFontColor : "#666", // 是否显示网格 scaleShowGridLines : false, // 网格颜色 scaleGridLineColor : "rgba(0,0,0,.05)", // 网格宽度 scaleGridLineWidth : 2, // 是否使用贝塞尔曲线? 即:线条是否弯曲 bezierCurve : false, // 是否显示点数 pointDot : true, // 圆点的大小 pointDotRadius : 8, // 圆点的笔触宽度, 即:圆点外层白色大小 pointDotStrokeWidth : 2, // 数据集行程 datasetStroke : true, // 线条的宽度, 即:数据集 datasetStrokeWidth : 2, // 是否填充数据集 datasetFill : false, // 是否执行动画 animation : true, // 动画的时间 animationSteps : 60, // 动画的特效 animationEasing : "easeOutQuart", // 动画完成时的执行函数 onAnimationComplete : null } var myLine = new Chart(document.getElementById("canvas").getContext("2d")).Line(lineChartData, defaults);
相关文章推荐
- JQuery1——基础($对象,选择器,对象转换)
- Android学习笔记(二九):嵌入浏览器
- Android java 与 javascript互访(相互调用)的方法例子
- JavaScript演示排序算法
- javascript实现10进制转为N进制数
- 2019年开发人员应该学习的8个JavaScript框架
- HTML中的script标签研究
- 对一个分号引发的错误研究
- 异步流程控制:7 行代码学会 co 模块
- ES6 走马观花(ECMAScript2015 新特性)
- JavaScript拆分字符串时产生空字符的原因
- Canvas 在高清屏下绘制图片变模糊的解决方法
- JavaScript 各种遍历方式详解
- call/apply/bind 的理解与实例分享
- IE8开发人员工具教程(二)
- 在flex中执行一个javascript方法的简单方式
- Flex结合JavaScript读取本地路径的方法
- Ruby on Rails中jquery_ujs组件拖慢速度的问题解决