在D3中绑定大数组

Binding big arrays in D3

本文关键字：数组 绑定 D3      更新时间：2023-09-26

我使用D3来可视化绑定到映射的数据，我不知道应该如何处理大列表。

如果我使用的是行业数据，大约有20个左右的NAICS，这很容易。

例如，我使用以下代码绑定来自geojson的数据：

 var values = feature.properties;              
 var data = [
    {key: "Agric.,forestry., fishing.,hunting.", name:"N11",value:values["N11"]},
    {key: "Mining.,quar., oil,gas", name:"N21",value:values["N21"]},
    {key: "Utilities", name:"N22",value:values["N22"]},
    {key: "Constr.", name:"N23OL",value:values["N23"]},
    {key: "Manuf.", name:"N31_33OL",value:values["N31-33"]},
    {key: "Wholesale trade", name:"N41OL",value:values["N41"]},
    {key: "Retail trade", name:"N44-45",value:values["N44-45"]},
    {key: "Transportation, warehousing", name:"N48-49",value:values["N48-49"]},
    {key: "Information, cultur.industries", name:"N51",value:values["N51"]},
    {key: "Finance, insurance", name:"N52",value:values["N52"]},
    {key: "Real estate, rental,leasing", name:"N53",value:values["N53"]},
    {key: "Prof.scientific, techn.services", name:"N54",value:values["N54"]},
    {key: "Management companies,enterprises", name:"N55",value:values["N55"]},
    {key: "Admin.support, waste.manag., remed.services", name:"N56",value:values["N56"]},
    {key: "Educational services", name:"N61",value:values["N61"]},
    {key: "Health.care, social.assistance", name:"N62",value:values["N62"]},
    {key: "Arts,entertainment, recreation", name:"N71",value:values["N71"]},
    {key: "Accommodation, food.services", name:"N72",value:values["N72"]},
    {key: "Other.services (except.pub. admin.)", name:"N81",value:values["N81"]},
    {key: "Public administration", name:"N91",value:values["N91"]}
];

现在，如果我想使用职业数据，这会很棘手，因为大约有800个。显然，像这样手工打字是不实用的。该如何处理？使用d3.CSV导入CSV并与geojson数据对象连接？我不知道从哪里开始。

以下是我对较小集合所做操作的示例：https://jsfiddle.net/Monduiz/tr5pxv1s/

听起来你很清楚自己在做什么，你只是错过了最好的例子：

示例可视化映射从选项卡分隔值加载的相当大的数据集。

在该示例中，很容易忽略的是它如何使用d3.queue()、defer()和await()来确保以正确的顺序加载和处理数据。

另请参阅其他CSV相关功能的文档。

相关文章：