We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on : Nov 16th 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Can I move Axis name to the side?

Thread ID:

Created:

Updated:

Platform:

Replies:

130603 May 19,2017 09:59 PM UTC May 22,2017 11:26 AM UTC JavaScript 1
loading
Tags: ejChart
June
Asked On May 19, 2017 09:59 PM UTC

Hello, all.
I wanna move Axis name to the side.
Can I move Axis name to the side like red rectangle in this picture?



could you tell me the way please if it is possible?

Dharanidharan Dharmasivam [Syncfusion]
Replied On May 22, 2017 11:26 AM UTC

Hi June, 
 
Thanks for contacting Syncfusion support. 
 
We have analyzed your query. Currently axis title can’t be moved as shown in the screenshot. However, your requirement can be achieved as workaround using annotation feature. In this we can place the required text anywhere in chart. In order to place the text anywhere, specify coordinateUnit as pixels of annotations property, also x and y values can be specified dynamically using chartAreaBoundsCalculate  event as depicted in the below code snippet. 
 
JS: 

div id= "yTitle" style="display:none">weight</div> 
<div id= "xTitle" style="display:none">date</div> 
       $("#container").ejChart( 
                { 
                    //... 
                    annotations: [ 
                                     { visible: true, content: "yTitle", coordinateUnit: "pixels", horizontalAlignment: "right" }, 
                                    { visible: true, content: "xTitle", coordinateUnit: "pixels", horizontalAlignment: "right" } 
                    ], 
                   chartAreaBoundsCalculate: "chartLoaded" 
             }); 
 
function chartLoaded(sender) { 
                var bound = sender.model.m_AreaBounds; 
                padding = 10; 
                sender.model.annotations[0].x = bound.X - padding; 
                sender.model.annotations[0].y = bound.Y - padding; 
                sender.model.annotations[1].x = bound.X + bound.Width + padding; 
                sender.model.annotations[1].y = (bound.Y + (bound.Height / 2)); 
      } 

Screenshot: 
 

Sample for reference can be find from below link. 

Kindly revert us, if you have any concern. 

Thanks, 
Dharani. 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;