Trying to set X Axis to" mm:ss" - canvasjs

Question

I'm trying to make the X Axis at my charts show scale that looks like - "minutes:seconds" (mm:ss)
but all I could do is make it a scale of year and monthes by:
new Date();
I really couln't find any guide that I understood...
This is my JS code:
window.onload = function () {
let d = new Date();
let secondsString = d.getSeconds();
let minString = d.getMinutes();
var totalTime = `${minString}${secondsString}` * 1;
var chart = new CanvasJS.Chart("chartContainer",
{
title:{
text: "Coins"
},
data: [{
type: "spline",
name: "Bitcoin",
showInLegend: true,
dataPoints: [
{x: new Date(), y: 1200},
{x: new Date(), y: 1300},
{x: new Date(), y: 1400}
]
},
]
});
chart.render();
}
How do I change the x Axis string ?
Currectly it looks like this:
The x Axis scale shows 2,834. I want it to be: 28:34.

Answer 1

Setting valueFormatString to "HH:mm" should work fine in your case.
var chart = new CanvasJS.Chart("chartContainer", {
title:{
text: "Coins"
},
axisX: {
valueFormatString: "HH:mm"
},
data: [{
type: "spline",
name: "Bitcoin",
showInLegend: true,
dataPoints: [
{x: new Date(2019, 09, 17, 02, 15, 20), y: 1200},
{x: new Date(2019, 09, 17, 08, 15, 20), y: 1300},
{x: new Date(2019, 09, 17, 14, 15, 20), y: 1400}
]
},
]
});
chart.render();
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<div id="chartContainer" style="height: 300px; width: 100%;"></div>