网站介绍

这是一个使用高德地图(AMap)的网站。高德地图是阿里巴巴集团旗下的一款专业的在线地图服务产品，为全球用户提供地理信息服务。该网站主要功能包括地图浏览、路线规划、公交查询、周边搜索等。

特点

  • 使用了自定义的样式类 .amap-custom,设置了 top 和 left 为 0,使其在页面中居中显示，并且位置绝对定位。
  • 对 .amap-container 中的图片进行了样式修饰，通过设置 max-width 和 max-height 为 none!important 来避免图片超出容器大小。
  • 将背景图片设置为一个经过 Base64 编码的数据URI,其中包含了一张高德地图的图片。

使用方法

  1. 在 HTML 文件中引入 AMap JavaScript API:
<script src="https://webapi.amap.com/maps?v=1.4.15&key=YOUR_API_KEY"></script>

确保将 YOUR_API_KEY 替换为你自己的高德地图 API 密钥。

  1. 在 HTML 文件中添加地图容器元素：
<div id="mapContainer" class="amap-container"></div>
  1. 在 JavaScript 代码中创建地图实例并将其绑定到容器上：
var map = new AMap.Map('mapContainer', {
zoom: 13, // 初始缩放级别
center: [经度， 纬度] // 初始中心点坐标
});

确保将 [经度， 纬度] 替换为实际的地图中心点坐标。

以上代码示例仅为演示目的，具体实现方式可能因网站需求而有所不同。你可以根据自己的实际情况进行调整和修改。