Google Map Множественная карта с несколькими маркерами

Question

Я создаю простой план местоположения, поэтому в основе каждой карты Google будет другое местоположение с другим маркером.

Скажем, googlemap2 = координата A и googlemap5 = координата B, мне нужно, чтобы каждый элемент имел маркер, который попадает и центрирует координаты A и B (отдельно, чтобы маркер координаты B никогда не появлялся в googlemap2 наоборот)

до сих пор мой код, как так

var map; 
var map2; 

function initialize(condition) { 

//--------------------------------------------------------------------------- TTDI 
if(document.getElementById('googlemap2') !== null){ 
    var map_canvas = document.getElementById('googlemap2'); 
    var myLatlng = new google.maps.LatLng(3.140425, 101.632005); 
    var mapOptions = { 
     center: myLatlng, 
     zoom: 11, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    map = new google.maps.Map(map_canvas, mapOptions); 
    TestMarker(myLatlng, map); 
} 
//--------------------------------------------------------------------------- CHERAS 
if(document.getElementById('googlemap5') !== null){ 
    var map_canvas2 = document.getElementById('googlemap5'); 
    var myLatlng2 = new google.maps.LatLng(3.140425, 99.632004); 
    var mapOptions2 = { 
     center: myLatlng2, 
     zoom: 11, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    map2 = new google.maps.Map(map_canvas2, mapOptions2); 
    TestMarker(myLatlng2, map2); 
} 


} 


// Testing the addMarker function 
function TestMarker(x,y) { 

     var marker = new google.maps.Marker({ 
     position: x, 
     map: y 
    }); 
} 

в основном он создал то, что я хочу, просто раздражает часть, где он всегда сконцентрируется на первый элемент, так что позволяет сказать, что центры по координате а при googlemap2, googlemap5 будет иметь свой маркер, но центрирование карты будет отключено. Любая помощь PLS?

Answer 1

Я бы сделал что-то вроде следующего, чтобы выполнить вашу задачу и сделать класс более гибким.

var Atlas = (function() { 

    Atlas = function (name) { 
     this.name = name; 
    } 

    Atlas.prototype = { 
     constructMap: function (options) { 
      var _this = this; 
      this.map = new google.maps.Map(options.canvas, options.mapOptions); 
     }, 

     addMarker: function (center) { 
      var _this = this; 
      var marker = new google.maps.Marker({ 
       position: center, 
       map: _this.map 
      }); 
     } 
    } 

    return Atlas; 

})(); 

var mObj1 = { 
    canvas: document.getElementById('map1'), 
    mapOptions: { 
     center: new google.maps.LatLng(3.140425, 101.632005), 
     zoom: 11, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }, 
} 

var mObj2 = { 
    canvas: document.getElementById('map2'), 
    mapOptions: { 
     center: new google.maps.LatLng(3.140425, 99.632004), 
     zoom: 11, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    } 
} 

var atlas = new Atlas("atlas"); 

atlas.constructMap(mObj1); 
atlas.addMarker(mObj1.mapOptions.center); 
atlas.constructMap(mObj2); 
atlas.addMarker(mObj2.mapOptions.center); 

Я сделал демо для вас здесь:

http://jsfiddle.net/wKtmg/

Good Luck!