日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 > 编程资源 > 编程问答 >内容正文

编程问答

echarts-锥型柱状图

發布時間:2023/12/14 编程问答 23 豆豆
生活随笔 收集整理的這篇文章主要介紹了 echarts-锥型柱状图 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

代碼:

<div class="leftCard" id="hiddenDanger" ref="hiddenDangerRef"></div><script> mounted(){this.getCharts() }, methods:{getCharts() { let chartDom = document.getElementById('hiddenDanger');let myChart = this.$echarts.init(chartDom);this.option = {tooltip: {trigger: 'axis',},xAxis: {type: 'category',data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],triggerEvent: true,axisTick: {alignWithLabel: true,show: false,},axisLine: {lineStyle: {color: '#D3EBFF',type: 'solid'}},axisLabel: {textStyle: {color: '#D3EBFF',fontSize: '18'}}},yAxis: {type: 'value',name: '單位:條',min: 0,interval: 100,nameTextStyle: {color: '#D3EBFF',fontSize: 18,nameLocation: 'start',},splitLine: {show: true,lineStyle: {type: 'dashed',color: '#35618B'}},axisLabel: {textStyle: {color: '#D3EBFF',fontSize: '18'}}},series: [{emphasis: {itemStyle: {opacity: 1}},data: [136, 260, 280, 165, 220, 260, 158, 165, 40, 130, 290, 210],type: 'pictorialBar',barCategoryGap: '-80%',/*多個并排柱子設置柱子之間的間距*/symbol:'path://M0,10 L10,10 C5.5,10 5.5,5 5,0 C4.5,5 4.5,10 0,10 z',itemStyle: {normal: {color: 'rgba(9, 136, 204, 0.3500)'}},z: 10,}]}; myChart.setOption(this.option);}, }</script>

?

總結

以上是生活随笔為你收集整理的echarts-锥型柱状图的全部內容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。