1. 程式人生 > 其它 >echarts 自定義標識線

echarts 自定義標識線

寫了個例子 記錄一下 複製到https://echarts.apache.org/examples/zh/editor.html?c=bar-simple 中 可以看效果

option = {
  title: {
    text: '世界人口總量',
    subtext: '資料來自網路'
  },
  legend: {
    data: ['2011年', '2012年']
  },
  grid: {
    left: '3%',
    right: '4%',
    bottom: '3%',
    containLabel: true
  },
  xAxis: {
    type: 
'value', boundaryGap: [0, 0.01] }, yAxis: [ { type: 'category', data: ['西瓜', '草莓', '哈密瓜', '車釐子', '橘子', '小可愛'] }, { type: 'category', axisLine: { show: false }, axisTick: { show: false }, axisLabel: { show: false
}, axisPointer: { type: 'none' }, splitArea: { show: false }, splitLine: { show: false }, data: ['西瓜', '草莓', '哈密瓜', '車釐子', '橘子', '小可愛'] } ], series: [ { name: '2011年', type: 'bar', data: [18, 23, 29, 10, 34, 63], barWidth :
40, }, { name: '123', stack: 'breakevenEleGroup' /*資料組,需要設定才能將兩個bar堆積在一起*/, type: 'bar', yAxisIndex: 1, itemStyle: { normal: { color: 'rgba(0,0,0,0)' ,/*設定bar為隱藏,撐起下面橫線*/ } }, data: [12, 17, 20, 3, 33, 118] }, { /*這個bar是橫線的顯示*/ name: '123', stack: 'breakevenEleGroup' /*資料組,需要設定才能將兩個bar堆積在一起*/, type: 'bar', yAxisIndex: 1, barWidth : 50, itemStyle: { normal: { color: 'red' } }, data: [0.2, 0.2, 0.2, 0.2, 0.2, 0.2] }, ] };