Results 1 to 8 of 8

Thread: Column Chart - how to customize legend text

Hybrid View

Previous Post Previous Post   Next Post Next Post
    Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Sencha Premium Member
    Join Date
    Oct 2011
    Posts
    5
    Vote Rating
    0
      0  

    Question Column Chart - how to customize legend text

    Hi,

    I need to customize the legend text in a column chart and could not find the way to do it.
    Tried to add renderer, legendRenderer to the legend but nothing works.

    Any help would be appreciated.

    10x,
    Aviad

  2. #2
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,553
    Answers
    3931
    Vote Rating
    1272
      0  

    Default

    Currently no way to easily do this.
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it! Checkout the CODE tag!

    Check out my GitHub, lots of nice things for Ext JS and Sencha Touch
    https://github.com/mitchellsimoens

  3. #3
    Sencha User
    Join Date
    Jul 2011
    Posts
    12
    Vote Rating
    1
      0  

    Default

    Hi,

    I needed to customize axis title and for that I had to create my own chart theme. I guess you wil have to do the same for legend.

    You will have to create your own file_MyTheme.scss and use the cmd "build-touch-charts.sh/.bat", as described here : http://docs.sencha.com/touch-charts/1-0/#!/guide/touch_charts_styling

    Take a look at that file if you decide to create your theme :
    touch-charts\resources\themes\stylesheets\touch-charts\default\_legend.scss

  4. #4
    Touch Premium Member
    Join Date
    Jun 2011
    Location
    Perth, Western Australia
    Posts
    80
    Vote Rating
    1
      0  

    Default

    Are you referring to the way Sencha uses the data model field names as labels?
    In our case, we're using SQLite as the data source so it was a simple matter of using field aliases in our SELECT SQL statements to get user friendly display names.
    We also needed to make those names react to the on-the-fly language change system .. which we found we could

  5. #5
    Sencha Premium Member
    Join Date
    Oct 2011
    Posts
    5
    Vote Rating
    0
      0  

    Default

    Hi,

    Yes, I exactly mean that. I did workaround it by changing the field names.
    How did you make those names react to the 'on-the-fly language change system'? Do you mean you did it by changing the aliases on the SQL?

  6. #6
    Touch Premium Member
    Join Date
    Jun 2011
    Location
    Perth, Western Australia
    Posts
    80
    Vote Rating
    1
      0  

    Default

    We have built an on-the-fly language changing system, using a JSON array of translations... called by a function called "_ ". We load the array before the models & proxies are loaded.

    This all works well...

    E.g. Model
    PHP Code:
    Ext.regModel('weatherGraphModel', {
        
    fields: [
            {
    name 'TheDate'     type 'datetime'},
            {
    name _('Rainfall')     , type 'float'},
            {
    name _('Evaporation')     , type 'float'},
            {
    name _('MinTemp')     , type 'float'},
            {
    name _('MaxTemp')     , type 'float'},
            {
    name _('MinHumidity')     , type 'float'},
            {
    name _('MaxHumidity')     , type 'float'},
            {
    name _('MaxTempHumidity')     , type 'float'}  
        ],
        
    proxy: {
            
    type"graphProxy"
        
    }
    }); 
    Proxy - SQL

    PHP Code:
                sql 'SELECT TheDate, '+
                
    'Rainfall AS '+_('Rainfall')+
                
    ', Evaporation AS '+_('Evaporation')+
                
    ', MinTemp AS '+_('MinTemp')+
                
    ', MaxTemp AS '+_('MaxTemp')+
                
    ', MinHumidity AS '+_('MinHumidity')+
                
    ', MaxHumidity AS '+_('MaxHumidity')+
                
    ', MaxTempHumidity AS '+_('MaxTempHumidity'); 
    Example of Code in Chart JS

    PHP Code:
        axes: [{
            
    type'Numeric',
            
    minimum0,
            
    position'left',
            
    fields: [_('Rainfall'), _('Evaporation'), _('MinTemp'), _('MaxTemp')], 

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •