In this article we will learn about how to set the Axis Range for X and Y Axis. By default it is picked up from the data.

Default View of a generated Chart (Area Chart) based on provided data :

Open the visualization where you want to custom define the Axis range. As shown, add the script. You can provide the minimum and maximum for X and Y Axis. In order to perform customization you will require a Javascript code. To apply Javascript, go to Custom tab, click on Script, then click on Add to enter the code and click on Inject to execute the entered code.

JavaScript Code :

hi_container.set("postExecution", function () {
Hdi.c3chart.axis.range({
min: { x: -2,  y: -50 }, max: { x: 20, y: 130 }    // min & max value for x & y axis is
   });                                             // customizable 
});

Output :

Output shows the updated axis range. Similarly, you can modify axis range as per your requirement using script. In addition, you can perform other chart customization using CSS and Javascript code.

For more info, contact us at support@helicalinsight.com