Home Forums Chart Support Percentage In Y

Percentage In Y

Viewing 3 posts - 1 through 3 (of 3 total)
  • #26162

    Dear Experts,

    May I know how to make Y format using percentage?

    <!DOCTYPE HTML> 
    <html> 
    <head> 
    <script type="text/javascript"> 
    window.onload =function() { 
    	var chart = new CanvasJS.Chart("chartContainer",{ 
    		title: {
    			text: "Formatting Percent Values"
    		},axisY:{
                percentFormatString:"#0.##"
            },
    		data: [
    		{
    			type: "column",
    			indexLabel: "{y}%",
    			percentFormatString: "#0.##",
    			toolTipContent: "{y} (#percent%)",
    			dataPoints: [
    				{ y: 71}, 
    				{ y: 55}, 
    				{ y: 50},
    				{ y: 65}, 
    				{ y: 95}, 
    				{ y: 68}, 
    				{ y: 28}, 
    				{ y: 34},
    				{ y: 14}
    			]
    		}
    		]
    	});
    	chart.render();
    } 
    </script> 
      <script type="text/javascript" src="https://cdn.canvasjs.com/canvasjs.min.js"></script>
    </head> 
    <body> 
    <div id="chartContainer" style="width: 100%; height: 300px"></div> 
    </body> 
    </html> 

    Please help, thank you

    #26179

    @tabibintang,

    You can format the y-axis label by adding “%” to the valueFormatString of axisY. Please refer to the below code snippet.

    axisY:{
        valueFormatString:"0'%'"
    },

    Also, kindly take a look at this JSFiddle for an example.

    formatting axisY labels using valueFormatString

    __________
    Indranil Deo
    Team CanvasJS

    #26183

    Dear Indranil Deo,

    Thank you for your solution

    Regards,
    Tahta Bintang Pratama

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

You must be logged in to reply to this topic.