1

マーカーがたくさんある地図があります。ただし、マーカーを削除せずに、中心/ズームを変更できるようにしたいです。ユーザーが住所を検索して「検索」をクリックしたときにこれを行います。

機能する次のセンター機能がありますが、すべてのマーカーも削除されます!

    function centerMap(longitude, latitude) {
        var gMap = new google.maps.Map(document.getElementById('map-canvas'));
        gMap.setZoom(10);
        gMap.setCenter(new google.maps.LatLng(longitude, latitude));
    }

私のマークアップは古典的です:

   <div id="map-canvas" style="width: 900px; height: 700px;" />

ボタンをクリックしたときのコード全体:

$('#searchCityBtn').click(function () {
            var query = $('#addressBox').val();
            var url = '<%= ResolveUrl("~/services/geolocationservice.asmx/getlatitudeandlongitude") %>';
            $.ajax({
                type: "POST",
                data: "{'query':'" + query + "'}",
                url: url,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (d) {
                    var jsonResp = JSON.parse(d.d);
                    centerMap(jsonResp.Item2,jsonResp.Item1);
                },
                error: function () {
                    alert('error guys');
                }
            });
        });

もちろん、私はこれを行うことでマップを取得しようとしました:

    function centerMap(longitude, latitude) {
        var gMap = document.getElementById('map-canvas');
        gMap.setZoom(10);
        gMap.setCenter(new google.maps.LatLng(longitude, latitude));

    }

しかし、その後、setZoom または setCenter という関数が存在しないというエラーが表示されます。

この問題を解決するには?:)

4

2 に答える 2

1

さまざまな方法があります。たとえば、次のとおりです。

マップを作成するときは、マップを #map-canvas のプロパティとして保存します。

var canvas=document.getElementById('map-canvas');
    canvas.map = new google.maps.Map(canvas,{/*options*/});

centerMap 内で、このプロパティにアクセスできます。

function centerMap(longitude, latitude) {
    var canvas=document.getElementById('map-canvas');
    canvas.map.setZoom(10);
    canvas.map.setCenter(new google.maps.LatLng(longitude, latitude));
}
于 2013-09-16T19:56:32.077 に答える