按数据值选择要与 D3 一起显示的数据

Choose data to display with D3 by data's value

本文关键字:数据 一起 显示 D3 选择      更新时间:2023-09-26

>我从SQL引入数据并将其存储在隐藏标签中,然后使用D3作为散点图显示。 我有一个 x 值标签、y 值标签、半径标签,然后是第四个标签,我们称之为集合标签。

基本上,我有七组数据,并且一次只想显示一组(用户将能够从下拉菜单或单选按钮或任何选择要显示的数据中进行选择,这很容易(。 D3 中有没有办法说只显示设置数据 = X 的点?

这是我到目前为止的相关设置:

var x_data = $('.CostImport').text().split(',');
var y_data = $('.PriceImport').text().split(',');
var r_data = $('.SalesImport').text().split(',');
var c_data = $('.ZoneImport').text().split(',');
var data = [];
for (i = 0; i < x_data.length; i++) {
   data.push({ "x": x_data[i], "y": y_data[i], "c": c_data[i], "r": r_data[i] });
}

 vis.selectAll("circle")
            .data(data)
                .enter().append("svg:circle")
                    .attr("cx", function (d) { return x(d.x) })
                    .attr("cy", function (d) { return y(d.y) })
                    .attr("stroke-width", "none")
                    .attr("fill", function (d) { return c(d.c) })
                    .attr("fill-opacity", .75)
                    .attr("r", function (d) { return r(d.r) });

目前我正在按设定值对数据进行着色,但它太忙且重叠。 我意识到我可以为每个集合加载单独的标签和数据(例如x1_data、x2_data等(,但我希望在集合数量发生变化的情况下使其更加强大。

将最后一行更改为:

.attr("r", function (d) { if (d.c == 3) return r(d.r); else return 0 });

完美工作。 在SQL上花费太多时间让我忘记了双等。