wufeihuang / Map-of-Hangzhou

一个地图项目。基于D3.js，由简单到复杂，一步一步丰富其功能。目前使用的是杭州地图。

基于D3.js的地图项目

这是一个使用 D3.js(v5) 来实现的一个杭州地图项目，我会尝试一步一步由简单到复杂搭建一个功能完善的地图项目，并且会写博客文章记录。博客地址：https://wufeihuang.github.io

起始日期： 2019/04/06

地点：杭州

数据来源

使用的是来自DataV的杭州地理数据。

目前计划（待补充）

• 1. 初始轮廓地图 blog
• 2. 使用TopoJSON优化轮廓，添加悬浮突出和城区名提示 blog
• 3. 在城区地理中心标记城区名称
• 4. Zoom & Drag （缩放、平移）
• 5. ...

预期效果

• 全国地图（更大？）
• 具备缩放、平移等交互能力
• 可进行向下层级筛选和向上回退
• 有省/市/城区等地名标识（根据当前地图层级显示）
• 可结合人口或其他的数据实现区域面积热点图
• 结合高德地图或其他地图工具的API，使得输入地址能在地图上显示对应的点，并且可以选择保存地址记录，退出页面重新回来依旧能看到记录的地点。这一条的意义有一个常见的场景例子：可以实现像旅游地图一样在想去的地点做标记，或者在到过的地点做标记。（也可以直接提供数据进行批量地点标记）
• 响应式，手机端可用
• 尝试PWA