高德地图学习---在高德地图图层上使用google的卫星图

最新推荐文章于 2025-06-17 14:05:30 发布

转载最新推荐文章于 2025-06-17 14:05:30 发布 · 4.3k 阅读

高德地图学习专栏收录该内容

1 篇文章

订阅专栏

本文介绍如何利用高德地图API叠加Google卫星图层以弥补高德地图在偏远地区显示不全的问题。通过示例代码展示了如何在保持地图清晰度的同时，解决权限限制导致的显示缺失。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

公司要做一个项目要用到卫星图，但是高德地图提供的卫星图有很多地方由于权限问题还有等等一系列问题是显示不全的，拉到比较偏远的地方就显示不了了，而且清晰度也不够，研究了一下并且在网上查看了好多文章之后发现Google地图的卫星图比高德的好用很多，而且由于是墙外的所以没有那么多显示不全的问题，但是操作上没有那么方便，毕竟是墙外，于是我用了高德地图的API，去叠加Google地图的卫星图层

这个需求用高德地图 API 很好实现，高德也有相关示例，只需叠加谷歌的卫星图层再叠加高德地图的路网图层便可

    
<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
    <title></title>
    <link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css"/>
    <script src="http://webapi.amap.com/maps?v=1.4.6&key=您申请的key值"></script>
    <script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script>
</head>
<body>
<div id="container"></div>
<script>
     var googleMapLayer = new AMap.TileLayer({ //图层
        getTileUrl: 'http://mt{1,2,3,0}.google.cn/vt/lyrs=s&hl=zh-CN&gl=cn&x=[x]&y=[y]&z=[z]&s=Galile'
      });

     var map = new AMap.Map('container', {
        resizeEnable: true,
        center: [116.397428, 39.90923],
        zoom: 13,
        layers: [googleMapLayer]
    });