customBreaks: Object

Using customBreaks you can specify the ranges on axis to shrink/remove. You can add any number of custom scale breaks.

If you want to shrink a certain section on the axis, you can specify the range with startValue and endValue attributes. This range will be represented with a Scale Break.

Here is an example:
var  chart =  new  CanvasJS.Chart("container",
 axisX: {
     scaleBreaks: {
	 customBreaks: [{
	     startValue: 100,
	     endValue: 500,
	     color: "orange",
	     type: "zigzag"
	     startValue: 700,
	     endValue: 1000,
	     color: "green",
	     type: "waved"


Simple customBreaks Attributes

Applies To Attribute Type Default Options/Examples
customBreaks startValue Number null 20
customBreaks endValue Number null 30
customBreaks type String “straight” “straight”, “waved”, “zigzag”
customBreaks spacing Number/String Automatically Calculated 5,10,20
customBreaks color String “white” “green”,”#23EA23″
customBreaks lineColor String “red” “green”,”#23EA23″
customBreaks lineThickness Number 2 4

Try it Yourself by Editing the Code below.

  Also See:    

In order to provide better support,we have closed the comments and switched completely to our Forums.
If you have any questions, please feel free to ask in our forums.