The label on the X axis protrudes.

[kinokatsu]

Hi.
Please leave me a question.
If you make the description below, only the half of the label at the far right is displayed.
How can I deal with it?

	axisX: {
		valueFormatString: "HH:mm",
		minimum: new Date(2017, 1, 5, 0),
		maximum: new Date(2017, 1, 6, 0),
		gridThickness: 1,
	   	interval: 1,
	   	intervalType: "hour",
		labelAutoFit: true
	}

[kinokatsu]

sample:

https://jsfiddle.net/katsukino/tn2u0650/9/

• This reply was modified 5 years, 11 months ago by kinokatsu.
• This reply was modified 5 years, 11 months ago by kinokatsu.

[Vishwas R]

@kinokatsu,

Label is being clipped as you are restricting axis maximum. Setting labelAngle to a negative value should work fine in your case. Please take a look at this updated jsfiddle.

—
Vishwas R
Team CanvasJS

[kinokatsu]

Vishwas,

thanks for your reply.

I appreciate your suggestion.
But, I would like to use methods that do not use “angle” whenever possible.

I created a dummy ‘axisY2’ (No label, No tick) and adjusted the position with margin.
JSFiddle

I want to add a question.

I want to know if animation can be done from bottom to top in the area chart.

[Vishwas R]

@kinokatsu,

Glad that you found another way to handle this case and thanks for sharing the same here, which may help others aswell.

Sorry, animation from bottom to top in case of area chart is not available as of now.

—
Vishwas R
Team CanvasJS

[kinokatsu]

Vishwas,

thanks for your reply.

This method caused a new problem.
Zoom not working.

[Vishwas R]

@kinokatsu,

In the current approach that you are following, label to the right extreme gets clipped as you are setting axis maximum. To overcome this, either you can rotate labels or increase axis maximum by 20-30minutes. Please take a look at this updated jsfiddle

—
Vishwas R
Team CanvasJS

[kinokatsu]

Vishwas,

thanks for your reply.

I choose the method “increase the maximum value of the axis by 20 to 30 minutes”