0

nominatimのバウンディングボックスで指定されている場所にズームインするジオコーダーを作成しました。また、その位置の中央にマーカーを配置し、通りが正確にどこにあるかを人々が確認できるようにします。

問題は、マップをパンした後に別のマーカーをズームインまたはズームアウトすると、中央に別のマーカーが再び作成され、マーカーがファイアバグで定義されていないことです。マーカーは1つしかないと表示され、これは正しいです。最後のジオコーダー検索の場所。

また、ジオコーダー関数をログに記録して、ズームイン/ズームアウトしたときに呼び出され、呼び出されないかどうかを確認しました。

ジオコーダー関数は次のとおりです。

 codeAddressLocation: function(address) {    
    // street_number                    huisnummer
    // route                            straatnaam
    // locality                         plaatsnaam
    // administrative_area_level_2      gemeente
    // administrative_area_level_1      provincie
    // country                          land
    // postal_code_prefix               postcode (4 cijfers)
    if (address.length < 10)
        return;
    var site_points = new Array();
    var lon = '';
    var lat = '';
    input = address.replace(" ", "+");
    $.getJSON('http://nominatim.openstreetmap.org/search?q=' + input + '&format=json&addressdetails=1', function(data) {
        if (data != ""  ) {
            var bbox = '';
            $.each(data, function(key,value) {
                bbox = value.boundingbox;
            });
            var point = myLib.transform(bbox[0], bbox[2]);
            var point2 = myLib.transform(bbox[1], bbox[3]);
            if (tbMap.map.layers.length > 2 && tbMap.map.layers[2].CLASS_NAME == "OpenLayers.Layer.Markers") {
                var markerLayer = tbMap.map.layers[2];
                markerLayer.markers = new Array();
                var size = new OpenLayers.Size(21,35);
                var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
                var icon = new OpenLayers.Icon('http://clipartist.info/RSS/openclipart.org/2011/May/28-Saturday/squat_marker_purple-555px.png', size, offset);
                markerLayer.addMarker(new OpenLayers.Marker(tbMap.map.getCenter(),icon));
            } else {
                var markers = new OpenLayers.Layer.Markers("Markers");
                tbMap.map.addLayer(markers);
                var size = new OpenLayers.Size(21,35);
                var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
                var icon = new OpenLayers.Icon('http://clipartist.info/RSS/openclipart.org/2011/May/28-Saturday/squat_marker_purple-555px.png', size, offset);
                markers.addMarker(new OpenLayers.Marker(tbMap.map.getCenter(),icon));
            }

            // Zet de punten in een array
            site_points.push(point);
            site_points.push(point2);
            // return lonlat;
            var linear_ring = new OpenLayers.Geometry.LinearRing(site_points);
            tbMap.map.zoomToExtent(linear_ring.getBounds());
        }
    });
}

ここでは次のように呼ばれます。

$('#autosuggest').click(function() {
  // two options 1) unchecking: remove all coordinateSensitive events
  //             2) checking: add coordinateSensitive events

  if(!$(this).prop('checked')) {
    $(".coordinateSensitive").unbind('keyup');
    $(".coordinateSensitive").unbind('blur');
  } else {
    tbGeocoder.codeAddressLocation($("#address").val() + '+' + $("#housenr").val() + '+' + $('#city').val());
    $('.coordinateSensitive').keyup( function() {
        getCoordinates($(this));
    });

    $('.coordinateSensitive').blur( function() {
        getCoordinates($(this));
    });
  }
});
function getCoordinates(field) {
  var input = $("#address").val() + '+' + $("#housenr").val() + '+' + $('#city').val();
  tbGeocoder.codeAddressLocation(input);
}
4

1 に答える 1

0

マーカー関数を別の関数に書き直す必要がありました。グリッチは次の部分にありました。markerLayer.markers=newArray（）;

これは私にとって今うまくいくものです：

var tbGeocoder = {
markers: null,
features: new Array(),

addMarker: function (lat, lng) {
    // Check of er al een marker is
    for (i = 0; i < tbMap.map.layers.length; i++) {
        if (tbMap.map.layers[i].CLASS_NAME == "OpenLayers.Layer.Markers") {
            tbMap.map.layers[i].clearMarkers();
        }
    }

    // Feature aanmaken
    var feature = new OpenLayers.Feature(this.markers, new OpenLayers.LonLat(lat, lng));
    var marker = feature.createMarker();

    // Markerlayer toevoegen en de marker toevoegen
    tbMap.map.addLayer(myLayers.markers);
    var layer = tbMap.map.layers.length - 1;
    tbMap.map.layers[layer].addMarker(marker);
    this.features.push(feature);
},
codeAddressLocation: function (address) {
    if (address.length < 10) return;
    var site_points = new Array();
    var lon = '';
    var lat = '';
    input = address.replace(" ", "+");
    $.getJSON('http://nominatim.openstreetmap.org/search?q=' + input + '&format=json&addressdetails=1', function (data) {
        if (data != "") {
            var bbox = '';

            // Haal de boundingbox op
            bbox = data[0].boundingbox;

            // Zet een marker in het midden van de map
            tbGeocoder.addMarker(tbMap.map.getCenter().lon, tbMap.map.getCenter().lat);


            // Maak een boundingbox voor de zoom
            var point = myLib.transform(bbox[0], bbox[2]);
            var point2 = myLib.transform(bbox[1], bbox[3]);

            // Zet de punten in een array
            site_points.push(point);
            site_points.push(point2);

            // Linear ring maken om een in een box te zoomen
            var linear_ring = new OpenLayers.Geometry.LinearRing(site_points);
            tbMap.map.zoomToExtent(linear_ring.getBounds());
        }
    });
}
};
于 2012-06-12T13:05:10.730 に答える