Google Maps Api：折线可编辑事件 - 使顶点不可编辑

Question

我想让可编辑多段线的开始和结束顶点不可编辑。这样用户就可以编辑除这两个之外的所有其他顶点。我已经实现了一个事件侦听器（mousedown）来过滤顶点，但是我怎样才能阻止它被编辑？

google.maps.event.addListener(poly, 'mousedown', function (event) {
    if (event.vertex === 0) { // First vertex of polyline
        //disable vertex from being editable
    }
});

Answer 1

你在正确的道路上。

要检测顶点已被移动，请在折线路径上监听 set_at 事件。但是，这不会让你知道原来的位置是什么，所以我要做的是捕获mousedown 事件，就像你说的那样，并在路径的set_at 事件上声明一个addListenerOnce如果我在第一点或最后一点，请重置顶点坐标。

以下监听器将允许用户拖动这些顶点，但它们会下意识地回到原来的位置：

google.maps.event.addListener(poly, 'mousedown', function (event) {
    var thePath = this.getPath();
    if (event.vertex === 0 || event.vertex === thePath.getLength() - 1) {
        google.maps.event.addListenerOnce(thePath, 'set_at', function (vertex) {
            this.setAt(vertex, event.latLng);
        });
    }
});

为什么我使用addListenerOnce？你看，这是因为否则重置第一个或最后一个点的行为会触发相同的事件，导致最大堆栈错误。

编辑：这是另一个尝试。以下侦听器不允许用户拖动所述顶点。但是，我正在立即重新启用可编辑行为。您的浏览器中可能存在竞争条件。

google.maps.event.addListener(poly, 'mousedown', function (event) {
    var thePath = this.getPath();

    if (event.vertex === 0 || event.vertex === thePath.getLength() - 1) {
        console.debug('Vertex forbidden!');
        this.set('editable',false);
        this.set('editable',true);
    } 
});