Results 1 to 7 of 7

Thread: Problem in changing Ext.draw item style property in IE8

    Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Sencha User
    Join Date
    Feb 2012
    Posts
    13

    Default Problem in changing Ext.draw item style property in IE8

    REQUIRED INFORMATION




    Ext version tested:
    • Ext 4.0.2

    Browser versions tested against:
    • IE8
    • FF3 (firebug 1.3.0.10 installed)
    • Safari 5
    Description:
    • I am using Ext.draw component in my application. I have an issue with setting a properties (opacity,stroke-dasharray) to the draw componenet item in IE8 which works fine in Firefox,Chrome. Works fine in IE8 also if we mention the properties while creating the item of the draw component as like below.
      Code:
      var drawComponent = Ext.create('Ext.draw.Component', {
          viewBox: false,
          items: [{
              type: 'rect',
              id: 'myRect',
              fill: '#FFFFFF',
              width: 100,
              height: 100,
              x: 10,
              y: 10,
              opacity: 1,
              'stroke-dasharray': 5,
              stroke: '#000000'
          }]
      });
      I have to change some of the properties like stroke,opacity based on some condition, which is not happening. Trying to change the property as like below
      Ext.get('myRect').setStyle('stroke',#FFFFFF);

      The above line works fine in FF,Chrome but not in IE8.
    The result that was expected:
    • Change the style(opacity, stroke) of a draw component sprite based on some logic.
    The result that occurs instead:
    • style/ properties(opacity, stroke) of a draw component sprite is not changed in IE8.
    Test Case:


    Code:
    //spriteId - Id of the sprite of which the stroke color has to be changed
       Ext.get('spriteId').setStyle('stroke',#FFFFFF);
    Operating System:
    • WinXP Pro

  2. #2
    Sencha User mystix's Avatar
    Join Date
    Mar 2007
    Location
    Singapore
    Posts
    6,232

    Default

    did you try this against 4.1.0-rc3 (released just yesterday)?

  3. #3
    Sencha User
    Join Date
    Feb 2012
    Posts
    13

    Default

    Hi Mystix,

    Thanks for the reply. I have checked with the latest version 4.1.0-rc3, still the issue persists.

    Thanks,
    Ramesh MN

  4. #4
    Sencha Premium User
    Join Date
    Nov 2010
    Location
    Chicago
    Posts
    2,372

    Default

    This works for me.

    Code:
    var drawComponent = Ext.create('Ext.draw.Component', {
        viewBox: false,
        renderTo: Ext.getBody(),
        items: [{
            type: 'rect',
            id: 'myRect',
            fill: '#FFFFFF',
            width: 100,
            height: 100,
            x: 10,
            y: 10,
            opacity: 1,
            'stroke-dasharray': 5,
            stroke: '#000000'
        }]
    });
    
    drawComponent.surface.items.first().setAttributes({
        stroke: 'blue'
    }, true);

  5. #5
    Sencha User
    Join Date
    Feb 2012
    Posts
    13

    Default

    Hi LesJ,

    There can be any number of items in the "
    drawComponent", so need to update it using the Id only as like below.

    Ext.get('myRect').setStyle('stroke','#FFFFFF');
    //myRect is the id of the item of drawComponent

    Thanks,
    Ramesh MN

  6. #6
    Sencha Premium User
    Join Date
    Nov 2010
    Location
    Chicago
    Posts
    2,372

    Default

    Quote Originally Posted by rameshmn View Post
    Hi LesJ,

    There can be any number of items in the "
    drawComponent", so need to update it using the Id only as like below.

    Ext.get('myRect').setStyle('stroke','#FFFFFF');
    //myRect is the id of the item of drawComponent

    Thanks,
    Ramesh MN
    This should work:

    Ext.getCmp('myDrawCmp').surface.items.get('mySpriteId').setAttributes(...)

  7. #7
    Sencha User
    Join Date
    Feb 2012
    Posts
    13

    Default

    This works for me... Thanks a lot LesJ...

Tags for this Thread

Posting Permissions

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