重點： 后臺返回的是數組，獲取返回字符串，封裝成js數組對象，否則echat數據無效

自定義Y軸坐標，Y軸的比例數組跟，柱狀圖的MAX值與MIX值，必須設置，否則圖標無效

<td class="tab-border"><div id="passenger_yoy_main1" style="width: 24vw;height:25vh;"></div></td> //Y軸比例數組var scaleArr=new Array([10, 20, 30, 40, 50, 60, 70, 80]);//柱狀圖最大值var scaleMaxY=80;//柱狀圖刻度值var scaleSplitNumber=9;//環比查詢function momDateList(id,searchDate) {//環比的Idvar searchId=id.replace(/[^0-9]/ig,"");//構建柱狀圖var passengerMomBarChartMainChart = echarts.init(document.getElementById('passenger_mom_barchart_main'+searchId));//構建圖表var passengerMainChart = echarts.init(document.getElementById("passenger_mom_main"+searchId));//加載數據時的圈圈passengerMainChart.showLoading();passengerMomBarChartMainChart.showLoading();var option ={};$.ajax({url: "#(path)/manager/censusManager/dtStatisticBusiness/AA",data: {searchColumn: searchColumn,searchDate: searchDate},type: "POST",success: function (data1) {//隱藏圈圈passengerMainChart.hideLoading();passengerMomBarChartMainChart.hideLoading();if (data1.msg == "success") {var option ={tooltip: {trigger: 'item',//數據項圖形觸發，主要在散點圖，餅圖等無類目軸的圖表中使用。// formatter: '{a} <br/>{b} : {c} (ozvdkddzhkzd%)'},series: [{// name: '訪問來源',type: 'pie',radius: '40%',center: ['50%', '50%'],data: data1.dataList,}]};passengerMainChart.setOption(option);//將總量存到數組中var initBarChatArr=new Array(data1.synthesizeNum);var barChartOption = {grid:{//left:'8%',//right:'0',bottom:'1%',//containLabel:true//常用于『防止標簽溢出』的場景},xAxis: {type: 'category',data: ['Mon'],show:false,//不顯示坐標軸線、坐標軸刻度線和坐標軸上的文字axisTick:{show:false//不顯示坐標軸刻度線},axisLine: {show: false,//不顯示坐標軸線},axisLabel: {show: false,//不顯示坐標軸上的文字}},yAxis: {data: scaleArr, //動態刻度表type: 'value',max: scaleMaxY, //動態設置最大值 一定要設置，否則圖表失效min: 0, //最小值splitNumber:scaleSplitNumber, //9個刻度線，也就是8等分（刻度線data-1）show: false,splitLine: {show: false}},series: [{data: initBarChatArr,type: 'bar',barWidth:20,backgroundStyle: {color: 'rgba(220, 220, 220, 0.8)'},itemStyle: {normal: {label: {show: true, //開啟顯示position: 'top', //在上方顯示textStyle: { //數值樣式color: 'black',fontSize: 12}}}},}]};passengerMomBarChartMainChart.setOption(barChartOption);}}})} 與50位技術專家面對面20年技術見證，附贈技術全景圖

總結

以上是生活随笔為你收集整理的echat 图表动态数据生成，渲染，自定义Y轴坐标值的全部內容，希望文章能夠幫你解決所遇到的問題。

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