Canvas js stripline label
Trying to figure out if I can get a stripline label on the X axis to to have a horizontal text direction rather than vertical.
by canvasjs
HTML
<script src="http://canvasjs.com/assets/script/canvasjs.min.js"></script>
<div id="chartContainer" style="height: 360px; width: 100%;"></div>
JavaScript
var chart = new CanvasJS.Chart("chartContainer", {
axisX:
{
intervalType: "month",
interval: 1,
valueFormatString: "DD/MM/YYYY",
minimum: new Date(2009, 9, 18),
stripLines: [
{
value: new Date(2010, 0, 1),
customLabel: "I want this to be horizontal",
thickness: 2,
color: "#FF0000",
labelFontColor: "#000000",
}
]
},
data: [
{
type: "column",
color: "blue",
dataPoints: [
{x: new Date(2009, 10, 21),y: 5},
{x: new Date(2009, 11, 19),y: 7},
{x: new Date(2009, 12, 9),y: 10},
{x: new Date(2010, 0, 5),y: 20},
{x: new Date(2010, 1, 4),y: 8},
{x: new Date(2010, 2, 3),y: 5}
]
}
]
});
showHorizontalLabel(chart)
chart.render();
function showHorizontalLabel(chart) {
var dps = [];
for(var i = 0; i < chart.options.axisX.stripLines.length; i++) {
var stripLine = chart.options.axisX.stripLines[i];
dps.push({ x: stripLine.value, y: 20, indexLabel: stripLine.customLabel})
}
chart.options.data.push({type: "scatter", markerSize: 0, toolTipContent: null, highlightEnabled: false, dataPoints: dps})
}