title: Echart: How to set mark area to fill sections in xAxis
body: <p>I have a problem with marking area: i need to be able to select a bar area based on xAxis, for example from 0 to 1, from 1 to 2, etc. But when i try to provide options for bar like</p>
  
  <pre><code>[{xAxis: 0, itemStyle: {color: red}},{xAxis: 1}]
  </code></pre>
  
  <p>it marks an area from a middle of xAxis area with an index of 0 to a middle of xAxis area with an index of 1. Is there a way to make it mark from start of an area to an end. Currently i managed to do so only with x option in pixels:
  <a href="https://codesandbox.io/s/react-echart-markarea-ksj31?file=/src/index.js:714-726" rel="nofollow noreferrer">https://codesandbox.io/s/react-echart-markarea-ksj31?file=/src/index.js:714-726</a></p>
  
  <p>Is there a better way to do it?</p>