谷歌地图不会居中,这是jMapping或我的代码的问题吗?

时间:2013-07-26 14:11:26

标签: google-maps google-maps-api-3

我正在尝试使用非常有用的元数据jquery插件jMapping来集中我的地图,但它根本不会居中。

尝试以错误的顺序初始化地图是一个问题 - 我在这里缺少什么......?

// Map init
$(function() {

// styles
var styles = [{

    //  background colour
    featureType: "water",
    elementType: "all",
        stylers: [ { 
            color: '#E7E4DD' }, { visibility: "on" }
        ]
    }, 

    { //  Turn off roads
    featureType: "road",
        stylers: [ 
            { "visibility": "off" }
        ]
    },

    { //  Turn off transit
    featureType: "transit",
        stylers: [ 
            { "visibility": "off" }
        ]
    },

    { //  Turn off administrative
    featureType: "administrative",
        stylers: [ 
            { "visibility": "off" }
        ]
    },  
    { //  country line
    featureType: "administrative.country",
    elementType: "geometry.stroke",
        stylers: [ 
            { "visibility": "on" },
            { "color": "#0068f4"},
            { "weight": "0.7"}
        ]
    },
    { //  style landscape
    featureType: "landscape",
    elementType: "all",
        stylers: [ 
            { "color": "#002E6C" }
        ]
    },

    { //  points of interest
    featureType: "poi",
        stylers: [
            { "color": "#002E6C" }
        ]
    },

    { //  labels
    elementType: "labels",
        stylers: [
            { "visibility": "off" }
        ]
}];

// map options
var mapOptions = {
    zoom: 3,
    center: new google.maps.LatLng(51.165691, 10.451526),
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    disableDefaultUI: false,
    styles: styles,
    minZoom: 3,
    maxZoom: 10
};

// call the map jMapping
$('#map').jMapping({
    map_config: mapOptions,
    default_zoom_level: 2,
    metadata_options: {type: 'html5'},
    category_icon_options: function(category){

        if (category.match('experience')) { // if the category is experience, use custom marker

          return new google.maps.MarkerImage('/wp-content/themes/ichron/assets/map/images/marker.png');

       } 

     }
});

});

1 个答案:

答案 0 :(得分:0)

我有类似的东西,如果我没记错的话,你的体验就是在api响应之前绘制地图的结果。

这是很久以前的事了,但我相信这是实施的延迟:

setTimeout(function() {
       initialize();
}, 500);