时间戳

首页 > 解决方案 > 在 reactJs 中显示谷歌地图作为背景

reactjs - 在 reactJs 中显示谷歌地图作为背景

问题描述

如何将谷歌地图显示为 jumbotron 背景？如果location = Branch 1显示来自谷歌地图的该位置的地图，1 Hacker Way in Menlo Park, CA 94025或者如果location = Branch 2 显示755 N Mathilda Ave, Sunnyvale, CA 94085.

我在 .json 文件中的这两个位置为：

1-  "location": "Branch 1"
2 - "location": "Branch 2"

分支 1 地址 1 Hacker Way in Menlo Park, CA 94025 和分支 2 地址 755 N Mathilda Ave, Sunnyvale, CA 94085

我这里也有代码来显示标题信息，我在详细信息页面中有这个代码

      <div class="jumbotron">
          <h1 class="display-4">{data.first_name}</h1>
          <p class="lead">{data.Department}</p>
          <hr class="my-4" />
          <p>{data.location}</p>
          <p class="lead">
            <a class="btn btn-primary btn-lg" href="#" role="button">
              Learn more
            </a>
          </p>
        </div>

Json 文件如下所示

{
  "data": {
    "Table": [
      {
        "id": "1001",
        "first_name": "Adibayo",
        "last_name": "Aba",
        "Department": "IT",
        "location": "Branch 1"
      },...
]
}
}

标签： reactjs

解决方案

推荐阅读