简体   繁体   中英

Remove svg onclick for d3.js wordcloud

I have a html form for selecting a data source to feed my wordcloud in d3.js, but i'm having a hard time making it work. here is the code I have so far.

I'm using the solution for the cloudword from https://github.com/wvengen and hosted the .js scripts in the web of my project

EDITION:

I can load the selected data, but it load down the old data, I need to delete the event svg an add the new one instead.

<!doctype html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">

    <script src="https://d3js.org/d3.v3.min.js"></script>

</head>
<body>

<div id='option'>
    <form>
        <select name="select_data">
            <option value="data" onclick="setData()">All</option>
            <option value="data_a" onclick="aData()">First</option>
            <option value="data_b" onclick="bData()">Second</option>
            <option value="data_c" onclick="cData()">Third</option>
        </select>
    </form>
</div>
<div id='wordcloud'></div>

<script src="https://www.agencia-ahi.cl/archive/d3.layout.cloud.js"></script>
<script src="https://www.agencia-ahi.cl/archive/d3.wordcloud.js"></script>

<script>

var data = [{"text":"perro", "size":67},{"text":"gato", "size":59},{"text":"oso", "size":40}];
var data_a = [{"text":"paloma", "size":64},{"text":"garza", "size":55}];
var data_b = [{"text":"leon", "size":7},{"text":"zorrillo", "size":3}];
var data_c = [{"text":"raton", "size":3}];

d3.wordcloud()
        .words(data)
        .start();

function setData() {
    d3.wordcloud()
        .words(data)
        .start();
        }

function aData() {
    d3.wordcloud()
        .words(data_a)
        .start();
        }

function bData() {
    d3.wordcloud()
        .words(data_b)
        .start();
        }

function cData() {
    d3.wordcloud()
        .words(data_c)
        .start();
        }

</script>
</body>
</html>

在 onclick 功能后添加删除 svg 功能

    d3.select("svg").remove();

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM