Html可以通過JS來實現(xiàn)第三方地圖的顯示，如: 高德；

效果如下：瀏覽器小區(qū)域和全屏展示

效果

效果

代碼如下：把key換成自己申請的key值

<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=667cbbf11eee369b935122434f031a4d"></script>


<div id="container" style="width:500px; height:500px"></div>

高德配置（開發(fā)者平臺-->控制臺）

效果

效果

<script >

    var map = new AMap.Map('container',{
        zoom: 10,
        icon: "punch_dw.png",
        center: [113.466123,22.32666]
    });
    var marker;
    addMarker();
    //在地圖上添加圖片標記函數(shù)
    function addMarker(){
        marker=new AMap.Marker({
            icon:new AMap.Icon({    //復雜圖標
                size:new AMap.Size(125,125),//圖標大小
                image:"punch_dw.png", //大圖地址
                imageOffset:new AMap.Pixel(0,0)//相對于大圖的取圖位置
            }),
            position:new AMap.LngLat(113.466123,22.32666)
        });
        marker.setMap(map);  //在地圖上添加點

    }

</script>