Javascript 带有文本框或警报框的D3.Js单击功能_Javascript_Html_D3.js

Javascript 带有文本框或警报框的D3.Js单击功能

javascript html d3.js

Javascript 带有文本框或警报框的D3.Js单击功能,javascript,html,d3.js,Javascript,Html,D3.js,嗨，我正试图有一个与我的圆圈点击功能，将允许我有一个文本框出现时，点击。我在网上查阅了文档，但我只是错过了一些我觉得有点傻的东西。有什么想法吗 <!DOCTYPE html> <html> <head> <script src="https://d3js.org/d3.v5.js"></script> </head> <body> <div id="viz"></div>

嗨，我正试图有一个与我的圆圈点击功能，将允许我有一个文本框出现时，点击。我在网上查阅了文档，但我只是错过了一些我觉得有点傻的东西。有什么想法吗


<!DOCTYPE html>
<html>
<head>
    <script src="https://d3js.org/d3.v5.js"></script>
</head>
<body>
    <div id="viz"></div>
    <script type="text/javascript">

    var sampleSVG = d3.select("#viz")
        .append("svg")
        .attr("width", 200)
        .attr("height", 200);

    sampleSVG.append("circle")
        .style("stroke", "red")
        .style("fill", "blue")
        .attr("r", 40)
        .attr("cx", 150)
        .attr("cy", 150)

    sampleSVG.append("circle")
        .style("stroke", "red")
        .style("fill", "purple")
        .attr("r", 20)
        .attr("cx", 50)
        .attr("cy", 50)



    </script>
</body>

使用on方法添加事件处理程序怎么样

检查下面的示例，它会激活一个简单的警报框

您可以查阅有关的D3文档

const sampleSVG=d3.selectviz .appendsvg .宽度，200 .身高200；示例vg.appendcircle .stylestroke，红色 .stylefill，蓝色 attrr先生，40岁 .150 .自然减员，150 .onclick，函数{alert；}；//点击执行功能示例vg.appendcircle .stylestroke，红色 .stylefill，紫色 attrr先生，20岁 .50岁 .自然减员，50 .onclick，函数{alert；}；//点击执行功能

我不知道你被否决的确切原因，但on方法是正确的。尽管您可能希望添加文档或教程的链接，但OP可以从中了解到这一点，或者至少解释它是如何工作的。此外，对于OP，一个文本框或模态，可能应该手动创建，而不是D3的一部分。嘿，这非常有用。我没有投反对票，也不知道为什么会这样，哈哈。谢谢！！！！这确实有助于启动更大项目的一部分。