在D3JavaScript中显示.json映射
我做了一个教程，用world-50m.json文件在d3中显示地图。然而，我希望使用我自己的json文件。这是我的. json文件的结构。
“类型”：“FeatureCollection”，“features”：[{“type”：“Feature”，“properties”：{“FID”：0.000000}，“geometry”：{“type”：“MultiPolygon”，“坐标”：[[[[141.415967，-15.837696]…..，坐标继续。
然而，代码中的调用是针对旧世界-50m.json的，是的，我意识到，在代码引用world-50m.json的那一刻，我会将其更改为我的文件：
数据（topojson.feature（拓扑、拓扑、对象、国家）
我的问题是我的新. json文件使用什么调用。我尝试了堆的组合，但不断得到的错误topology.objects是未定义的。任何帮助都很感激。
代码如下：
<!DOCTYPE html>
<meta charset="utf-8">
<style>
path {
stroke: white;
stroke-width: 0.25px;
fill: grey;
}
</style>
<body>
<script type="text/javascript" src="d3/d3.v3.min.js"></script>
<script src="js/topojson/topojson.js"></script>
<script>
var width = 960,
height = 500;
var projection = d3.geo.equirectangular()
.center([-30, -17 ])
.scale(3000)
.rotate([-180,0]);
var svg = d3.select("body").append("svg")
.attr("width", width)
.attr("height", height);
var path = d3.geo.path()
.projection(projection);
var g = svg.append("g");
// load and display the World
d3.json("json/world-50m.json", function(error, topology) {
g.selectAll("path")
.data(topojson.feature(topology, topology.objects.countries)
.features)
.enter()
.append("path")
.attr("d", path)
d3.csv("data/CairnsPort2012.csv", function(error, data) {
g.selectAll("circle")
.data(data)
.enter()
.append("circle")
.attr("cx", function(d) {
return projection([d.LONG, d.LAT])[0];
})
.attr("cy", function(d) {
return projection([d.LONG, d.LAT])[1];
})
.attr("r", 0.1)
.style("fill", "red");
});
});
var zoom = d3.behavior.zoom()
.on("zoom",function() {
g.attr("transform","translate("+
d3.event.translate.join(",")+")scale("+d3.event.scale+")");
g.selectAll("path")
.attr("d", path.projection(projection));
});
svg.call(zoom)
</script>
</body>
</html>
共有1个答案
好的，首先我们需要整理调用的顺序以加载地图数据。
我们需要像这样把错误调用放在第二位。
d3.json("json/world-50m.json", function(topology, error) {
那么我认为你需要改变以下内容；
g.selectAll("path")
.data(topojson.feature(topology, topology.objects.countries)
.features)
...到...
g.selectAll("path")
.data(topology.features)
我说，这可能是基于我这里的工作地图，它有一个非常相似的json布局
{"type":"FeatureCollection",
"features":[
{
"type":"Feature",
"properties":{"name":"New Zealand","iso_a2":"NZ","iso_a3":"NZL","iso_n3":"554"},
"geometry":{"type":"MultiPolygon","coordinates":[ [ [ [ 167.44947350400005, -47.23943450299987 ], ....and the coordinates go on ] ] ] ]}}
]
}
... 和下面的代码。
var g = svg.append("g");
d3.json("json/nz-10m2.json", function (topology, error) {
g.selectAll("path")
.data(topology.features)
.enter()
.append("path")
.attr("d", path);
});
-
问题内容： 我正在尝试使用Chart JS 创建一个表，该表具有来自JSON文件的动态生成的数据点。我的代码的逻辑如下所示： 同时，我的JSON文件如下所示： 该变量包含ChartJS的配置设置，包括设置数据点。当加载到ChartJS中时，提供显示我的图表所需的信息。 无论如何，我的想法是使用变量作为使用for循环附加数据集的一种方式。不幸的是，该代码未产生任何结果。我知道我添加变量的方法有问题，
-
我正在尝试从URL获取搜索结果 https://ajax.googleapis.com/ajax/services/search/web?v=1.0 并使用< code>log.v()将其显示到LogCat中。 问题是，该程序不是在中显示搜索结果，而是不间断地运行，我在中看到的是无穷无尽的列表。 11-19 15:51:11.256： D/dalvikvm（1251）：GC_FOR_ALLOC释放
-
目前我有一个DAO在做这样的事情： 而映射器则执行如下操作：（简化为该问题所需的内容） 作为JsonB字段存储在Aurora中。我读过一些关于注释的文章，但由于jdbi文档不清楚，所以我不确定这是否正确。 我映射结果的方式是“标准”方式吗？还是有更好/更有效的方式？ 谢谢
-
问题内容： 我在Angular中显示JSON数据时遇到麻烦。我已成功将数据从后端发送到前端（角度），但无法显示它们。 我已经尝试在JSFiddle上模拟类似的情况，尽管我已经从后端准备了数据 获取/发送数据->后端： 获取数据->前端（角度） 带有ng-repeat指令的HTML部分： 谁知道是什么问题吗？ 问题答案： 据我所知，您将对象存储为JSON，但从未对其进行解析。因此使用 代替 应该解决
-
我的问题很简单，我已经请求了JSONYouTubev3数据API，但是，我想显示从链接请求的数据：https://www.googleapis.com/youtube/v3/channels?part=statistics