canvasJS異なる画面間のx軸の変更

Question

私はcanvasJSを使用してグラフを描画しますが、ページが異なるウィンドウを変更すると、X軸が異なって表示されます。ときに、間隔を設定する「番号」への権利このenter image description hereような小さなウィンドウショーで開いているページが、このenter image description here

var chart = new CanvasJS.Chart("chartContainer", { 
      zoomEnabled: false, 
      animationEnabled: false, 
      title: { 
       text: "BJS Site Record Item QTY" 
      }, 
      axisY2: { 
       valueFormatString: "0", 
       maximum: 50, 
       interval: 5, 
       interlacedColor: "#F5F5F5", 
       gridColor: "#D7D7D7", 
       tickColor: "#D7D7D7" 
      }, 
      axisX:{ 
       //title: "BJS Site Record Item QTY", 
       interval: 1 
      }, 
      theme: "theme2", 
      toolTip: { 
       shared: true 
      }, 
      legend: { 
       verticalAlign: "bottom", 
       horizontalAlign: "center", 
       fontSize: 15, 
       fontFamily: "Lucida Sans Unicode" 
      }, 
      data: [ 

       { 
       type: "line", 
       lineThickness: 3, 
       axisYType: "secondary", 
       showInLegend: true, 
       name: "BJSC", 
       dataPoints: [ 

        { x: new Date(2016,11,08), y:11 }, 

        { x: new Date(2016,11,09), y:0 }, 

        { x: new Date(2016,11,10), y:0 }, 

        { x: new Date(2016,11,11), y:0 }, 

        { x: new Date(2016,11,12), y:0 }, 

        { x: new Date(2016,11,13), y:0 }, 

        { x: new Date(2016,11,14), y:0 }, 

       ] 
      },   
      ], 
      legend: { 
       cursor: "pointer", 
       itemclick: function (e) { 
        if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) { 
         e.dataSeries.visible = false; 
        } 
        else { 
         e.dataSeries.visible = true; 
        } 
        chart.render(); 
       } 
      } 
    }); 
     chart.render(); 
} 
</script> 

Answer 1

のような間違ったページショーの大きな窓ショースコット、

intervalTypeデフォルト。間隔を1日にする場合は、intervalを「day」に設定し、間隔を1に設定します。

このコードを確認してください。

var chart = new CanvasJS.Chart("chartContainer", { 
 
    zoomEnabled: false, 
 
    animationEnabled: false, 
 
    title: { 
 
    text: "BJS Site Record Item QTY" 
 
    }, 
 
    axisY2: { 
 
    valueFormatString: "0", 
 
    maximum: 50, 
 
    interval: 5, 
 
    interlacedColor: "#F5F5F5", 
 
    gridColor: "#D7D7D7", 
 
    tickColor: "#D7D7D7" 
 
    }, 
 
    axisX: { 
 
    //title: "BJS Site Record Item QTY", 
 
    interval: 1, 
 
    intervalType: "day" 
 
    }, 
 
    theme: "theme2", 
 
    toolTip: { 
 
    shared: true 
 
    }, 
 
    legend: { 
 
    verticalAlign: "bottom", 
 
    horizontalAlign: "center", 
 
    fontSize: 15, 
 
    fontFamily: "Lucida Sans Unicode" 
 
    }, 
 
    data: [ 
 

 
    { 
 
     type: "line", 
 
     lineThickness: 3, 
 
     axisYType: "secondary", 
 
     showInLegend: true, 
 
     name: "BJSC", 
 
     dataPoints: [ 
 
     { x: new Date(2016, 11, 08), y: 11 }, 
 
     { x: new Date(2016, 11, 09), y: 0 }, 
 
     { x: new Date(2016, 11, 10), y: 0 }, 
 
     { x: new Date(2016, 11, 11), y: 0 }, 
 
     { x: new Date(2016, 11, 12), y: 0 }, 
 
     { x: new Date(2016, 11, 13), y: 0 }, 
 
     { x: new Date(2016, 11, 14), y: 0 } 
 
     ] 
 
    }, 
 
    ], 
 
    legend: { 
 
    cursor: "pointer", 
 
    itemclick: function(e) { 
 
     if (typeof(e.dataSeries.visible) === "undefined" || e.dataSeries.visible) { 
 
     e.dataSeries.visible = false; 
 
     } else { 
 
     e.dataSeries.visible = true; 
 
     } 
 
     chart.render(); 
 
    } 
 
    } 
 
}); 
 
chart.render();

<script type="text/javascript" src="http://canvasjs.com/assets/script/canvasjs.min.js"></script> 
 
<div id="chartContainer" style="height: 250px; width: 100%;"></div>