Home › Forums › Chart Support › Is it possible to create two "stripLines" on the same chart?

Is it possible to create two "stripLines" on the same chart?

Viewing 3 posts - 1 through 3 (of 3 total)

Tagged: 

  • March 2, 2019 at 4:03 pm #24521

    navigatorus

    Hello!I really need help, please help!Please tell me whether it is possible to add a second “stripLines” on the graph code which is located on the website https://canvasjs.com/html5-javascript-spline-chart/ and looks like:

    <!DOCTYPE HTML>
<html>
<head>  
<script>
window.onload = function () {

var chart = new CanvasJS.Chart("chartContainer", {
	animationEnabled: true,  
	title:{
		text: "Music Album Sales by Year"
	},
	axisY: {
		title: "Units Sold",
		valueFormatString: "#0,,.",
		suffix: "mn",
		stripLines: [{
			value: 3366500,
			label: "Average"
		}]
	},
	data: [{
		yValueFormatString: "#,### Units",
		xValueFormatString: "YYYY",
		type: "spline",
		dataPoints: [
			{x: new Date(2002, 0), y: 2506000},
			{x: new Date(2003, 0), y: 2798000},
			{x: new Date(2004, 0), y: 3386000},
			{x: new Date(2005, 0), y: 6944000},
			{x: new Date(2006, 0), y: 6026000},
			{x: new Date(2007, 0), y: 2394000},
			{x: new Date(2008, 0), y: 1872000},
			{x: new Date(2009, 0), y: 2140000},
			{x: new Date(2010, 0), y: 7289000},
			{x: new Date(2011, 0), y: 4830000},
			{x: new Date(2012, 0), y: 2009000},
			{x: new Date(2013, 0), y: 2840000},
			{x: new Date(2014, 0), y: 2396000},
			{x: new Date(2015, 0), y: 1613000},
			{x: new Date(2016, 0), y: 2821000},
			{x: new Date(2017, 0), y: 2000000}
		]
	}]
});
chart.render();

}
</script>
</head>
<body>
<div id="chartContainer" style="height: 300px; width: 100%;"></div>
<script src="https://cdn.canvasjs.com/canvasjs.min.js"></script>
</body>
</html>

    If possible, please provide me with a solution.I would be very grateful.Thank you for your help.Thanks.

    March 4, 2019 at 11:20 am #24527

    Vishwas R

    @navigatorus,

    You can add as many striplines as you want by adding new object with value to stripLines array. Please refer documentation on stripLines for more info / customization options available.

    Here is a code snippet that would help you add 3 stripLines over axisY:

    stripLines: [{
    value: 3366500,
    label: "Average"
},{
    value: 7289000,
    label: "High"
},{
    value: 1613000,
    label: "Low"
}]

    —
    Vishwas R
    Team CanvasJS

    March 4, 2019 at 12:08 pm #24531

    navigatorus

    Many thanks.You saved me.

Viewing 3 posts - 1 through 3 (of 3 total)

Tagged: 

You must be logged in to reply to this topic.