zoukankan      html  css  js  c++  java
  • QQ地图调用卫星图API(非官方)

    QQ地图已经添加了卫星图资源。但并未提供卫星图API
    我们完全可以自己写。

    来个图片看看

    QQ截图20120328122129.png


    废话不多说  直接代码

    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>SOSOMap</title>
    <style type="text/css">
    *{
        margin:0px;
        padding:0px;
    }
    body, button, input, select, textarea {
        font: 12px/16px Verdana, Helvetica, Arial, sans-serif;
    }
    button{
        280px;
    }
    </style>
    <script charset="utf-8" src="http://api.map.soso.com/v1.0/main.js"></script>
    <script>
    var map,layer;
    function init() {
        map = new soso.maps.Map(document.getElementById("container"), {
            // 地图的中心地理坐标。
            center: new soso.maps.LatLng(39.916527,116.397128),
            zoomLevel:4
        });
    
        //添加地图导航平移控件
        var navControl = new soso.maps.NavigationControl({
            align: soso.maps.ALIGN.TOP_LEFT,
            margin: new soso.maps.Size(5, 15),
            map: map
        });
       map.layers.removeAt(0);
        var trafficLayer = function(options) {};
        //继承TileLayer类
        trafficLayer.prototype = new soso.maps.TileLayer();
        //自定义图块地址
        trafficLayer.prototype.getTileUrl = function(tile, zoom) {
            //图块坐标x,y
            var tileX = tile.getX();
                    
            var tileY = tile.getY();
            //图块所在级别
            var tileZ = zoom;
                    var _subDomains =new Array("p0", "p1", "p2", "p3");
           var subdomain = _subDomains[(tileX + tileZ + tileY) % _subDomains.length];
    
            var  scope =new Array(0, 0, 0, 0, 0, 3, 0, 3, 0, 3, 0, 3, 0, 7, 0, 7, 0, 15, 0, 15, 0, 31, 0, 31, 0, 63, 4, 59, 0, 127, 12, 115, 0, 225, 28, 227, 356, 455, 150, 259, 720, 899, 320, 469, 1440, 1799, 650, 929, 2880, 3589, 1200, 2069, 5760, 7179, 2550, 3709, 11520, 14349, 5100, 7999, 23060, 28689, 10710, 15429, 46120, 57369, 20290, 29849, 89990, 124729, 41430, 60689, 184228, 229827, 84169, 128886);
            var  f=tileZ*4;
                    var i = scope[f++];
             var j = scope[f++];
             var l = scope[f++];
             var scope = scope[f];
             if (tileX >= i && tileX <= j && tileY >= l && tileY <= scope) {
                        tileY = Math.pow(2, tileZ) - 1 - tileY;
                        var tileNo =  tileZ + "/" + Math.floor(tileX / 16) + "/" +  Math.floor(tileY / 16)+ "/" + tileX + "_" + tileY + ".jpg";
              }
    
            var Surl="http://"+subdomain+".map.soso.com/sateTiles/";
    
            return Surl+ tileNo;
        };
        //叠加到地图上
        layer = new trafficLayer();
        layer.setMap(map);
    }
    
    
    </script>
    </head>
    <body onload="init()">
    <div style="603px;height:300px" id="container"></div>
    <p id="info" style="margin-top:10px;"></p>
    
    </body>
    </html>
    

    对于路网标注,自己在加一个图层就行了。。

    路网图层瓦片地址为
    http://p1.map.soso.com/sateTranTiles/
    瓦片扩展名为.png

    更多信息请到GISVIP社区交流

    http://bbs.gisvip.com

  • 相关阅读:
    案例53-crm练习修改客户功能实现
    测开之路一百二十五:flask之urlencode参数传递和解析
    测开之路一百二十四:flask之MVC响应过程
    测开之路一百二十三:快速搭建python虚拟环境
    测开之路一百二十二:高级组件之警告框
    测开之路一百二十一:常用组件之助手类
    测开之路一百一二十:常用组件之进度条
    测开之路一百一十九:常用组件之标签和徽章
    测开之路一百一十八:常用组件之面包屑导航和分页导航
    测开之路一百一十七:常用组件之导航栏
  • 原文地址:https://www.cnblogs.com/gisvip/p/2433632.html
Copyright © 2011-2022 走看看