D3不会更新数据

Question

我用d3制作图形。
我有2个复选框，它们引用了2个不同的数据集。 当我点击其中一个数据更新并重新绘制图形时，我需要这样做 我使用这种方法但不起作用：

div {
  border: 1px solid red;
  line-height: 40px;
}

textarea {
  line-height: 20px;
  display:block;
}

<div><textarea></textarea></div>

function mostrarDatos(){ nowData=[] if($("#eae").prop('checked') == true) { nowData.push(eaepunt1[coundata]) } if($("#arab").prop('checked') == true) { nowData.push(arabpunt1[coundata]) } console.log(nowData) svg.selectAll("circle") .data(nowData) .attr("cx", function(d) { return xScale(d[0]); }) .attr("cy", function(d) { return yScale(d[1]); }) } 是要显示的数组。 nowData和eaepunt1是复选框的数据集，它们在图片中显示arabpunt1和x。

我用这个开始数据集：

y

Answer 1

试试这个：

    function mostrarDatos(){
        nowData=[]
        if($("#eae").prop('checked') == true)               
        {   
            nowData.push(eaepunt1[coundata])                                    
        }               

        if($("#arab").prop('checked') == true)
        {
            nowData.push(arabpunt1[coundata])                                                               
        }                                           
        console.log(nowData)                            
        svg.selectAll("circle")
           .data(nowData)
           .enter()            
           .append("circle")                           
           .attr("cx", function(d) {
                return xScale(d[0]);
           })
           .attr("cy", function(d) {
                return yScale(d[1]);
           })
           .attr("r", function(d) {
                return 5;
           })              
           ;
    }

被修改

    function mostrarDatos(){
            nowData=[]
            svg.selectAll("circle")
                .data(nowData)
                .exit()
                .remove()
            if($("#eae").prop('checked') == true)               
            {   
                nowData.push(eaepunt1[coundata])                                    
                svg.selectAll("circle")

            }               

            if($("#arab").prop('checked') == true)
            {
                nowData.push(arabpunt1[coundata])                                                               

            }                                           
            console.log(nowData)

            svg.selectAll("circle")
               .data(nowData)
               .enter()            
               .append("circle")                           
               .attr("cx", function(d) {
                    return xScale(d[0]);
               })
               .attr("cy", function(d) {
                    return yScale(d[1]);
               })
               .attr("r", function(d) {
                    return 5;
               })              
               ;
        }