生活随笔
收集整理的這篇文章主要介紹了
Echarts给坐标轴添加自定义属性
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
給yAxis添加自定義屬性myname,如下:
運行效果
完整源碼
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><title>echarts
</title><script src="static/js/echarts.js"></script></head><body><div id="main" style="width: 600px;height:400px;"></div><script type="text/javascript">var a = 123; var myChart = echarts.init(document.getElementById('main'));var option = {title: {text: '溫度-降水量示例'},tooltip: {show: true,trigger: 'axis',axisPointer: {type: 'cross',animation: false,label: {show: true,backgroundColor: '#0D4286'}}},toolbox: {show: true,feature: {mark: {show: true},dataZoom: {yAxisIndex: 0},dataView: {show: true,readOnly: false,},magicType: {show: true,type: ['line', 'bar']},restore: {show: true,},saveAsImage: {show: true,}}},legend: {data: ['降水量', '降水量1']},dataZoom: [{id: 'dataZoomX',show: true,realtime: true,orient: "horizontal",start: 0,end: 50,dataBackground: {lineStyle: {color: '#95BC2F'},},textStyle: {color: "#ffffff"},}, ],xAxis: {type: 'category',axisLabel: {rotate: 45,textStyle: {fontSize: '8'}},data: ['2019-01-01', '2019-01-02', '2019-01-03', '2019-01-04', '2019-01-05', '2019-01-06', '2019-01-07','2019-01-08']},yAxis: [{myname:'HQING',type: 'value',name: '水量',min: 0,max: 120,interval: 50,axisLabel: {formatter: '{value}毫升'}}],series: [{name: '降水量',type: 'line',yAxisIndex: 0,data: [80, 89, 85, 108, 109, 120]}, {name: '降水量1',type: 'line',yAxisIndex: 0,data: [86, 98, 90, 120, 117, 126]}, ]};myChart.setOption(option);console.log(option.yAxis[0].myname);</script></body>
</html>
</html>
總結
以上是生活随笔為你收集整理的Echarts给坐标轴添加自定义属性的全部內容,希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。