is there an example of a canvasJS graph where each point on a graph has a tick and label on the X axis?

Vera-6 0
Viewed 22

I cannot seem to find an example where every single point in a set of data had its own tick and label on a graph. when I load in my data, CanvasJS gives me intervals as my x axis. the actual points are placed inbetween these intervals. If i add more data, the intervals dont change. I am looking for an example of how to make it so each point is represented.

I would also like the xaxis to look as identical to this formatting as possible enter image description here

I have read some documentation here but I am struggling to make it work for me. My X axis values look like this: 119604384477647324 but are in Miliseconds.

any help would be appreciated. I have a presentation soon and I am hard stuck. thank you!

canvasjs graph javascript
1 Answers

Passing label instead of x-value in datapoint seems to work fine.

var chart = new CanvasJS.Chart("chartContainer", {
      title: {
        text: "Custom Labels on X Axis "
      },
      data: [{
        type: "column",
        dataPoints: [
        { y: 71, label: "cat 1"},
        { y: 55, label: "cat 2"},
        { y: 50, label: "cat 3"},
        { y: 65, label: "cat 4"},
        { y: 95, label: "cat 5"},
        { y: 68, label: "cat 6"},
        { y: 28, label: "cat 7"},
        { y: 34, label: "cat 8"},
        { y: 14, label: "cat 9"}
        ]
     }]
});

chart.render();
<script type="text/javascript" src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<div id="chartContainer" style="height: 300px; width: 100%;">

Vishwas R0
Related