highcharts 基本组成

  最近一个项目,用到了图表,找了很多,发现Highcharts 这个纯js的图表插件非常好用,功能强大。做个笔记,备用。

 

基本构成,见图:

 

在上图中,显示了做图表时最常配置的几个项目:

 

xAxisX坐标
yAxisy坐标
Credits版权信息
legend图例
exporting导出选项
Title  标题
tooltiptip提示
Series图表上一个或多个数据系列,比如图表中的一条曲线,一个柱形
  

 

图表类型

英文名中文名
line直线图
spline曲线图
area面积图
areaspline曲线面积图
arearange面积范围图
areasplinerange曲线面积范围图
column柱状图
columnrange柱状范围图
bar条形图
pie饼图
scatter散点图
boxplot箱线图
bubble气泡图
errorbar误差线图
funnel漏斗图
gauge仪表图
waterfall瀑布图
polar雷达图
pyramid金字塔

 常用的图表类型大概是:line,pie,bar,column几种了。

 

配置基本代码:

var chart = new Highcharts.Chart({
chart: {},  //图表全局选项

title: {},

subtitle: {},
xAxis: {}, //x坐标
yAxis: {},//y坐标

tooltip: {},//tip提示
plotOptions: { },// 图表区域的设置
legend: {},//图例
credits: {},//版权商标
series: [{}] // 图表数据列

});

转载于:https://www.cnblogs.com/xinchuang/p/4051742.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值