How to change the color of svg objects imported into raphaeljs from corel?

Question

I imported a .svg file into raphael and I would like to be able to change the fill colors and stroke colors of the shapes.

my_set = my_paper.importSVG( my_svgXML ) ;

for( var i = 0 ; i < my_set.length ; i++ )
  { var lvo_element  = my_set[ i ] ; 
    lvo_element.attr( { 'fill'    :  '#fafafa' } ) ;

    console.log( lvo_element.attrs.fill ) ; 
    // correctly outputs  '#fafafa'  
  }

... but the elements' colors are not updating. However, lvo_element.glow() does work.

---

EDIT: fabricjs requires a .renderAll() call after any property changes ... but I do not see anything in raphael docs that seems similar to that, such as 'update'

---

NOTE:

• I used jquery.ajax to load my.svg into app

• I used raphael-svg-import.js for importing it into raphael

• I have tried non-object notation also: lvo_element.attr('fill', '#fafafa' ) ;

Answer 1

When exporting to .svg from CorelDesignerX5, there is a Styling Options pulldown box which defaults to Internal StyleSheet. This thus creates a internal stylesheet in the exported svg, which just causes all kinds of problems, at least with the raphael library.

Change the Styling Options to Presentation Attributes.