Question

我在谷歌地图上面临一个问题，即使提供正确的Lat和Long，引脚的初始位置也会被丢弃在错误的位置。此外，当我放大和缩小地图时，引脚将消失并重新出现在另一个错误的位置。

图片以获得更好的解释：Images

ko.bindingHandlers.plotCoordinates = {
init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
    var mapCanvas = $(element).parent().find('.map-canvas')[0];
    var bounds = new google.maps.LatLngBounds();

    var mapOptions = {

        zoom: 15,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var map = new google.maps.Map(mapCanvas, mapOptions);

    for (var index in bindingContext.$data.AnalyticsData().LocationInfo()) {
        var eachLocation = bindingContext.$data.AnalyticsData().LocationInfo()[index];

        var image = "/Images/Location-Icon-Blue copy.png";

        var position = new google.maps.LatLng(eachLocation.Latitude(), eachLocation.Longitude());
        console.log("lat: "+eachLocation.Latitude());
        console.log("long: "+eachLocation.Longitude());
        bounds.extend(position);
        var marker = new google.maps.Marker({
            position: position,
            map: map,
            icon: image
        });
        map.fitBounds(bounds);
    }

    // Override our map zoom level once our fitBounds function runs (Make sure it only runs once)
    var boundsListener = google.maps.event.addListener((map), 'bounds_changed', function (event) {
        this.setZoom(15);
        google.maps.event.removeListener(boundsListener);
    });
},
update: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {

}

}

Answer 1

我解决了。有一个css：

canvas{ 
    width:400px;
    height:600px;
}

这使得标记倾斜。

谷歌地图引脚错误拉，长和放大和缩小更改引脚位置

1 个答案: