0

这是家庭作业，它有一个烦人的错误，经过数小时的努力我无法解决。

http://canvaseu.chrisloughnane.net/

在欧盟地图上单击国家/地区路径会触发绑定事件。

此事件会破坏子图层并加载国家/地区。但是，如果您单击并快速移动鼠标并松开该国家/地区加载的按钮，但来自欧盟的国家/地区路径仍然存在。这在西班牙得到了最好的证明，如屏幕截图所示。

我希望mapLayer.destroyChildren();调用加载函数之后的回调可以解决我的问题。

这可能有点难以复制。

我确信我的控制与我的视图太捆绑了，但我还没有看到一个解决方案来整齐地分开它们。

在此处输入图像描述

**** 编辑 ****

我想出了一个部分有效的解决方案，但我认为这是可怕的 hack 代码，我添加到 mousedown 绑定down = true;并添加了对mouseout绑定的检查，请参见下文。我认为正在发生的事情是，当您移动鼠标并让按钮快速移动时， mouseover绑定就结束了。

此解决方案并不理想，在加载多个国家/地区并将鼠标悬停在区域上之后，画布响应会变慢。

Event Binding

path.on('mousedown touchstart', function() 
{
            down = true;
    this.setStroke('red');
    this.moveTo(topLayer);
    /****
     * Handle if the path we are displaying in canvas is the eu
     * to allow selection and load of country path point data.
     */
    if (associativeCountryArray[lastCountry].getText() == 'eu') 
    {
        associativeCountryArray[lastCountry].setFill('#bbb');
        associativeCountryArray[lastCountry].setFontStyle('normal');
        countrynames[lastCountry].selected = false;
        this.moveTo(mapLayer);
        mapLayer.destroyChildren();
        lastCountry = this.getName();
        countrynames[this.getName()].selected = true;
        associativeCountryArray[this.getName()].setFill("rgb(" + r + "," + g + "," + b + ")");
        associativeCountryArray[this.getName()].setFontStyle('bold');
        loadPaths(this.getName().replace(/\s/g, ''));
        countryNameLayer.draw();
    }
    else
    {
        window.open('https://www.google.com/search?q=' + this.getName(),'_blank');
    }
    topLayer.drawScene();
});



path.on('mouseout', function() 
{
    if(!down)
    {
        document.body.style.cursor = 'default';
        this.setFill('#eee');
        this.setStrokeWidth(settings.strokewidthstart);
        /****
         * On hover, only change colour of country names around edge of canvas if we are on the 'eu' map
         */
        if (lastCountry == 'eu') 
        {
            associativeCountryArray[this.getName()].setFill('#bbb');
            associativeCountryArray[this.getName()].setFontStyle('normal');
        }
        this.setStroke('#555');
        this.moveTo(mapLayer);
        writeMessage('');
        topLayer.draw();
        countryNameLayer.draw();
    }
    else
    {
        down = false;
    }
});
path.on('mouseup touchend', function() 
{
    this.setStroke('black');
    topLayer.drawScene();
    down = false;
});
4

1 回答 1

1

像这样：

发送要清除的容器（组、层）和要触发的回调。

function myDestroyChildren(container,callback) {
    var children = container.getChildren();
    while(children.length > 0) {
        children[0].destroy();
    }
    callback();
}
于 2013-11-06T04:26:37.363 回答