javascript - 暂时禁用拖动功能(d3js)

Question

在您的帮助下，我创建了一个 svg-“编辑器”，其中将分组的符号加载到数据库和从数据库加载:

var svgEditor = d3.select('#drawing');
for (var i = 0; i < symbols.length; i++) {
    var symbol = symbols[i];
    const g = svgEditor.append("g")
        .attr("transform", "translate(" + symbol.SymbolPosition + ")")
        .attr("id", symbol.SubFunctionId.toString())
        .attr("class", "draggable preview")
        .attr("pointer-events", "fill")
        .call(d3.drag()
            .on("start", dragstarted)
            .on("drag", dragged)
            .on("end", dragended)
        );
    g.html(symbol.SVG.replace("#{BMK}", symbol.BMK));
}

现在我也添加了在此 SVG 中绘制线条的功能。我的问题是这些行应该直接在符号处开始和结束。当开始一条线时，我可能没有插入第一个 x-y 坐标，而是将符号拖到下方。有没有办法在插入第一个点之前暂时禁用 SVG 元素的 d3 拖动功能？

这里，我开始第一点:

function mouseButtonPressed(evt) {
    pointerOrigin = getPointFromEvent(evt);
    //Wheel pressed, PAN Viewbox
    if (evt.button === 1) {
        pointerDown = true;
        svgDrawing.style.cursor = 'move';
    }
    //Draw a line
    else if (evt.button === 0 && drawingLine === 1)
    {
        line = d3.select('#drawing').append('line')
            .classed(lineClass, true)
            .attr("x1", Math.round(pointerOrigin.x / raster) * raster)
            .attr("y1", Math.round(pointerOrigin.y / raster) * raster)
            .attr("x2", Math.round(pointerOrigin.x / raster) * raster)
            .attr("y2", Math.round(pointerOrigin.y / raster) * raster);

    }
    //place a new Symbol on editor
    else if (evt.button == 0 && newSymbol) {
        positionData = newSymbol.attr("transform").replace("translate(", "");
        positionData = positionData.replace(")", "");
        positionData = positionData.replace(" ", ",");
        saveSymbolPosition();
        newSymbol = null;
    }
}

Answer 1

我认为这对你有用

d3.select('selector').on('mousedown.drag', null);