前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >超酷!一键绘制你爱的城市的地图

超酷!一键绘制你爱的城市的地图

作者头像
永恒君
发布2022-12-06 16:11:44
9400
发布2022-12-06 16:11:44
举报
文章被收录于专栏:开源小分队开源小分队

大家好呀,我是机灵可爱的开源小妹。

前段时间在网上帮朋友挑选礼物的时候,看到了这样的一个礼物:将两个城市的地图拼在一起形成一副地图画。

当时感觉这种简约风格的地图还挺酷的,很有艺术感。结果这几天正好发现了一个开源项目,可以直接生成类似的图片,比如北京:

上海:

怎么样,是不是还蛮酷的,都可以当壁纸用啦!

这个开源项目就是:city-roads。下面由我简单的为大家介绍一下吧~

简介

city-roads 是一个 Node.js 项目,它可以生成任意一个城市的道路图。其数据来源于 OpenStreetMap 的免费地图数据,并对数据进行可视化。

本地启动

city-roads 的本地启动方式非常简单,当然前提是你本地安装了 node.js。

在下载完源码之后,进入到项目的根目录。执行以下命令安装依赖的包:

代码语言:javascript
复制
npm install

该命令可以自动安装 package.json 文件中配置的项目依赖的包。

之后执行以下命令启动服务:

代码语言:javascript
复制
npm run dev

如果中途有类似的报错:

不用担心,这可能是因为本地安装的 node.js 是 v17.0.0 以上的版本,我们先执行这个命令:

代码语言:javascript
复制
export NODE_OPTIONS=--openssl-legacy-provider

之后再执行npm run dev命令就可以啦。

生成地图

服务启动后,访问 localhost:8080 进入主页面。

在搜索框中搜索你想生成地图的城市,选择后,等待下载数据后,就可以自动渲染生成地图了。

下载地图数据的过程可能会比较慢,耐心等待一会就好啦~

地图生成之后,我们可以随意更改道路线条的颜色和背景颜色。

或者点击 As an image 链接下载当前缩放大小的图片。

本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2021-12-30,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 开源小分队 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 简介
  • 本地启动
  • 生成地图
相关产品与服务
图数据库 KonisGraph
图数据库 KonisGraph(TencentDB for KonisGraph)是一种云端图数据库服务,基于腾讯在海量图数据上的实践经验,提供一站式海量图数据存储、管理、实时查询、计算、可视化分析能力;KonisGraph 支持属性图模型和 TinkerPop Gremlin 查询语言,能够帮助用户快速完成对图数据的建模、查询和可视化分析。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档