如何使用 geoPath 居中和缩放
我正在使用 D3 和 topojson 过滤掉一部分美国县。我可以成功过滤出县并将它们绘制到 SVG 元素,但是如何更改地图边界以适应新选择的县?它将地图渲染为边界是所有美国县,而不是仅过滤的县。 var width=960, height=600, centered; const svgElement = d3.select(ref.curren... »
我正在使用 D3 和 topojson 过滤掉一部分美国县。我可以成功过滤出县并将它们绘制到 SVG 元素,但是如何更改地图边界以适应新选择的县?它将地图渲染为边界是所有美国县,而不是仅过滤的县。 var width=960, height=600, centered; const svgElement = d3.select(ref.curren... »
我正在基于this example 使用 Cartogram.js 为 D3 构建一个连续的入境难民人数图表。 当我只使用难民号码时,地图不会移动。 Base refugee number 但是当我在线向“r”添加任意数字时,它可以工作。并且任意数字越高,变化越剧烈。 Example 1 Example 2 这是为什么?是因为我的一些值是0,还是因为方差太大?... »
我正在尝试使用 topojson 做很多事情……将 2 个 geojson 文件与 1 个 tsv 合并,加入 ELECT_DIV n NAME,将其提升为 id,并从 tsv 中保留 2012_POP。 这是我正在使用的命令: topojson -o electorates.json -e 2012_oz_population.tsv --id-property ELECT_DIV,NAME... »
我正在寻找在后台访问对象属性的提示。 确实,通过鼠标悬停,我想揭示层 ze.json(地理单位)的属性。 但是,我的比例圆圈隐藏了这一层。 我并不真正了解所设想的程序,因为: 圆圈比例必须在顶部 不透明并不能解决问题 也许我应该报告关于比例圈的信息。但是我怎么能转移这些信息呢? (不仅是人口,还有ZE名称) 比例圆 let rMax = d3.max(featureCollecti... »
我有一张包含德国和叙利亚各州及其城市的世界地图。如您所见,现在它们完全随机加载。 部分加载德国城市是因为缺少标签 叙利亚城市根本没有装载。当我重新加载它时,它会随机成为我发布的图片之一。 例如,这是我调用德国的函数。 d3.json("germany.topo.json", function(error, ger){ if (error) throw error; ... »
我正在尝试创建一个自定义世界地图,其中国家被合并到区域中,而不是单独的国家。不幸的是,由于某种原因,整个过程中的缠绕顺序似乎有些混乱。 作为基础数据,我使用的是自然地球10m_admin_0_countries 可用的形状文件here。作为合并国家/地区的标准,我有一个如下所示的查找地图: const countryGroups = { "EUR": ["ALA", "AUT", "BEL".... »
我想将topojson 对象读入Java 类。 Topojson 是 JSON 的一个特殊类,在查找表中对象有弧的地方定义如下: { "type":"Topology", "objects":{ "collection":{ "type":"GeometryCollection", "geometries":[ {"type":"LineS... »
编辑 我升级了节点并运行了“npm install -g contextify”它看起来安装得很好(没有错误),但是输入“which contextify”什么也没返回。安装 contextify 时的消息: npm http GET https://registry.npmjs.org/contextify npm http 304 https://registry.npmjs.org/co... »
我正在尝试创建美国学区的 TopoJSON 文件。我的工作流程如下: 从人口普查局下载并解压缩单个 TIGER 形状文件(24 个 ESD,19 个 SSD,56 美元) 用ogr2ogr批量合并这99个文件 将合并的 shapefile 转换为 GeoJSON 将 GeoJSON 转换为 TopoJSON(理想情况下,我也会在此处将状态边界添加到文件中) 第 4 步是什么导致我出现问题... »
如何将ts-topojson 导入 Angular2 项目,以便获得 Typescript 类型?我使用 npm 安装了模块并尝试包含一个简单的导入语句,但 linter 说它找不到“topojson”。 import { Topojson } from 'topojson'; 这是我的第一个 Angular2 项目,所以我对此很陌生,所以我可能会错过一个关键步骤。... »
我指出我在没有错误的情况下读取了 topojson 文件,但问题是它只显示一个具有一个路径的属性,我的 topojson 文件看起来像下面的示例。 我做错了什么? createMap("QasabatAmmanTempWithoutMadina.json"); function createMap(topojsonFile) { d3.json(topojsonFile, functi... »
我正在寻找一种方法来在我的数据分析中插入不列颠哥伦比亚省的地理图,该地理图是加拿大的一部分。 我在这里制作了这张图片,解释了温哥华种植最多的树 现在我想做一个类似这样的地理https://altair-viz.github.io/gallery/airports_count.html 回答:不同社区种植的物种的密度/分布情况如何。 这就是我遇到的麻烦。 因此 from vega_datasets ... »
我有一张用 d3js v4 和 topojson 制作的世界地图,它有缩放/拖动/圆圈。一切似乎都很好,只是我无法通过缩放来缩放圆圈。 当我滚动到地图时,我的圈子保持不变,这使得它们与地图相比要大得多。 如何在缩放时将变换应用到圆圈? var width = 660, height = 400; var zoom = d3.zoom() .scal... »
我对 d3js 还是很陌生,并试图了解使用数据和基准将数据附加到元素之间的区别。我已经在网上阅读了相当多的材料,我想我理论上理解发生了什么,但我仍然缺乏直观的理解。具体来说,我有一个使用 topojson 创建地图的案例。我正在使用 d3js v7。 首先,我有以下代码在 div 中创建地图(假设高度、宽度、投影等设置正确): var svg = d3.select("div#map").appe... »
我正在尝试通过使用 TopoJSON 的 Leaflet-Geoman 插件来获得线条的拓扑移动。有一个 method 叫 topojson.mesh ,它 返回 GeoJSON MultiLineString 几何对象,表示给定拓扑中指定对象的网格。这对于有效地在复杂对象中渲染笔触很有用,因为由多个特征共享的边缘只被描边一次。如果未指定object,则返回整个拓扑的网格。 感谢在this 帖... »
大家好,这里有一个有趣的 D3、topojson 和 React 钩子。 我很想删除在鼠标悬停时创建并在鼠标悬停时持续存在的工具提示实例——使用 D3 的“React hooks”方式是使用useEffect(),svg 使用@987654326 呈现@,这很好用,但是每个连续的鼠标悬停事件都会触发一个新的 .append,它会添加另一个 div,因此工具提示内容只会不断堆积。 我认为使用 D3 ... »
在我的项目中,我尝试使用 d3 和 GeoJSON 显示印度地图。它不能正常工作,我发现很难显示每个印度州。请帮我找出来,提前谢谢..., 我在代码下方添加了数据和输出的链接。 这是我的源代码,我正在使用来自 https://www.covid19india.org/mini_maps/india.json 的数据,我想使用 D3.js 渲染(印度各州) <html> &l... »
我正在使用 d3 构建地图,但由于某种原因,悬停无法正常工作。很多时候,我将鼠标悬停在一个功能上,它不会通过改变颜色做出反应,只有在反复这样做之后。有些功能根本没有反应。 var svg = d3.select('#map'); var width = 960, height = 500; var gemeinden = { "type": "FeatureCollectio... »
我正在使用 d3 渲染带有可点击国家/地区的世界地图。这些国家/地区来自 geojson 文件,使用此站点加载特定大陆、地区或整个世界都没有问题: https://geojson-maps.ash.ms/ 但是,来自该站点的数据在其 geojson 文件中没有任何大写字母。因此,我查看了https://www.naturalearthdata.com/,它清楚地表明应该能够渲染一个带有城市的区域。... »
我正在尝试从位于 here 的 topojson 文件中绘制 svg 地图。当我运行下面的代码时,我看到一个小的红色集合g 元素就是那个地图,但我不知道如何使它更大。我试过 projection.scale(100) 但这不起作用。 Here 是个小提琴。 <svg width=500 height=500></svg> async function run() { ... »