Raphael.js - Wie programmiere ich Elementnamen?

Question

Ich habe eine Reihe von Raphael Rechteck-Elementen per PHP in die Seite hart-codiert, die sie im laufenden Betrieb erzeugt, je nachdem, wie viele benötigt werden, wenn die Seite aufgerufen wird.

Was ich versuche zu tun, ist eine JavaScript-Funktion schreiben, die eine ID-Nummer nehmen und die Hintergrundfarbe der relevanten Raphael-Funktion ändern wird.

Ich weiß das folgende Beispiel wird nicht funktionieren, aber das ist, was ich versuche zu erreichen.

var rectangle_1 = paper.rect(100, 10, 200, 75); 
var rectangle_2 = paper.rect(400, 10, 200, 75); 
var rectangle_3 = paper.rect(700, 10, 200, 75); 

change_color('1'); 

function change_color(id) { 
    variable_name = 'rectangle_' + id; 
    variable_name.attr({fill: 'blue', stroke: 'black', 'stroke-width': 3}); 
} 

Offensichtlich funktioniert das nicht und jede Hilfe und Ratschläge, wie man ein Element Name on the fly zu generieren wäre sehr dankbar,

Grüßen,

Ste

Answer 1

Verwenden Sie einfach ein Array oder ein Objekt zum Speichern der Rects anstelle von benannten Variablen.

var rectangles = []; 
rectangles[0] = paper.rect(100, 10, 200, 75); 
rectangles[1] = paper.rect(400, 10, 200, 75); 
rectangles[2] = paper.rect(700, 10, 200, 75); 

change_color(1); 

function change_color(id) { 
    rectangles[id].attr({fill: 'blue', stroke: 'black', 'stroke-width': 3}); 
} 

Wenn Sie String-IDs benötigen, können Sie es als ein Objekt tun:

var rectangles = {}; 
rectangles['one'] = ...