2

我正在尝试在维基百科上启用 Vega 图表/地图，并寻找一种方法来绘制不同国家/地区的地图，并以不同的颜色突出显示。因此，对于http://graphtest.wmflabs.org/wiki/Graph:Map上的地图，我想要另一个表格，例如 US=red,FR=green,HE=blue 等，它将用颜色突出显示给定的国家. Graph 的定义使用数字国家 ID，因此实际上我将有一个表“10”：“red”等。我似乎无法弄清楚的是如何将国家数据与 vega json 中的突出显示混合。

4

1 回答 1

1

您的问题包括 2 个问题。

1. 身份证：

正如您所指出的，当您使用http://jsoneditoronline.org检查时，您使用的 JSON似乎使用数字作为 ID，因此您目前无法识别哪个形状是 US、FR、HE。最好将此版本与. 我目前手头没有任何 json ，但是您的项目需要英语或 ISO。这几天我在出差。最好和相当容易的是获得具有这两个属性的 JSON 。这很快就会到来。id={country_name_in_english}iso codeid={country_name_in_english}, iso={iso_code}

2. Vega 选择器：

我还不熟悉 Vega，所以我会将此作为一个纯粹的 D3js 问题来处理如何创建，然后选择正确的形状并根据相关数据为它们着色......

//Create your D3js shapes with the right attributes
var countries = d3.selectAll(".countries")
   ...  // more d3js code creating the countries' shapes here
   .attr("id", function(d){ return d.id })  // <= important !
   ...

// Custom data
var coloring = [ [ "US", "red"], ["FR", "green"], ["HE", "blue"] ];

// Color the given shapes
for (i=0; i < color.length; i++) {
    var focus = d3.selectAll("#"+coloring[i][0])
                .style("fill", coloring[i][1]);
}

注意：一个纯粹的 Vega 解决方案肯定会更优雅。

于 2014-09-05T08:08:32.933 回答