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.

datalabel for chart

Thread ID:

Created:

Updated:

Platform:

Replies:

118367 Mar 3,2015 07:30 AM Mar 3,2015 11:43 PM JavaScript 1
loading
Tags: ejChart
kalpa serashiya
Asked On March 3, 2015 07:30 AM

please Give list of all properties available for datalabel  of chart

Jayavigneshwaran [Syncfusion]
Replied On March 3, 2015 11:43 PM

Hi Kapla,

We have analyzed this and listed the properties available to customize the data labels in chart. Find it from the below table

[JS]

    $("#container").ejChart(

                        {

                            commonSeriesOptions: {

                                type: 'line',

                                marker:

                              {

                                  dataLabel: {

                                      angle: -45,                      // to rotate the data label

                                      border: {

                                          color: "green",                // color of the border

                                          width: 2                        // width of the border

                                      },

                                      connectorLine: {                   // this is for accumulation series

                                          type: "bezier",                 // type of the connector line

                                          width: 2                        // width of the connector line

                                      },

                                      fill: "red",                      // background of the data label

                                      font: {                            // properties to customize the text in data label

                                          fontFamily: "algerain",

                                          fontStyle: "italic",

                                          fontWeight: "lighter",

                                          opactiy: 0.5,

                                          color: "white"

                                      },

                                      horizontalTextAlignment: "far",   // to align the data label horizontally

                                      margin: {                           // properties to adjust the text inside the shape

                                          left: 10,

                                          right: 10,

                                          top: 10,

                                          bottom: 10

                                      },

                                      opacity: 0.5,                 // opacity of the data label

                                      textPosition: "top",          // position to place the data label

                                      verticalTextAlignment: "far"// to align the data label vertical

                                      visible: true,                  // to toggle the visibility

                                  },

                              }

 

                            }

                        });

 

And you can also refer the below API documentation link to know the available API’s and their syntax.

Link: http://help.syncfusion.com/UG/JS_CR/ejChart.html#series->marker->dataLabel

 

The below link show a sample with data label and data label template

Link:  http://js.syncfusion.com/demos/web/#!/azure/chart/chartcustomization/labeltemplate

 

Please let us know if you have any concern.

 

Thanks,

Jayavigneshwaran



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.

;