ZingChart Scale-Y Marker，可以画在上面吗？

Question

向 ZingChart 图添加刻度标记时，默认情况下标记绘制在其他绘制数据下方，这并不总是那么容易看到（例如，一系列条形下方的线标记）。

var chartConfig = {
  type: 'bar',
  title: { text: 'Scale-Y Marker' },
  scaleY: {
    markers: [
      {
        type: 'line',
        range: [40],
        lineColor: '#DE7DA9',
        label:{
          text: 'Marker',
          backgroundColor: 'white',
          alpha: 0.7,
          textAlpha: 1,
          offsetX: 10,
          offsetY: -1
        }
      }
    ]
  },
  series: [
    {
      values: [50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75],
      backgroundColor: '#B7D977'
    }
  ]
};

zingchart.render({ 
  id : 'chartCanvas', 
  data : chartConfig, 
  height: 400, 
  width: '750'
});

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Scale-Y Marker</title>
    <script src="https://cdn.zingchart.com/zingchart.min.js"></script>
  </head>
  <body>
    <div id='chartCanvas'></div>
  </body>
</html>

scale-y markers (v2.6.8) 目前没有类似 z-index 的属性可用，有没有办法在绘制的数据之上绘制 Y 轴标记？

Answer 1

您可以使用 placement 属性并将其设置为等于 'top'。

var chartConfig = {
  type: 'bar',
  title: { text: 'Scale-Y Marker On Top' },
  scaleY: {
    markers: [
      {
        type: 'line',
        range: [40],
        lineColor: '#DE7DA9',
        placement: 'top',
        label:{
          text: 'Marker',
          backgroundColor: 'white',
          alpha: 0.7,
          textAlpha: 1,
          offsetX: 10,
          offsetY: -1
        }
      }
    ]
  },
  series: [
    {
      values: [50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75,50,55,60,65,70,75],
      backgroundColor: '#B7D977'
    }
  ]
};

zingchart.render({ 
    id : 'chartCanvas', 
    data : chartConfig, 
    height: 400, 
    width: '750'
});

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Scale-Y Marker On Top</title>
    <script src="https://cdn.zingchart.com/zingchart.min.js"></script>
  </head>
  <body>
    <div id='chartCanvas'></div>
  </body>
</html>

ZingChart Scale-Y Marker，可以画在上面吗？

ZingChart Scale-Y Marker, Can it be drawn on top?

marker

zingchart