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事件，就像你说的那样，然后宣布addListenerOnce如果我在第一个或最后一个点上重置顶点坐标的路径的set_at事件。

以下监听器将允许用户拖动这些顶点，但它们会再次回到原始位置：

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);
    } 
});

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

1 个答案: