1

以下に示す機能では、同じ操作が繰り返されます。できるだけオブジェクトに移動したいのですが。たぶん、オブジェクトで正しいメソッドを初期化したら、ボタンから直接可能ですか？

HTML：

<div id="map" style="width: 500px; height: 400px;"></div>
<button onclick="drawPoly()">Draw This Poly</button>
<button onclick="newPoly()">Create New Poly</button>
<button onclick="restorePolys()">Restore Polys</button>
<button onclick="dropMarker()">Drop Marker</button>

JS：

var map;
var mapListener = null;

$(function() {
    map = new google.maps.Map(document.getElementById('map'), {
        center: new google.maps.LatLng(48.864715, 10.546875),
        zoom: 4,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    });
});

dropMarker = function() {
    if ( !! mapListener) google.maps.event.removeListener(mapListener);

    mapListener = google.maps.event.addListener(map, 'click', function(e) {
        tools.createMarker(e.latLng);
    });
}

drawPolyline = function() {
    if ( !! mapListener) google.maps.event.removeListener(mapListener);

    mapListener = google.maps.event.addListener(map, 'click', function(e) {
        tools.addPoint(e.latLng);
    });
}

newPolyline = function() {
    if ( !! mapListener) google.maps.event.removeListener(mapListener);

    tools.createPolyline();
    mapListener = google.maps.event.addListener(map, 'click', function(e) {
        tools.addPoint(e.latLng);
    });
}

newPolygon = function() {
    if ( !! mapListener) google.maps.event.removeListener(mapListener);

    tools.createPolygon();
    mapListener = google.maps.event.addListener(map, 'click', function(e) {
        tools.addPoint(e.latLng);
    });
}

var tools = {
    polyMarkers: [],
    polyLines: [],
    polyLine: null,
    // ...

    // mapListener: null,
    // tools: function(option) {
    //     if ( !! this.mapListener) google.maps.event.removeListener(this.mapListener);
    //     this.mapListener = google.maps.event.addListener(map, 'click', function(e) {
    //         option(e.latLng);
    //     });
    // },
    // and so on

編集私は期待される機能を手に入れ、ツールに追加しました：

mapListener: null,

initFeature: function(type, aspect) {
    if ( !! this.mapListener) google.maps.event.removeListener(this.mapListener);

    if (aspect) this[aspect]();

    this.mapListener = google.maps.event.addListener(map, 'click', function(e) {
        tools[type](e.latLng);
    });
},

電話：

tools.initFeature(type, aspect);
4

1 に答える 1

1

私があなたがやろうとしていることを理解した場合、おそらくビルダー関数を持っていることが役立つでしょう、あなたのケースの使用法のほとんどを処理するはずのこのようなもの。

function MakeNew(act1, act2) {

    return function() {

        if ( !! mapListener) google.maps.event.removeListener(mapListener);

        if ( act2 ) tools[act2]();

        mapListener = google.maps.event.addListener(map, 'click', function(e) {
            tools[act1](e.latLng);
        });
    };
};


dropMarker = MakeNew('createMarker');
newPolygon = MakeNew('addPoint', 'createPolygon');
createPolygon = MakeNew('addPoint', 'createPolyline');
于 2012-04-25T11:15:15.337 に答える