Pregunta

He construido un mapa de Google basada en datos con diferentes iconos que se asignan al mapa en función del tipo de elemento que se encuentra. Así que si tengo 5 tipos de interés, y cada uno obtiene un icono diferente (tienda, biblioteca, hospital, etc.) - lo que me gustaría hacer es generar el icono de Google objetos de forma dinámica. Estaba pensando en algo como esto:

types = array('hospital','church','library','store',etc);
var i=0;
while (i<=types.length) {

    var landmark + i = new google.maps.Icon();
    landmark.image = "icon" + i + ".png";
    i++;
    } 

Sin embargo, como usted probablemente ha adivinado, esto no funciona. También he intentado usar eval, como esto:

while (i<=types.length) {
        doIcon(i);
        i++;
    }   

    function doIcon(i){ 
        eval("var landmark" + i + " = new.google.maps.Icon();");
        return eval("landmark" + i);
    }

pero que no funcionó either-- lo agradecería cualquier punteros en la generación de JavaScript variables de forma dinámica. Tiene que ser puros js, que podría hacerlo en PHP pero eso no es una opción aquí.

Gracias!

¿Fue útil?

Solución

Es muy fácil de hacer: object["variablename"] = whatever;

Así, por ejemplo, usted podría tener un objeto: var Landmarks = {} y se podía añadir a la misma, así:. Landmarks["landmark" + i] = new google.maps.Icon(); y pasar esa manera

Si necesita estas variables a ser Global (¿por qué lo haría?), Podrá acceder al objeto global directamente utilizando window.

Otros consejos

Si vas a hacerlo usando un objeto declarado como Landmark["landmark" + i], que realmente puede también utilizar una matriz de índice en lugar de una asociativa, es mucho más fácil para la iteración. Los objetos no son realmente utilizados con propiedades indizadas porque matrices hacen un trabajo mucho mejor de ella:

var myObj =           // object version
{
   "item0": "blah",
   "item1": "blah"
   // etc
}
var myArr =           // array version
[
   "blah",
   "blah"
   // etc
]

Mucho más razonable utilizar la matriz:

landmarks = []; // new array
types = array('hospital','church','library','store',etc);  
var i=0;  
while (i<=types.length) {  
    landmarks.push(new google.maps.Icon());
    landmarks[i].image = "icon" + i + ".png";
    i++;  
}

Tiene más sentido hacerlo de esa manera y bucles for...in en los objetos puede ser un poco desordenado con propiedades prototipos ser enumerables, etc.

Si usted está tratando de hacer que una variable global, añadirlo a la ventana de objeto:

var myCustomVar = "landmark" + i;
window[myCustomVar] = new google.maps.Icon();

alert(landmark0);

Pero esto sería contaminar el espacio de nombres global con muchas variables innecesarias. Así que es aún mejor con una matriz:

window.landmarks = [];
landmarks.push(new google.maps.Icon());
// etc...

Sólo para responder a su pregunta directamente (aunque tenga en cuenta que esta no es la solución que desea. Echa un vistazo a las otras respuestas. Esto es sólo para la documentación! ), aquí hay un copiar y pegar de una consola de JavaScript:

> window["myNamedVar"] = "Hello, World!";
> console.log(myNamedVar);
  "Hello, World!"

Usted sería mejor crear un objeto JavaScript que se puede utilizar algo así como una matriz asociativa se utiliza en PHP:

var types = ['hospital','church','library','store'];
var landmarks= {};
for (var i in types) {
    landmarks[types[i]]= new google.maps.Icon();
    landmarks[types[i]].image = "icon" + i + ".png";
} 
alert(landmarks['hospital'].image);  // displays "icon0.png"

¿Usted realmente necesita esas variables? ¿No puede hacer con esto:

var types = ['hospital','church','library','store'];    
for(var i =0; i < types.length; i += 1) (new google.maps.Icon()).image = "icon" + i + ".png";

Modificaciones realiza en base a un comentario:

patrón de nombre de icono cambiado desde el icono + index + .png al icono + Tipo + .png y guardar los resultados del bucle.

types = ['hospital','church','library','store'];
var landmarks = {};


// images names are of the form icon + type + .png
function createIcon(type) 
{ 
    var icon = new google.maps.Icon();
    icon.image = "icon" + type + ".png";
    return icon;
}

// mapping of landamarks by type and icon
for (var i = 0, len = types.length; i < len; i++)
{
    landmarks[types[i]] = createIcon(types[i]);
}

el resultado es: { el hospital: icono, Iglesia: icono, ... }

donde icono es un icono de mapa de Google que tiene un atributo de imagen que es una cadena de la forma "icono {tipo} .png", por ejemplo, iconhostpital.png, iconchurch.png.

Para utilizar los iconos escriben landmarks.type donde tipo es uno de los nombres de la matriz de tipos, por ejemplo, landmarks.hospital.

si los nombres de imagen son de la forma icono + número + .png, y el número de cada tipo es equivalente a su índice de la matriz reemplazar el CreateIcon llamada (tipo [i]) para CreateIcon (i).

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top