zoukankan      html  css  js  c++  java
  • Google Map API V3调用arcgis发布的瓦片地图服务

    由于最近项目需要用到CAD制作的地图,但之前一直使用的是用谷歌离线瓦片地图的方式,怎么样把CAD图像地图一样有缩放,移动的功能放到网页显示成了难题,

    原先的谷歌地图的代码难道就不能用了?重新写一套代码得多久呢,得花多少时间精力呢?

    于是开始尝试了N种方法,最后找的可能算是最好的方法可以沿用现有的代码,方法是:首先要用ARCGIS软件,把CAD图转化为mxd文件(当然其中各种困难就不提了,而且转换后的效果不一定能和CAD完全一样),

    最后请教的是学地理信息系统专业的朋友才搞定的。其次把mxd发布成GIS服务,需要生成瓦片文件,如果发布成功访问http://localhost/ArcGIS/rest/services/服务名称/MapServer 会显示相应地图信息,

    最后用下面谷歌地图脚本文件调用相应url

    复制代码
       
            //设置中心位置
            var myCenter = new google.maps.LatLng(34.573380321227, 115.42915725708); 
            function CoordMapType() {
            }
            CoordMapType.prototype.tileSize = new google.maps.Size(256, 256);
            CoordMapType.prototype.maxZoom = 15;
            CoordMapType.prototype.minZoom = 11;
    
        CoordMapType.prototype.getTile </span>= <span style="color: #0000ff;">function</span><span style="color: #000000;"> (coord, zoom, ownerDocument) {
            </span><span style="color: #0000ff;">var</span> img = ownerDocument.createElement("img"<span style="color: #000000;">);
            img.style.width </span>= <span style="color: #0000ff;">this</span>.tileSize.width + "px"<span style="color: #000000;">;
            img.style.height </span>= <span style="color: #0000ff;">this</span>.tileSize.height + "px"<span style="color: #000000;">;
            </span><span style="color: #0000ff;">var</span> strURL = "http://localhost/ArcGIS/rest/services/服务名称/MapServer/tile/" + zoom + "/" + coord.y + "/" +<span style="color: #000000;"> coord.x;
            img.src </span>=<span style="color: #000000;"> strURL;
            </span><span style="color: #0000ff;">return</span><span style="color: #000000;"> img;
        };
    
    
        CoordMapType.prototype.name </span>= "Tile #s"<span style="color: #000000;">;
        CoordMapType.prototype.alt </span>= "Tile Coordinate Map Type"<span style="color: #000000;">;
    
        </span><span style="color: #0000ff;">function</span><span style="color: #000000;"> GetCoordinateMapType() {
            </span><span style="color: #0000ff;">return</span> <span style="color: #0000ff;">new</span><span style="color: #000000;"> CoordMapType();
        }
    
        </span><span style="color: #008000;">//</span><span style="color: #008000;">初始化地图</span>
        <span style="color: #0000ff;">function</span><span style="color: #000000;"> initialize() {
            </span><span style="color: #0000ff;">var</span> mapOptions =<span style="color: #000000;"> {
                zoom: </span>11<span style="color: #000000;">,
                center: myCenter,
                mapTypeId: </span>"coordinate"<span style="color: #000000;">
            };
            Variable.map </span>= <span style="color: #0000ff;">new</span> google.maps.Map(document.getElementById("map_canvas"<span style="color: #000000;">), mapOptions);
            Variable.map.mapTypes.set(</span>'coordinate'<span style="color: #000000;">, GetCoordinateMapType());
        }<br><br>      //html代码<br> <br></span>       &lt;div id="map_canvas"&gt;&lt;/div&gt;</pre>
    
     
    复制代码
  • 相关阅读:
    URL地址中中文乱码详解(javascript中encodeURI和decodeURI方法、java.net.URLDecoder.encode、java.net.URLDecoder.decode)
    Java transient关键字使用小记
    java 序列化Serializable 详解
    JRE和JDK的区别
    JavaEE汇总
    Oracle汇总
    java提高篇(四)-----理解java的三大特性之多态
    SQL根据出生日期精确计算年龄、获取日期中的年份、月份
    PL/SQL学习笔记(四)之——删除重复记录
    PL/SQL学习笔记(二)
  • 原文地址:https://www.cnblogs.com/jpfss/p/7488556.html
Copyright © 2011-2022 走看看