Obrysuj kolor tła na płótnie w Raphael za pomocą papieru o zmiennej wartości

Question

Chcę ustawić kolor tła dla określonego koloru. Używam następującego kodu:

//JavaScript Code 
var paper = Raphael(200, 350, 320, 200); 
paper.attr("fill", "#f00"); 

W jakiś sposób ten kod nie działa. Proszę pomóż, jak ustawić kolor tła papieru?

Answer 1

Zobacz odpowiedź poniżej lepszy sposób, ale można zrobić prostokąt, który wypełnia cały obszar kanwie:

var paper = Raphael(200, 350, 320, 200); 
var rect = paper.rect(0, 0, 320, 200); 
rect.attr("fill", "#f00"); 
rect.attr("stroke", "#f00"); 

Answer 2

Właściwie, to całkiem możliwe, aby ustawić kolor tła dla płótnie SVG - zastrzeżeniem jest to, że chociaż Rafael kontroluje wszystkie elementy wewnątrz płótna, oferuje bardzo niewiele kontroli stylistycznej bezpośrednio nad samym płótnem.

Na szczęście można uzyskać dostęp do węzła dom powiązanego z obiektem papieru Raphaela za pośrednictwem jego właściwości canvas. To sprawia, że ​​łatwo robić rzeczy tak:

var paper = Raphael(200, 350, 320, 200); 
paper.canvas.style.backgroundColor = '#F00'; 

jeszcze lepiej, można zdefiniować płótno tła/granicy/dopełnienie jako część arkusza danej aplikacji, a potem po prostu upewnij się, że płótno jest skonfigurowany do korzystania odpowiedni styl:

var paper = Raphael(200, 350, 320, 200); 
paper.canvas.className += ' my_svg_class';