axisX: Object

axisX object lets you set various parameters of X Axis in Navigator like interval, grid lines, etc.

var stockChart = new CanvasJS.StockChart("container",
{
 .
 .
 navigator: {
   .
   .
   axisX: {
     valueFormatString: "MMM YY"
   },
   .
   .
 }
 .
 .
});
stockChart.render();

Simple Atrributes for axisX

Applies To	Attribute	Type	Default	Options/Examples	Remarks
axisX	title	String	null	“Axis Title”	–
axisX	titleWrap	Boolean	true	true, false	–
axisX	titleMaxWidth	Number	Automatically Calculated based on Navigator Size	150, 200, …	–
axisX	titleTextAlign	String	“left”	“left”, “center”, “right”	–
axisX	titleFontColor	String	“#666666”	“red”, “#006400”, …	–
axisX	titleFontSize	Number	0	25, 30, …	–
axisX	titleFontFamily	String	“Verdana, Geneva, Calibri, sans-serif”	“tahoma”, “verdana”, …	–
axisX	titleFontWeight	String	“normal”	“lighter”, “normal, “bold”, “bolder”	–
axisX	titleFontStyle	String	“normal”	“normal”,“italic”, “oblique”	–
axisX	margin	Number	2	10, 12, …	–
axisX	labelBackgroundColor	String	“transparent”	“red”, “#006400”, …	–
axisX	labelMaxWidth	Number	Automatically Calculated based on Navigator Size	45, 150, 60, …	–
axisX	labelWrap	Boolean	true	true, false	–
axisX	labelAutoFit	Boolean	true	true, false	–
axisX	labelAngle	Number	0	45,-45, 60, …	–
axisX	labelFontFamily	String	“Calibri, Optima, Candara, Verdana, Geneva, sans-serif”	“tahoma”, “verdana”, …	–
axisX	labelFontColor	String	“black”	“red”, “#006400”, …	–
axisX	labelFontSize	Number	18	25, 30, …	–
axisX	labelFontWeight	String	“normal”	“lighter”, “normal, “bold”, “bolder”	–
axisX	labelFontStyle	String	“normal”	“normal”,“italic”, “oblique”	–
axisX	labelPlacement	String	“outside”	“outside”, “inside”	–
axisX	labelTextAlign	String	“left”	“left”,”center”,”right”	–
axisX	prefix	String	null	“$”, “#”, …	–
axisX	suffix	String	null	“K”, “m”, …	–
axisX	valueFormatString	String	null	“DD/MM/YYYY”, “##,#0.##”, …	Auto Formatted
axisX	minimum	Number/Date/Timestamp	null	-100, 350, …	Auto Calculated
axisX	maximum	Number/Date/Timestamp	null	100, 350, …	Auto Calculated
axisX	viewportMinimum	Number/Date/Timestamp	null	-100, 350, …	Auto Calculated
axisX	viewportMaximum	Number/Date/Timestamp	null	100, 350, …	Auto Calculated
axisX	interval	Number	null	25, 40, …	Auto Calculated
axisX	intervalType	String	Automatically handled when interval property is not set. Defaults to “number” when you set the interval.	“number”, “millisecond” , “second”, “minute”, “hour”, “day”, “month” , “year”	used with interval
axisX	reversed	Boolean	false	true, false	–
axisX	logarithmic	Boolean	false	true, false	–
axisX	logarithmBase	Number	10	2, 10, …	–
axisX	tickLength	Number	0	15, 20, …	–
axisX	tickColor	String	“black”	“red”, “#006400”, …	–
axisX	tickThickness	Number	0	5, 8, …	–
axisX	lineColor	String	“black”	“red”, “#006400”, …	–
axisX	lineThickness	Number	0	5, 8, …	–
axisX	interlacedColor	String	“transparent”	“#F8F1E4”, “#FEFDDF”, …	–
axisX	gridThickness	Number	1	5, 8, …	Inc. to see grid
axisX	gridColor	String	“#A0A0A0”	“red”, “#006400”, …	–
axisX	gridDashType	String	“solid”	“solid”, “shortDash”, “shortDot”, “shortDashDot”, “shortDashDotDot”, “dot”, “dash”, “dashDot”, “longDash”, “longDashDot”, “longDashDotDot”	–
axisX	lineDashType	String	“solid”	“solid”, “shortDash”, “shortDot”, “shortDashDot”, “shortDashDotDot”, “dot”, “dash”, “dashDot”, “longDash”, “longDashDot”, “longDashDotDot”	–
axisX	labelFormatter	Function	–	–	–

Composite Atrributes (Object) for axisX

Object	Attributes	Type	Default	Options
axisX	stripLines	Object	–	–
axisX	scaleBreaks	Object	–	–

var stockChart = new CanvasJS.StockChart("container",
{
 .
 .
 navigator: {
   .
   .
   axisX: {
     stripLines: {}
   },
   .
   .
 }
 .
 .
});
stockChart.render();

Also See:

If you have any questions, please feel free to ask in our forums.Ask Question

axisX: Object

Simple Atrributes for axisX

Composite Atrributes (Object) for axisX

Quick Links

Server Side Technologies

Front Side Technologies

Contact