echarts柱狀圖常用屬性配置
阿新 • • 發佈:2019-01-03
let myChart = this.$echarts.init(document.getElementById("plant-charts")); // 繪製圖表 myChart.setOption({ tooltip: { formatter: "{c}℃" //設定滑鼠劃上提示文字 }, grid: { //設定圖示距離 top: "10", left: "30", right: "10", bottom: "20" }, xAxis: { type: "category", data: ["2012", "2013", "2014", "2015", "2016", "2017"], axisLabel: { textStyle: { //文字樣式 color: "#62799C", fontSize: "12" } }, axisTick: { //y軸不顯示刻度線, show: false }, axisLine: { //隱藏y軸線 show: false } }, yAxis: { type: "value", //show: false, axisLabel: { textStyle: { //文字樣式 color: "#62799C", fontSize: "12" } }, // 控制網格線是否顯示 splitLine: { // 改變軸線顏色 lineStyle: { color: "rgba(0,0,0,0)" } }, axisTick: { //y軸刻度線 show: false }, axisLine: { //隱藏y軸線 show: false } }, series: [ { data: [20, 30, 40, 50, 20, 60], type: "bar", itemStyle: { normal: { color: "rgba(160,216,254,1)" //柱狀圖的背景顏色 } }, barWidth: 15 //柱狀圖寬度 } ] });