EChart使用心得(三)K线图折线图…

本文介绍了如何使用ECharts库创建K线图和折线图,详细展示了配置代码,包括设置标题、提示框、图例、工具箱、数据缩放控件、坐标轴和数据标注等,提供了实际的ECharts实例。
摘要由CSDN通过智能技术生成
EChart使用心得(三)K线图折线图混合事例
代码如下:数据改动,估计我最后在写一个多图联动就不搞了
var myChart = echarts.init(document.querySelector("#main"));
var option = {
title : {
text: '博雅数据'//左上角名字
},
tooltip : { //提示框
trigger: 'axis', //触发类性
formatter: function (params) {
var res = params[0].name;
for (var i = params.length - 1; i >= 0; i--) {
if (params[i].value instanceof Array) {
res += '
'
+ params[i].seriesName;
res += '
开盘 : '
+ params[i].value[0] + ' 最高 : ' + params[i].value[3];
res += '
收盘 : '
+ params[i].value[1] + ' 最低 : ' + params[i].value[2];
}
else {
res += '
'
+ params[i].seriesName;
res += ' : ' + params[i].value;
}
}
return res;
}
},
legend: {
data:['上证指数','成交金额(万)'] //图中的两个显示数据
},
toolbox: { //工具箱
show : true, //显示
backgroundColor: 'yellow', //工具箱的背景颜色
feature : { //启用功能,工具箱自定义功能回调处理
mark : { show: true}, //辅助线开关 总共三个开关
dataZoom : { show: true}, //框选区域缩放开关 两个开关
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值