Success! Looks like we've fixed this one. According to our records the fix was applied for EXTJS-7235 in a recent build.
  1. #1
    Sencha User Daniil's Avatar
    Join Date
    Jun 2010
    Location
    Saint-Petersburg, Russia
    Posts
    974
    Vote Rating
    110
    Daniil is a name known to all Daniil is a name known to all Daniil is a name known to all Daniil is a name known to all Daniil is a name known to all Daniil is a name known to all

      1  

    Default [4.1.1 GA] Series label color is not applied

    [4.1.1 GA] Series label color is not applied


    REQUIRED INFORMATION

    Ext version tested:
    • Ext 4.1.1 GA
    Browser versions tested against:
    • Any
    Description:
    • A series label color is not applied. It is applied with "contrast: true" option only.
    Steps to reproduce the problem:
    • Just run the sample.
    The result that was expected:
    • Green labels
    The result that occurs instead:
    • Black labels
    Test Case:

    Code:
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Axes labels Bug</title>
    
        <link type="text/css" rel="stylesheet" href="../resources/css/ext-all.css" />
        
        <script type="text/javascript" src="../ext-all.js"></script>
    
        <script type="text/javascript">
            Ext.onReady(function () {
                Ext.create("Ext.chart.Chart", {
                    renderTo: Ext.getBody(),
                    height: 400,
                    width: 400,
                    axes: [{
                        position: "bottom",
                        title: "X",
                        fields: ["x"],
                        type: "Numeric"
                    }, {
                        position: "left",
                        title: "Y",
                        fields: ["y"],
                        type: "Numeric"
                    }],
                    series: [{
                        type: "line",
                        title: "LineSeries",
                        xField: "x",
                        yField: "y",
                        label: {
                            field: "y",
                            display: "under",
                            color: "#00FF00"
                            //, contrast : true
                        }
                    }],
                    store: {
                        fields: [{
                            name: "x"
                        }, {
                            name: "y"
                        }],
                        autoLoad: true,
                        proxy: {
                              type: 'memory',
                            data: [{
                                x: 0,
                                y: 0
                            }, {
                                x: 50,
                                y: 50
                            }, {
                                x: 100,
                                y: 100
                            }]
                        }
                    }
                });
            });
        </script>
    </head>
    <body>
    
    </body>
    </html>

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,801
    Vote Rating
    834
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Thanks for the report! I have opened a bug in our bug tracker.

  3. #3
    Sencha User Daniil's Avatar
    Join Date
    Jun 2010
    Location
    Saint-Petersburg, Russia
    Posts
    974
    Vote Rating
    110
    Daniil is a name known to all Daniil is a name known to all Daniil is a name known to all Daniil is a name known to all Daniil is a name known to all Daniil is a name known to all

      0  

    Default


    Thank you, Mitchell.

    Again, I didn't get an email notification. Please clarify is there any known problem with notifications?

  4. #4
    Touch Premium Member msinn's Avatar
    Join Date
    Jul 2009
    Location
    in front of my pc
    Posts
    280
    Vote Rating
    5
    msinn is on a distinguished road

      0  

    Default


    Even if I try to change the label color over a Theme, the new value wont't be applied to the label.

    Code:
    Ext.chart.theme.LineLabels = Ext.extend(Ext.chart.theme.Base, {
        constructor: function() {
            Ext.chart.theme.LineLabels.superclass.constructor.call(this, {
                seriesLabel: {
                    font: '12px Arial',
                    color:'#333333'
                }
           });
        }
    });
    This is tested with Ext.chart.series.Line.

    Is there a workaround or ta css class to apply on the label?
    First I would like to thank you for your time and knowledge

    Win 7 Ext JS 4.1.3 IE(6-9), FF17

  5. #5
    Sencha User Daniil's Avatar
    Join Date
    Jun 2010
    Location
    Saint-Petersburg, Russia
    Posts
    974
    Vote Rating
    110
    Daniil is a name known to all Daniil is a name known to all Daniil is a name known to all Daniil is a name known to all Daniil is a name known to all Daniil is a name known to all

      1  

    Default


    Hi @msinn,

    The problem lays in a Ext.chart.Label mixin, the renderLabels method.

    There is the following condition.
    Code:
    if (config.contrast && item.sprite)
    Removing "config.contrast &&" does the trick. Though, I don't know why this condition appeared initially. So, I can't guarantee there won't be any backstage effects.

    Here is a working sample.

    Example
    Code:
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Axes labels Bug</title>
    
        <link type="text/css" rel="stylesheet" href="../resources/css/ext-all.css" />
        
        <script type="text/javascript" src="../ext-all.js"></script>
    
        <script>
            Ext.chart.series.Line.override({
                renderLabels: function() {
                    var me = this,
                        chart = me.chart,
                        gradients = chart.gradients,
                        items = me.items,
                        animate = chart.animate,
                        config = me.label,
                        display = config.display,
                        color = config.color,
                        field = [].concat(config.field),
                        group = me.labelsGroup,
                        groupLength = (group || 0) && group.length,
                        store = me.chart.getChartStore(),
                        len = store.getCount(),
                        itemLength = (items || 0) && items.length,
                        ratio = itemLength / len,
                        gradientsCount = (gradients || 0) && gradients.length,
                        Color = Ext.draw.Color,
                        hides = [],
                        gradient, i, count, groupIndex, index, j, k, colorStopTotal, colorStopIndex, colorStop, item, label,
                        storeItem, sprite, spriteColor, spriteBrightness, labelColor, colorString;
    
                    if (display == 'none') {
                        return;
                    }
            
                    if(itemLength == 0){
                        while(groupLength--) {
                            hides.push(groupLength);
                        }
                    } else {
                        for (i = 0, count = 0, groupIndex = 0; i < len; i++) {
                            index = 0;
                            for (j = 0; j < ratio; j++) {
                                item = items[count];
                                label = group.getAt(groupIndex);
                                storeItem = store.getAt(i);
                        
                                while(this.__excludes && this.__excludes[index]) {
                                    index++;
                                }
    
                                if (!item && label) {
                                    label.hide(true);
                                    groupIndex++;
                                }
    
                                if (item && field[j]) {
                                    if (!label) {
                                        label = me.onCreateLabel(storeItem, item, i, display, j, index);
                                    }
                                    me.onPlaceLabel(label, storeItem, item, i, display, animate, j, index);
                                    groupIndex++;
    
                            
                                    if (/*config.contrast && */item.sprite) { // here is a workaround
                                        sprite = item.sprite;
                                
                                        if (sprite._endStyle) {
                                            colorString = sprite._endStyle.fill;
                                        }
                                        else if (sprite._to) {
                                            colorString = sprite._to.fill;
                                        }
                                        else {
                                            colorString = sprite.attr.fill;
                                        }
                                        colorString = colorString || sprite.attr.fill;
    
                                        spriteColor = Color.fromString(colorString);
                                
                                        if (colorString && !spriteColor) {
                                            colorString = colorString.match(me.colorStringRe)[1];
                                            for (k = 0; k < gradientsCount; k++) {
                                                gradient = gradients[k];
                                                if (gradient.id == colorString) {
                                            
                                                    colorStop = 0; colorStopTotal = 0;
                                                    for (colorStopIndex in gradient.stops) {
                                                        colorStop++;
                                                        colorStopTotal += Color.fromString(gradient.stops[colorStopIndex].color).getGrayscale();
                                                    }
                                                    spriteBrightness = (colorStopTotal / colorStop) / 255;
                                                    break;
                                                }
                                            }
                                        }
                                        else {
                                            spriteBrightness = spriteColor.getGrayscale() / 255;
                                        }
                                        if (label.isOutside) {
                                            spriteBrightness = 1;
                                        }
                                        labelColor = Color.fromString(label.attr.color || label.attr.fill).getHSL();
                                        labelColor[2] = spriteBrightness > 0.5 ? 0.2 : 0.8;
                                        label.setAttributes({
                                            fill: String(Color.fromHSL.apply({}, labelColor))
                                        }, true);
                                    }
    
                                }
                                count++;
                                index++;
                            }
                        }
                        groupLength = group.length;
            
                        while(groupLength > groupIndex){
                            hides.push(groupIndex);
                            groupIndex++;
                       }
                    }
                    me.hideLabels(hides);
                }
            });
        </script>
    
        <script type="text/javascript">
            Ext.onReady(function () {
                Ext.create("Ext.chart.Chart", {
                    renderTo: Ext.getBody(),
                    height: 400,
                    width: 400,
                    axes: [{
                        position: "bottom",
                        title: "X",
                        fields: ["x"],
                        type: "Numeric"
                    }, {
                        position: "left",
                        title: "Y",
                        fields: ["y"],
                        type: "Numeric"
                    }],
                    series: [{
                        type: "line",
                        title: "LineSeries",
                        xField: "x",
                        yField: "y",
                        label: {
                            field: "y",
                            display: "under",
                            color: "#00FF00"
                            //, contrast : true
                        }
                    }],
                    store: {
                        fields: [{
                            name: "x"
                        }, {
                            name: "y"
                        }],
                        autoLoad: true,
                        proxy: {
                              type: 'memory',
                            data: [{
                                x: 0,
                                y: 0
                            }, {
                                x: 50,
                                y: 50
                            }, {
                                x: 100,
                                y: 100
                            }]
                        }
                    }
                });
            });
        </script>
    </head>
    <body>
    
    </body>
    </html>
    Ext.NET - ASP.NET for Ext JS
    MVC and WebForms
    Examples | Twitter

  6. #6
    Touch Premium Member msinn's Avatar
    Join Date
    Jul 2009
    Location
    in front of my pc
    Posts
    280
    Vote Rating
    5
    msinn is on a distinguished road

      0  

    Default


    Thank you,

    now I can see them better... but you posted also another bug for the positioning of the labels in a line series.
    So they are allways behind the marker point or out of the series area.
    And when I resize the browser window, they disappear at all .
    Working with Labels in a line series can be very frustrating
    First I would like to thank you for your time and knowledge

    Win 7 Ext JS 4.1.3 IE(6-9), FF17

  7. #7
    Sencha User Daniil's Avatar
    Join Date
    Jun 2010
    Location
    Saint-Petersburg, Russia
    Posts
    974
    Vote Rating
    110
    Daniil is a name known to all Daniil is a name known to all Daniil is a name known to all Daniil is a name known to all Daniil is a name known to all Daniil is a name known to all

      0  

    Default


    Agree, these issues annoys. Hopefully, they will be fixed in 4.2.

    And when I resize the browser window, they disappear at all .
    You can point this thing out in my bug report. To get a chance that ExtJS will look at it and, probably, will fix as well.
    Ext.NET - ASP.NET for Ext JS
    MVC and WebForms
    Examples | Twitter

  8. #8
    Sencha Premium Member
    Join Date
    Nov 2012
    Posts
    12
    Vote Rating
    2
    ukjbrown is on a distinguished road

      0  

    Default


    Still exists in 4.2

  9. #9
    Sencha User Daniil's Avatar
    Join Date
    Jun 2010
    Location
    Saint-Petersburg, Russia
    Posts
    974
    Vote Rating
    110
    Daniil is a name known to all Daniil is a name known to all Daniil is a name known to all Daniil is a name known to all Daniil is a name known to all Daniil is a name known to all

      0  

    Default


    Marked as fixed in 4.2.1.
    Ext.NET - ASP.NET for Ext JS
    MVC and WebForms
    Examples | Twitter

  10. #10
    Sencha User
    Join Date
    Mar 2011
    Posts
    3
    Vote Rating
    0
    kuangniaokuang is on a distinguished road

      0  

    Default color' attribute still doesn't work in 4.2.1

    color' attribute still doesn't work in 4.2.1


    'color' attribute still doesn't work in 4.2.1


    'fill' can work................................
    Last edited by kuangniaokuang; 24 Jun 2013 at 12:09 AM. Reason: add

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi