fallout new vegas interactive map

辐射：新维加斯 - 互动地图

https://srt4rulez.github.io/fallout-new-vegas-interactive-map

《辐射：新维加斯》中莫哈韦废土的互动地图。

特征

• 包含所有技能书和雪球。
• 将项目标记为已找到以跟踪您的进度。您的进度保存在您的浏览器中。
• 每种项目类型均采用颜色编码，以便轻松识别。
• 切换找到的项目的可见性。
• 切换单个项目类型的可见性。
• 每个项目都有一个指向 https://fallout.fandom.com/ 上的文章的相应链接，以获取更多信息。

其他互动地图

• 游戏地图侦察

它是如何运作的？

我们使用名为 Leaflet 的库来创建交互式地图，类似于 Google 地图。我们加载的是莫哈韦荒地的图像，而不是现实世界的地图。这使我们能够缩放、平移地图并与地图交互。它还允许我们添加“标记”，单击该“标记”时，会打开包含自定义内容的弹出窗口。

所有标记都存储在marker.json 中。每个标记都有 ID、类型、子类型（可选）、标题、描述、url（可选）、图像（可选）以及纬度和经度值。

将标记设置为“已找到”时，我们会更新浏览器中称为“本地存储”的内容。这是保存在浏览器中并且可以在刷新后保存的数据。它特定于域。这使我们能够保存您的进度，而无需将其存储在外部数据库中。不过，您的进度仅保存在当前的浏览器中。如果您在其他浏览器上访问该应用程序，您将看不到以前的数据。

调试纬度和经度

在浏览器中打开开发人员工具（通常是 F12），转到控制台选项卡，然后输入“window.debug = true”并按 Enter 键以启用调试模式。单击地图现在会将纬度和经度记录到控制台。

发展

要使用此存储库，请安装 Docker，然后在项目根目录中运行以下命令：

 ./run-docker-development.sh

这将启动一个 docker 容器，其中包含我们开发所需的一切。

只需使用yarn安装依赖项，然后使用create-react-app启动开发服务器：

 yarn install
yarn start

在计算机上的浏览器中转至 http://localhost:3000/ 以查看该站点。

查看 https://github.com/facebook/create-react-app 了解更多信息。