Изменить выставку xValue

Question

У меня есть этот график, где я помещаю некоторые маркеры (stripLines) на минимальные и максимальные значения. Я хотел бы показать xValue только на маркерах, чтобы сделать диаграмму более читабельной.

На этом графике я использую интервал 50, и мои данные для xAxis установлены неправильно. Что я должен сделать sh, так это показать значение на xAxis только там, где отображаются маркеры. Есть ли свойство, которое делает это? Я не могу найти его в документации.

Вот код, где я генерирую диаграмму

const options = {
  theme: "light2", // "light1", "dark1", "dark2"
  animationEnabled: true,
  zoomEnabled: false,
  toolTip:{
    enabled: false,
    },
  axisX: [{
    crosshair: { 
    enabled: true
    }, 
    stripLines:[
    {                
      value: marker[0],
      thickness: 2,
      label: ""
    },
    {                
      value: marker[1],
      thickness: 2,
      label: ""
    },
    ],  
    //title: "X title 1",
    //margin: 20,
    valueFormatString: "DD/MMM/YY" ,
    labelMaxWidth: 70,
    //labelWrap: true,
    interval: 50,
    titleFontColor:"#7680B2",
    lineColor:"#7680B2",
    tickColor:"#7680B2",
    labelFontColor:"#7680B2",
    lineThickness: 2,
  },
  {
    //title: "X title 2",
    margin: 0,
    valueFormatString: "DD/MMM/YY" ,
    //zlabelWrap: true,
    interval: 50,
    titleFontColor:"#62D2A9",
    lineColor:"#62D2A9",
    tickColor:"#62D2A9",
    labelFontColor:"#62D2A9",
    lineThickness: 2,

  }],
  axisY: {
    includeZero: false
  },
  data: [
    {
    color:"#7680B2",
    type: "spline",
    axisXIndex: 0,
    xValueType: "dateTime",

    dataPoints: dataPoints,
  },
    {
    color:"#62D2A9",
    type: "spline",
    axisXIndex: 1,
    xValueType: "dateTime",

    dataPoints: dataPoints2,
  },

]
}
  return (
    <div className="ChartWithZoom">
      <h1>Longe do pico</h1>
      <CanvasJSChart options = {options} 
      /* onRef={ref => this.chart = ref} */
      />
    </div>
  );

Answer 1

Я думаю, что я нашел обходной путь, есть функция, которая обрабатывает эту ситуацию, labelFormatter: function ( e ), это мое решение:

var  chart =  new  CanvasJS.Chart("container",
{
 .
 .
  axisX:{
    interval: 1,
    intervalType: 'day',
    labelFormatter: function ( e ) {
      let data = CanvasJSReact.CanvasJS.formatDate(e.value, "DD/MMM/YY");
      
      //marker is an array that I get the dates for the marker
      let minMarker = CanvasJSReact.CanvasJS.formatDate(marker[0], "DD/MMM/YY");
      let maxMarker = CanvasJSReact.CanvasJS.formatDate(marker[1], "DD/MMM/YY");
      if ( data === minMarker || data === maxMarker ) {
        return CanvasJSReact.CanvasJS.formatDate(e.value, "DD/MMM/YY");
      } else {
        return "";
    }
};  
  },
 .
 .
});
chart.render();

e: { // parameter sent to function
       chart,
       axis,
       value,
       label
 }

Это результат: