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.
Unfortunately, activation email could not send to your email. Please try again.

Customizing the numbers in the ejChart

Thread ID:

Created:

Updated:

Platform:

Replies:

125448 Aug 18,2016 10:17 PM Aug 19,2016 03:19 AM JavaScript 1
loading
Tags: ejChart
Myungjin Cho
Asked On August 18, 2016 10:17 PM

Hello Syncfusion. 

I am using the ejChart and was wondering if customizing the numbers are possible 

For example 
if the number is 100,000,000 then this should be displayed as 100,000 thousand or 100 million 

would this be possible? 


Saravana Kumar Kanagavel [Syncfusion]
Replied On August 19, 2016 03:19 AM

Hi Maverickjin8, 
 
Thanks for contacting syncfusion support. 
We have analyzed your query and created a sample based on your requirement. And this can be achieved as an work around. 
Please refer the code example below 
 
[JS] 
  $("#container").ejChart( 
        { 
            axesLabelRendering: "axesLabelChange" 
   }); 
 
function axesLabelChange(sender) { //axesLabelRendering event triggered 
        var value; 
        var type = $("#type option:selected").text(); 
        if (type != "None") { 
            var axisLabel = sender.data.label.Text; 
            if (sender.data.axis.orientation == "vertical") { 
                if (type == "K") { 
                    value = axisLabel / 1000; 
                    sender.data.label.Text = value + " Thousand"; 
                } 
                else if (type == "M") { 
                    value = axisLabel / 100000; 
                    sender.data.label.Text = value + " Million"; 
                } 
                else if (type == "B") { 
                    value = axisLabel / 1000000000; 
                    sender.data.label.Text = value + " Billion"; 
                } 
            } 
        } 
    } 
   
In the above code, we are triggering axesLableRendering event in chart. In the event, we are getting the axis label text and text value is divided by based on the value from the drop down list. Then we are adding suffix such as “thousand” or “Million” or “Billion” with the divided value and assigning that value to the axis label text. 
 
And we have attached the sample in the below location for your reference. 
 
  
Find the output of the sample below 
 
 
 
Please let us know if you have any concern. 
 
Regards, 
Saravana Kumar K 


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.

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.

;