如何右键单击打开D3.js上下文菜单

问题描述 投票:0回答:1

我使用d3.js在用户的屏幕上画线。我想要做的是在过程完成后右键单击打开上下文菜单。此菜单必须为“完成”和“撤消”。我该怎么办?

<!DOCTYPE HTML>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="assets/style.css">
<body>
<script src="assets/d3.min.js"></script>
<script>
    let line;

    let vis = d3.select("body").append("svg")
        .attr("width", 1280)
        .attr("height", 610)
        .on("click", mousedown)
        .on("contextmenu", mouseup);

    function mousedown() {
        let m = d3.mouse(this);
        line = vis.append("line")
            .attr("x1", m[0])
            .attr("y1", m[1])
            .attr("x2", m[0])
            .attr("y2", m[1]);

        vis.on("mousemove", mousemove);
    }

    function mousemove() {
        let m = d3.mouse(this);
        line.attr("x2", m[0])
            .attr("y2", m[1]);
    }

    function mouseup() {
        vis.on("mousemove", null);
    }
</script>

javascript d3.js contextmenu
1个回答
0
投票

this post可能会帮助您。

使用javascript和css构建上下文菜单的完整详细分步指南。

您只需将上下文项与d3.js操作相关联即可进行操作

© www.soinside.com 2019 - 2024. All rights reserved.