Charger des emplacements de tableau bidimensionnel dans bMap (un google maps pour le plugin jQuery)

Question

J'utilise le plugin bMap jQuery pour faciliter le processus de travail avec Google Maps sur mon site. La méthode de chargement des marqueurs sur GoogleMap est la suivante.

$('#map').data('bMap').insertMarkers({ 
    "name":"Markers", 
     "data":[ 
     { 
     "lat":51.49757618329838, 
     "lng":-0.1746654510498047, 
     "title":"Science Museum", 
     "body":"Exhibition Road, London SW7" 
     },{ 
     "lat":51.47769451182406, 
     "lng":-0.0009441375732421875, 
     "title":"Royal Observatory Greenwich", 
     "body":"Blackheath Ave, Greenwich, London SE10" 
     } 
     ] 
     }); 

Cependant, je suis charger les emplacements d'un tableau comme celui-ci:

MultiArray = new Array(2)  
MultiArray [0] = new Array(4)  
MultiArray [0][0] = "51.3149757618329838"  
MultiArray [0][1] = "-0.1249757618329838"  
MultiArray [0][2] = "Science Museum"  
MultiArray [0][3] = "Exhibition Road, London SW7" 

MultiArray [1] = new Array(4)  
MultiArray [1][0] = "51.47769451182406" 
MultiArray [1][1] = "-0.0009441375732421875"  
MultiArray [1][2] = "Royal Observatory Greenwich"  
MultiArray [1][3] = "Blackheath Ave, Greenwich, London SE10" 

MultiArray [2] = new Array(4)  
MultiArray [2][0] = "52.4756451182406" 
MultiArray [2][1] = "-0.0009441323532421875"  
MultiArray [2][2] = "Broadwalk College"  
MultiArray [2][3] = "Springfield Ave, Greenwich, London SE10" 

Comme dans, Si le tableau a 10 articles, les 10 articles à la carte. Cela peut être une question javascript générique. Mais j'ai été trompé sur le chemin JSON dans ce domaine, donc j'aimerais savoir s'il y a un autre moyen.

Y at-il un moyen de le faire? Je sais si j'utilise php, et lire les emplacements de la base de données, je peux générer un tel javascript à la volée. Mais je n'ai pas ce luxe. J'ai une variable javascript qui est un tableau d'emplacements que je voudrais charger dans la carte en utilisant la première fonction.

Answer 1

c'est complètement possible. Au lieu d'utiliser votre MultiArray et des éléments de tableau ajoutés individuellement, je viens d'ajouter une fonction à ajouter au tableau (au lieu d'ajouter manuellement [0] [1] etc.)

Non testé comme d'habitude, j'espère que ça aide!

//global mapData variable 
var mapData = []; 

//example function to add a location to mapData 
function addLocation(lat,lng,title,body){ 
    //push the new Object 
    mapData.push({ 
     'lat':lat, 
     'lng':lng, 
     'title':title, 
     'body':body 
    }); 
} 

//example function to actually call your insertMarkers jQuery 
function insertMarkers(){ 
    $('#map').data('bMap').insertMarkers({ 
    "name":"Markers", 
    "data": mapData 
    }); 
} 

//example, add a location to mapData 
addLocation("51.3149757618329838", 
    "-0.1249757618329838", 
    "Science Museum", 
    "Exhibition Road, London SW7" 
    ); 
//example, add another location to mapData 
addLocation("51.47769451182406", 
    "-0.0009441375732421875", 
    "Royal Observatory Greenwich", 
    "Blackheath Ave, Greenwich, London SE10" 
    ); 

//example, call the insertMarkers function (or just replace with your 
//own insertMarkers using the mapData object. 
insertMarkers(); 

Puisque vous a demandé spécifiquement si la façon de traduire votre réseau en deux dimensions dans les données que vous souhaitez fournir à votre fonction de la carte, ici ya go.

//Your array 
var MultiArray = new Array(2)  
MultiArray [0] = new Array(4)  
MultiArray [0][0] = "51.3149757618329838"  
MultiArray [0][1] = "-0.1249757618329838"  
MultiArray [0][2] = "Science Museum"  
MultiArray [0][3] = "Exhibition Road, London SW7" 

// how to loop and just use the insertLocation function 
// provided above 
// I really don't recommend this, if you can output the array directly 
// you might as well just use the "addLocation" function (or your own variety) 
// directly 
for(var i = 0; i<MultiArray.length; i++){ 
    addLocation(
     MultiArray[i][0], 
     MultiArray[i][1], 
     MultiArray[i][2], 
     MultiArray[i][3] 
    ); 
} 

De plus, vous pourriez éviter toutes les absurdités et le faire (je ne l'aime vraiment et ont tendance à vouloir encapsuler des trucs comme ça dans une fonction.)

var MultiArray = []; 
MultiArray.push({ 
    "lat": "51.3149757618329838", 
    "lng": "-0.1249757618329838", 
    "title": "Science Museum", 
    "body": "Exhibition Road, London SW7" 
}); 

$('#map').data('bMap').insertMarkers({ 
    "name":"Markers", 
    "data": MultiArray 
    });