使用d3js添加和删除图像

时间:2014-02-04 12:24:21

标签: d3.js

*问题已解决,请忽略*

我正在尝试删除和添加D3.js的图像,我无法弄清楚如何添加。感谢我出错的想法。 Here is the jsfiddle和以下代码:

HTML

<h3>Click on the images - they should be replaced by new ones</h1>
<div id="image_gallery"> 
    <img class="image_gallery" src="http://imgs.xkcd.com/comics/weather.png" width="200" height="300"/>
    <img class="image_gallery" src="http://imgs.xkcd.com/comics/rejection.png" width="200" height="300"/>
</div>

的javascript

var data = [
    ["http://imgs.xkcd.com/comics/protocol.png", "http://imgs.xkcd.com/comics/walmart.png"],
    ["http://imgs.xkcd.com/comics/theft.png", "http://imgs.xkcd.com/comics/questions_for_god.png"]
];
var image_gallery = d3.select("#image_gallery").on("mousedown", function () { transition();});
var index = 0;
function transition() {
    image_gallery.remove();
    for (var i = 0; i < data[index].length; i++) {
        image_gallery.append("img").attr("class", "image_gallery").attr("src", data[index][i])
            .attr("width", 200).attr("height", 300);
    }
    index++;
    d3.select("body").append("h3").text("but they aren't");
}

1 个答案:

答案 0 :(得分:0)

好的想通了。 image_gallery.remove()需要image_gallery.selectAll("img").remove() ...