新手必看】Highcharts的100个基础问答
新手必看】Highcharts的100个基础问答
2014-12-2 10:59| 发布者: Mr.Zhang| 查看: 2749| 评论: 3|来自: Highcharts中文论坛
为了方便说明,先贴出Highcharts主要组成部分的说明图 图1:highcharts主要组成部分 图中名字解释:
1、图表中的 highcharts.com 怎么去掉? 答:通过设置 credits.enabled= false 即可,即
credits: {
enabled:false
}
另外,该文字及连接都是可以自定义的, 详见 API credits
2、如何增加导出功能(或显示导出按钮)?
答:通过引入 exporting.js 即可给图表增加导出功能,即添加如下代码
同理,如果不想要导出功能,不引入exporting.js 即可,另外,禁用导出功能还可以通过设置 exporting.enabled = false,详见API exporting.enabled
3、如何去掉图例(legend)?
答:设置 legend.enable = false 即可,即
legend: {
enabled:false
}
饼图需要设置 plotOptions.pie.showInLegend = true 才可显示图例。
4、如何设置图表颜色
1)最基本的图表线条(或柱形等),是通过 colors 来设置的,即
colors: ['#7cb5ec', '#434348', '#90ed7d', '#f7a35c', '#8085e9','#f15c80', '#e4d354', '#8085e8', '#8d4653', '#91e8e1']
其中颜色值及个数完全可以自定义
2)定义某个点的颜色
通过设置 series.data.color 实现对某个点进行自定义颜色,实例效果如下
3)对于柱状图单个序列不同柱形颜色自定义,除了设置 colors外,还需要额外设置 plotOptions.column.colorByPoint = true ,其他类型图表类似的也有
5、如何将图表中的英文汉化(显示成中文)?
即设置 lang 属性,改属于用于图表中文字的显示,也就是说,图表中所有文字的修改都可以通过该属性下来设置。
实例代码: Highcharts.setOptions({ lang:{ contextButtonTitle:"图表导出菜单", decimalPoint:".", downloadJPEG:"下载JPEG图片", downloadPDF:"下载PDF文件", downloadPNG:"下载PNG文件", downloadSVG:"下载SVG文件", drillUpText:"返回 {series.name}", loading:"加载中", months:["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"], noData:"没有数据", numericSymbols: [ "千" , "兆" , "G" , "T" , "P" , "E"], printChart:"打印图表", resetZoom:"恢复缩放", resetZoomTitle:"恢复图表", shortMonths: [ "Jan" , "Feb" , "Mar" , "Apr" , "May" , "Jun" , "Jul" , "Aug" , "Sep" , "Oct" , "Nov" , "Dec"]., thousandsSep:",", weekdays: ["星期一", "星期二", "星期三", "星期三", "星期四", "星期五", "星期六","星期天"]. } }); $("#container").highcharts({ // Highcharts 代码 }); 注意:Highcharts.setOptions({}) 属于全局配置,代码是放在 $("#container").highcharts({}) 外面。
6、如何去掉图例单击事件?
即如何使点击图例(Legend)不隐藏对应的序列(Series),设置代码是:
plotOptions: {
series: {
events: {
legendItemClick: function(event) {
return false; //return false 即可禁用LegendIteml,防止通过点击item显示隐藏系列
}
}
}
}
7、如何在初始化的时候隐藏某个线条(或序列Series)?
对应的效果是
即默认隐藏某个(或多个)线条,实现代码是 series: [{ data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4], visible: false//默认不显示 }, { data: [144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2], }] 该代码出自在线演示:通过点击图例显示与隐藏数据列 那么问题来了,眼神好的小伙伴就又有疑惑了,“visible” 这个属性在API中没有的,为什么你可以这么做? 答:“在api中没有的属性在样例中却使用了这是什么个意思?” “您真是个活字典”, !-_- |
新手必看】Highcharts的100个基础问答的更多相关文章
- 新手必看,史上最全的iOS开发教程集锦,没有之一!
最近大火的iPhone XS Max和iPhone XS,不知道有没有同学已经下手了呢?一万三的价位确实让很多人望而却步啊.据说为了赢得中国的用户,专门出了双卡双待的,可想而知中国市场这块“肥肉”人人 ...
- k8s新手必看
转载自https://juejin.im/post/6844903840139968520 Kubernetes零基础快速入门!初学者必看! 起源 Kubernetes 源自于 google 内部的服 ...
- (转)新手必看:HighCharts几个基础问答
转自:http://bbs.hcharts.cn/article-21-1.html
- 新手必看ES6基础
ES6 基础 一.新的变量声明方式 let/const 与var不同,新的变量声明方式带来了一些不一样的特性,其中最重要的两个特性就是提供了块级作用域与不再具备变量提升. 通过2个简单的例子来说明这两 ...
- C# 利用委托事件进行窗体间的传值(新手必看)
引言: 窗体间传值是每个学习WinForm新手的常见问题,最初级的方法就是 在窗体中先获取到要接受值窗体.然后通过.得到某个空间或者属性,直接赋值,这个需要接收放的窗体属性或者空间必须是public ...
- java 新手必看大全
背景:c#开发人员 学习java 新手一枚.只适合新手 1:配置java环境 (win10环境参考本目录java环境配置) 2:IDEA 熟悉开发工具 (当初没学java 很大的一个原因就是工具e文 ...
- iOS-上架APP之启动页设置(新手必看!)
今天自己做的小作品准备提交,就差一个启动页,各种百度,各种搜,结果还好最后终于出来了,和大家分享一下,这个过程中遇到的各种小问题.(注XCode版本为7.2) 1.启动页一般都是图片,因为苹果有4,4 ...
- [转]Web.config配置文件详解(新手必看)
本文转自:http://www.cnblogs.com/gaoweipeng/archive/2009/05/17/1458762.html 花了点时间整理了一下ASP.NET Web.config配 ...
- 转:Web.config配置文件详解(新手必看)
转:http://www.cnblogs.com/gaoweipeng/archive/2009/05/17/1458762.html 花了点时间整理了一下ASP.NET Web.config配置文件 ...
随机推荐
- wimdows安装mongodb,开机启动
> d: > cd D:\Program Files\MongoDB\Server\3.0\bin > .\mongod --logpath "D:\Program Fil ...
- HDFS relaxes a few POSIX requirements to enable streaming access to file system data
https://hadoop.apache.org/docs/r2.7.2/hadoop-project-dist/hadoop-hdfs/HdfsDesign.html Introduction [ ...
- error LNK2022: metadata operation failed (801311D6) : Differing number of methods in duplicated types
本文主要是记录一个C++编译错误的解决方案,具体错误请看本文标题. 这个错误主要是由Managed C++的增量编译导致的,这是VS 2008的一个bug,在VS 2010已经修复,我使用的正式201 ...
- ul和li 基本用法分析(这里主要想学习怎么用在导航栏中)
常用作:导航,少量数据表格,居中 一.做导航,居中 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...
- 获取原生的DOM方式,DIY脚手架,vue-cli的使用
一 . 获取原生的DOM的方式 在js中,我们可以通过id, class 或者标签获取DOM元素,vue中也为我们提供了获取原生DOM的方法,就是给标签或者组件添加 ref 属性,通过 this.$r ...
- Machine Learning No.3: Logistic Regression
1. Decision boundary when hθ(x) > 0, g(z) = 1; when hθ(x) < 0, g(z) = 0. so the hyppthesis is: ...
- 分享知识-快乐自己:JAVA中的 Iterator 和 Iterable 区别
java.lang.Iterable java.util.Iterator Iterator是迭代器类,而Iterable是接口. 好多类都实现了Iterable接口,这样对象就可以调用itera ...
- MySQL存储过程示例
MySQL存储过程: /*自定义结束符*/ DELIMITER $$ /*如果存在同名的存储过程就删除*/ DROP PROCEDURE IF EXISTS prAddBlack$$ /*创建存储过程 ...
- openfire build
1. build path: a) source folder:包括openfire和各插件的代码. b) libraries:build/lib下jar包和插件下jar包,jdk/lib/tools ...
- redis数据
毫无疑问,Redis开创了一种新的数据存储思路,使用Redis,我们不用在面对功能单调的数据库时,把精力放在如何把大象放进冰箱这样的问题上,而是利用Redis灵活多变的数据结构和数据操作,为不同的大象 ...