CanvasJS - 如何在特定的X轴位置插入值？

Question

我想问一下如何在特定的X轴位置插入值？

例如：

我有10个标记，其在X轴 的底部显示（标签）我有（x轴-COORDS 100个值放在哪里和他们的轴y的值）需要插入X轴上特定的 位置。 这意味着一个标记不对应一个值。应该是独立的。

我该如何使用CanvasJS或任何其他库进行操作？

Answer 1

@redrom，

标签上X轴要么用户在该点处定义的“标记”或x值。

如果您有100 dataPoints并且只想显示10个数据点的标签，则可以将间隔设置为10，以便每隔10个数据点标签就会显示出来。

检查此示例。

var dps = []; 
 
var yVal = 50; 
 

 
for(var i = 1; i <= 100; i++){ 
 
\t yVal = yVal + Math.round(5 + Math.random() *(-5-5)); 
 
    dps.push({x: i, y: yVal, label: "xValue: " +i}); 
 
} 
 

 
var chart = new CanvasJS.Chart("chartContainer", 
 
{ 
 
\t axisX:{ 
 
    \t interval: 10//change this to 20 and observe X-Axis labels 
 
    }, 
 
\t data: [ 
 
\t { 
 
\t \t type: "line", 
 
\t \t dataPoints: dps 
 
\t } \t \t \t \t \t 
 
\t ] 
 
}); 
 
chart.render();

<script src="http://canvasjs.com/assets/script/canvasjs.min.js"></script> 
 

 
<div id="chartContainer" style="height: 300px; width: 100%;"></div>