axisY object lets you set various parameters of Y Axis in Navigator like interval, grid lines, etc.
var stockChart = new CanvasJS.StockChart("container",
{
.
.
navigator: {
.
.
axisY: {
valueFormatString: "#,##.0"
},
.
.
}
.
.
});
stockChart.render();
| Applies To | Attribute | Type | Default | Options/Examples | Remarks |
|---|---|---|---|---|---|
| axisY | title | String | null | “Axis Title” | |
| axisY | titleWrap | Boolean | true | true, false | |
| axisY | titleMaxWidth | Number | null | 100, 150, … | |
| axisY | titleTextAlign | String | “left” | “left”, “center”, “right” | |
| axisY | titleFontColor | String | “black” | “red”, “#006400”, … | |
| axisY | titleFontSize | Number | 0 | 25, 30, … | |
| axisY | titleFontFamily | String | “arial” | “arial” , “tahoma”, “verdana”, … | |
| axisY | titleFontWeight | String | “normal” | “lighter”, “normal, “bold”, “bolder” | |
| axisY | titleFontStyle | String | “normal” | “normal”,“italic”, “oblique” | |
| axisY | labelBackgroundColor | String | “transparent” | “red”, “#006400”, … | |
| axisY | labelMaxWidth | Number | Automatically Calculated based on Navigator Size | 10, 20, … | |
| axisY | labelWrap | Boolean | true | true, false | |
| axisY | labelAutoFit | Boolean | true | true, false | |
| axisY | labelAngle | Number | 0 | 45,-45, 60, … | |
| axisY | labelFontFamily | String | “arial” | “tahoma”, “verdana”, … | |
| axisY | labelFontColor | String | “black” | “red”, “#006400”, … | |
| axisY | labelFontSize | Number | 0 | 25, 30, … | |
| axisY | labelFontWeight | String | “normal” | “lighter”, “normal, “bold”, “bolder” | |
| axisY | labelFontStyle | String | “normal” | “normal”,“italic”, “oblique” | |
| axisY | labelPlacement | String | “outside” | “outside”, “inside” | – |
| axisY | labelTextAlign | String | “left” | “left”,”center”,”right” | |
| axisY | prefix | String | null | “$”, “cat”, … | |
| axisY | suffix | String | null | “USD”, “cat”, … | |
| axisY | valueFormatString | String | null | “DD/MM/YY”, “#,##0.##”, … | |
| axisY | minimum | Number/Date/Timestamp | null | -100, 350, … | |
| axisY | maximum | Number/Date/Timestamp | null | 100, 350, … | |
| axisY | viewportMinimum | Number/Date/Timestamp | null | -100, 350, … | |
| axisY | viewportMaximum | Number/Date/Timestamp | null | 100, 350, … | |
| axisY | interval | Number | null | 25, 40, … | |
| axisY | reversed | Boolean | false | true, false | |
| axisX | logarithmic | Boolean | false | true, false | |
| axisX | logarithmBase | Number | 10 | 2, 10, … | |
| axisY | interlacedColor | String | “transparent” | “#F8F1E4”, “#FEFDDF”, … | |
| axisY | includeZero | Boolean | false | false, true | |
| axisY | labelFormatter | Function |
| Object | Attributes | Type | Default | Options |
|---|---|---|---|---|
| axisY | stripLines | Object | ||
| axisY | scaleBreaks | Object |
var stockChart = new CanvasJS.StockChart("container",
{
.
.
navigator: {
.
.
axisY: {
stripLines: {}
},
.
.
}
.
.
});
stockChart.render();
Also See: