Manipolare il colore di sfondo della tela in Raffaello usando carta variabile

Question

Desidero impostare il colore di sfondo su un colore specifico. Io uso il seguente codice:

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

In qualche modo, questo codice non funziona. Per favore aiuto, come posso impostare il colore di sfondo della carta?

Answer 1

vedere la risposta al di sotto di un modo migliore, ma si può fare un rettangolo che riempie l'intera area tela:

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

In realtà, è del tutto possibile per impostare il colore di sfondo per una tela di canapa SVG - l'avvertenza è che, sebbene Raphael controlli tutti gli elementi all'interno della tela, offre pochissimo controllo stilistico direttamente sulla tela stessa.

Fortunatamente, è possibile accedere al nodo dom associato a un oggetto di carta Raphael tramite la proprietà di canvas. Che lo rende facile fare le cose in questo modo:

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

Meglio ancora, si potrebbe definire la tela di fondo/bordo/padding come parte del foglio di stile della vostra applicazione, e poi basta assicurarsi che la tela è impostato per utilizzare l'appropriato stile:

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