Question

我正在使用d3绘制地图以从数据地图topojson渲染路径，我在路径中检查了保存数据lat＆amp;长。现在，我想使用lat＆amp; amp;找到路径的“路径”元素或数据。长。有可能吗？

我的代码来呈现数据

svgBig.append("g")
  .attr("class", "poly")
.selectAll("path")
  .data(topojson.feature(json, json.objects.depthmap).features)
.enter().append("path")
  .attr("d", path)
  .on("click", function(d,i){
    beforeApplyingData(d);
  })
  .moveToBack()
  .style("stroke", function(d) { return drawcolorpath(d.id); })
  .style("fill", function(d) { return drawcolorpath(d.id); })
  ;

即时绘制地图的深度。数据仅包含密钥为“id”的深度值。数据仅包括lat＆amp; long和id（深度）并用id填充颜色。

现在我很难找到几乎从“lat”获得d.id（深度）的“路径”。长。有可能吗？

感谢

我上传问题http://jsfiddle.net/1fqsv4oh/1/当我点击地图的路径时，我得到了d.id/depth。问题是，当我点击船，我得到了lat＆amp; lng，然后我怎么能从lat＆amp; lng获得d.id/depth？或船下的海底深度？

Answer 1

您可以通过使船舶对点击事件透明来获得基础深度。将其添加到您的CSS或作为您船上的样式：

svg#svgBig image {
    pointer-events:none;
}

船舶不会注册您的点击事件，它将传递到下面的路径，该路径会按您的要求返回深度。

指针事件在Chrome和Safari中运行正常，但如果对您有用，则应检查与IE的兼容性。

我还展示了如何使用D3的阈值比例简化颜色功能。这些对于你正在做的事情非常有用：13种颜色，12个不均匀间隔的阈值。看看你的小提琴中的评论，看看它是如何完成的：http://jsfiddle.net/1fqsv4oh/2/

var quantizeCustom3 = d3.scale.threshold()
    .domain([-40,-35,-30,-25,-20,-15,-10,-5,0,25,50,75,100])
    .range(color);

D3从lat＆amp; amp;找到路径长

1 个答案: