chart.js插件生成折线图时数据普遍较大时Y轴数据不从0开始的解决办法[bubuko.com]
chart.js插件生成折线图时数据普遍较大时Y轴数据不从0开始的解决办法,原文:http://bubuko.com/infodetail-328671.html
默认情况下如下图
Y轴并不是从0开始,这样折现图的幅度会很大,不是正常的幅度,解决办法如下,
示例代码:
window.onload = function () {
var ctx = document.getElementById("canvas").getContext("2d");
window.myLine = new Chart(ctx).Line(lineChartData, {
scaleOverride :true , //是否用硬编码重写y轴网格线
scaleSteps : 15, //y轴刻度的个数
scaleStepWidth : 300, //y轴每个刻度的宽度
scaleStartValue : 0, //y轴的起始值
pointDot : true, //是否显示点
pointDotRadius : 5, //点的半径
pointDotStrokeWidth : 1,//点的线宽
datasetStrokeWidth : 3, //数据线的线宽
animation : true, //是否有动画效果
animationSteps : 60 //动画的步数
} );
}
核心代码:
scaleOverride :true , //是否用硬编码重写y轴网格线
scaleSteps : 15, //y轴刻度的个数
scaleStepWidth : 300, //y轴每个刻度的宽度
scaleStartValue : 0, //y轴的起始值
这样就会得到下面的效果,Y轴从0开始
http://bubuko.com/analysis-201408.html
chart.js插件生成折线图时数据普遍较大时Y轴数据不从0开始的解决办法[bubuko.com]的更多相关文章
- 超酷HTML5 Canvas图表应用Chart.js自定义提示折线图
超酷HTML5 Canvas图表应用Chart.js自定义提示折线图 效果预览 实例代码 <div class="htmleaf-container"> <div ...
- 使用Highcharts生成折线图_at last
//数据库数据的读取,读取数据后数据格式的转换,还有highchart数据源的配置,伤透了脑筋. anyway,最终开张了.哈哈! 数据库连接:conn_orcale.php <?php $db ...
- 利用JFreeChart生成折线图 (4) (转自 JSP开发技术大全)
利用JFreeChart生成折线图 (4) (转自 JSP开发技术大全) 14.4 利用JFreeChart生成折线图 通过JFreeChart插件,既可以生成普通效果的折线图,也可以生成3D效果的折 ...
- 原生JS实现动态折线图
原生JS实现动态折线图 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> & ...
- 斯坦福大学公开课机器学习:machine learning system design | data for machine learning(数据量很大时,学习算法表现比较好的原理)
下图为四种不同算法应用在不同大小数据量时的表现,可以看出,随着数据量的增大,算法的表现趋于接近.即不管多么糟糕的算法,数据量非常大的时候,算法表现也可以很好. 数据量很大时,学习算法表现比较好的原理: ...
- storm正常任务数据量过大时造成定时任务不执行的问题
在执行storm的定时任务时,发现storm普通任务数据量过大时造成定时任务不执行, 同时设置了storm的普通任务和定时任务,定时任务设置5秒执行1次. 普通任务的数据时从spout中不停发射字符串 ...
- Mysql数据量较大时分页查询优化
据表 collect ( id, title ,info ,vtype) 就这4个字段,其中 title 用定长,info 用text, id 是主键,vtype是int,vtype是索引. 最后co ...
- Highcharts属性与Y轴数据值刻度显示Y轴最小最大值
Highcharts 官网:https://www.hcharts.cn/demo/highcharts Highcharts API文档:https://api.hcharts.cn/highcha ...
- 使用Highcharts生成折线图与曲线图
折线图与曲线图可以显示随时间而变化的连续数据,因此非常适用于显示在相等时间间隔下数据的趋势.本文将结合Highcharts,生成一个城市气温变化折线图和一个随时间动态即时显示CPU走势的曲线图. 如果 ...
随机推荐
- android性能测试与调优:使用 DDMS 查看内存分配情况
1. 启用自己的APK后 2. 点击左边更新heap 3. 点击右边的heap中的垃圾回收cause GC,等待数秒出现回收内存与数据情况(由于内存回收了APK运行出现异常crash) 4. 点击一个 ...
- 锤子手机T2 屏幕录像文件保存在哪里?
在根目录下的 /Video/ScreenRecorder 下面 转至: http://30daydo.com/article/115
- pointer to function
指针.函数.数字.结构体.指针函数.函数指针 初学不好区分,做点儿实验来有效区分一下,以下代码采用dev-C++平台测试 //pointer to fucntion 函数功能是 基地址加偏移量得到偏移 ...
- USACO 刷水
BZOJ 1666 水.. BZOJ 1579 分层图最短路. BZOJ 1782 从一开始若某头牛停在U,那么U的子树的时间都会加一用BIT维护DFS序就行了 BZOJ 1572 贪心+堆 排序后查 ...
- SE homework2
1. (1) Fault: for循环语句中的条件表达式i > 0,不能检查到数组的第一个元素,应该为 i >= 0 . (2) test:x=[]:y=3 Expected = -1 A ...
- HDU5950(矩阵快速幂)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5950 题意:f(n) = f(n-1) + 2*f(n-2) + n^4,f(1) = a , f(2 ...
- JAVA(1)
java开发第一步就是学习相关知识,打牢基础是关键,下面就和小编我一起从java基础学起吧,一起加油! java方向主要包括三大块: java se 桌面开发 java ee web开发 java m ...
- Linux 防火墙开放特定端口 (iptables)
iptables是linux下的防火墙,同时也是服务名称. service iptables status 查看防火墙状态 service iptables start ...
- iOS 崩溃日志 Backtrace的符号化
iOS的崩溃日志配合dsym文件可以找到崩溃时的backtrace,这是解决崩溃的最重要的信息. 如果是在同一台mac上打包, 导入crash log时候会自动将backtrace符号化,可以看到方法 ...
- 关于C语言的问卷调查(补交)
你对自己的未来有什么规划?做了哪些准备?(还是处于比较迷茫的状态:我做的准备是吧自己对计算机的兴趣提起来!) 你认为什么是学习?学习有什么用?现在学习动力如何?为什么?(学习就是学自己不会的东西:增加 ...