Flex 下兼容谷歌，百度地图服务

最新推荐文章于 2024-11-08 11:34:46 发布
最新推荐文章于 2024-11-08 11:34:46 发布
阅读量1.1k 收藏
点赞数
分类专栏： Flex arcgis 文章标签： arcgis ArcGIS Arcgis baidu flex Flex FLEX google Google
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/LaoDai007007/article/details/8267793
版权

最近一段时间一直在研究FlexViewer框架，使用各种地图服务作为地图显示上边叠加自己的一些要素，网上找了N久终于完成了底图的叠加,主要就是重写TiledMapServiceLayer的getTileURL，buildTileInfo方法.不多说直接贴代码！

百度跟谷歌的wkid不一致，这一点很悲剧。

谷歌：

package
{
 import com.esri.ags.SpatialReference;
 import com.esri.ags.geometry.Extent;
 import com.esri.ags.geometry.MapPoint;
 import com.esri.ags.layers.TiledMapServiceLayer;
 import com.esri.ags.layers.supportClasses.LOD;
 import com.esri.ags.layers.supportClasses.TileInfo;
 import flash.net.URLRequest; 
 
 //扩展TiledMapServiceLayer图层实现加载google地图 
 public class GoogleMapLayer extends TiledMapServiceLayer 
 { 
  private var _tileInfo:TileInfo = new TileInfo(); 
  private var _baseURL:String=""; 
  private var _initialExtent:Extent;
  private var _wkid:int = 102113;
  
  public var mapType:String="map";
  
  public function GoogleMapLayer(initialExtent:Extent=null) 
  { 
   super(); 
   
   _initialExtent = initialExtent;
   
   buildTileInfo(); 
   setLoaded(true); 
  } 
  
  override public function get fullExtent():Extent 
  { 
   return new Extent(-20037508.342787, -20037508.342787, 20037508.342787, 20037508.342787, new SpatialReference(_wkid));   
  } 
  
  override public function get initialExtent():Extent 
  { 
   if(_initialExtent)
    return _initialExtent;
   
   return fullExtent;
  }  
  
  override public function get spatialReference():SpatialReference 
  { 
   return new SpatialReference(_wkid); 
  } 
  
  override public function get tileInfo():TileInfo 
  { 
   return _tileInfo; 
  } 
  
  
  override protected function getTileURL(level:Number, row:Number, col:Number):URLRequest 
  { 
   var s:String = "Galileo".substring(0, ((3 * x + y) % 8));
   var url:String;
   //获取矢量地图
   if(mapType == "map")
   {
    url = "http://mt"+(col%4)+".google.cn/vt/lyrs=m@158000000&hl=zh-CN&gl=cn&" +
     "x=" + col + "&" +
     "y=" + row + "&" +
     "z=" + level+ "&" +
     "s=" + s;
   }
   else if(mapType == "image")//获取影像地图
   {
    url = "http://mt"+(col%4)+".google.cn/vt/lyrs=s@121&hl=zh-CN&gl=CN&src=api&" +
     "x=" + col + "&" +
     "y=" + row + "&" +
     "z=" + level+ "&" +
     "s=" + s;
   }
   else if(mapType == "poi")//获取道路POI
   {
    url = "http://mt"+(col%4)+".google.cn/vt/imgtp=png32&lyrs=h@169000000&hl=zh-CN&gl=cn&" +
     "x=" + col + "&" +
     "y=" + row + "&" +
     "z=" + level+ "&" +
     "s=" + s;
   }
   else if(mapType == "topography"){//地形
    url = "http://mt"+(col%4)+".google.cn/vt/lyrs=t@129,r@183000000&hl=zh-CN&gl=cn&src=app&" +
     "x=" + col + "&" +
     "y=" + row + "&" +
     "z=" + level+ "&" +
     "s=" + s;
   }else if(mapType == "real"){//植被map
    url = "http://mt"+(col%4)+".googleapis.com/vt/lyrs=m@196000000&hl=zh-CN&src=api&" +
     "x=" + col + "&" +
     "y=" + row + "&" +
     "z=" + level+ "&" +
     "s=" + s;
   }
   
   return new URLRequest(url); 
  } 
  
  private function buildTileInfo():void
  { 
   _tileInfo.height=256; 
   _tileInfo.width=256;  
   _tileInfo.origin=new MapPoint(-20037508.342787, 20037508.342787); 
   _tileInfo.spatialReference=new SpatialReference(_wkid); 
   _tileInfo.lods = [ 
    new LOD(0, 156543.033928, 591657527.591555),  
    new LOD(1, 78271.5169639999, 295828763.795777),  
    new LOD(2, 39135.7584820001, 147914381.897889),  
    new LOD(3, 19567.8792409999, 73957190.948944),  
    new LOD(4, 9783.93962049996, 36978595.474472),  
    new LOD(5, 4891.96981024998, 18489297.737236),  
    new LOD(6, 2445.98490512499, 9244648.868618),  
    new LOD(7, 1222.99245256249, 4622324.434309),  
    new LOD(8, 611.49622628138, 2311162.217155),  
    new LOD(9, 305.748113140558, 1155581.108577),  
    new LOD(10, 152.874056570411, 577790.554289),  
    new LOD(11, 76.4370282850732, 288895.277144),  
    new LOD(12, 38.2185141425366, 144447.638572),  
    new LOD(13, 19.1092570712683, 72223.819286),  
    new LOD(14, 9.55462853563415, 36111.909643),  
    new LOD(15, 4.77731426794937, 18055.954822),  
    new LOD(16, 2.38865713397468, 9027.977411),  
    new LOD(17, 1.19432856685505, 4513.988705),  
    new LOD(18, 0.597164283559817, 2256.994353), 
    new LOD(19, 0.298582141647617, 1128.497176) 
   ]; 
  } 
 } 
}

 

百度：

package
{
 import com.esri.ags.SpatialReference;
 import com.esri.ags.geometry.Extent;
 import com.esri.ags.geometry.MapPoint;
 import com.esri.ags.layers.TiledMapServiceLayer;
 import com.esri.ags.layers.supportClasses.LOD;
 import com.esri.ags.layers.supportClasses.TileInfo;
 
 import flash.net.URLRequest;
 
 import flashx.textLayout.formats.Float;
 
 public class BaiduTiledMapServiceLayer extends TiledMapServiceLayer
 { 
  
  private var _tileInfo:TileInfo = new TileInfo();  
  private var _wkid:int = 102100;//102100;
  private var cornerCoordinate:Number = 20037508.3427892;
  public var mapType:String = "map";
  private var _initialExtent:Extent;

  public function BaiduTiledMapServiceLayer()
  {
   super();
   buildTileInfo(); // to create our hardcoded tileInfo
   setLoaded(true); // Map will only use loaded layers
  }
  
  //----------------------------------
  //  全屏范围
  //----------------------------------
  override public function get fullExtent():Extent
  {
   return new Extent(-cornerCoordinate, -cornerCoordinate, cornerCoordinate, cornerCoordinate, new SpatialReference(_wkid));
  }
  //----------------------------------
  //  初始化范围
  //----------------------------------
  override public function get initialExtent():Extent
  {
   if (_initialExtent)
    return _initialExtent;
   
   return fullExtent;
  }
  //----------------------------------
  //  空间参考系
  //----------------------------------
  override public function get spatialReference():SpatialReference
  {
   return new SpatialReference(_wkid);
  }
  //----------------------------------
  //  tileInfo
  //----------------------------------
  override public function get tileInfo():TileInfo
  {
   return _tileInfo;
  }
  //--------------------------------------------------------------------------
  override protected function getTileURL(level:Number, row:Number, col:Number):URLRequest
  {
   var zoom:int = level - 1;
   var offsetX:int = Math.pow(2, zoom) as int;
   var offsetY:int = offsetX - 1;
   var numX:int = col - offsetX;
   var numY:int = (-row) + offsetY;
   
   zoom = level + 1;
   var num:int = (col + row) % 8 + 1;
   
   var url:String = null;
   if (mapType == "map")
   { 
    url = "http://q"+num+".baidu.com/it/u=x="+numX+";y="+ numY + ";z=" + zoom + ";v=013;type=web&fm=44";
   }
   else if (mapType == "image")
   { 
    url = "http://q"+num+".baidu.com/it/u=x="+numX+";y="+numY+";z="+zoom+";v=009;type=sate&fm=46";
   }
   else if (mapType == "poi")
   { 
    url = "http://q"+num+".baidu.com/it/u=x="+numX+";y="+numY+";z="+zoom+";v=013;type=trans&fm=47";
   }
   return new URLRequest(url);
  }
  //--------------------------------------------------------------------------
  //
  //  自定义方法，定义地图缩放等级
  //
  //--------------------------------------------------------------------------
  private function buildTileInfo():void
  {
   _tileInfo.height=256;
   _tileInfo.width=256;
   _tileInfo.origin=new MapPoint(-cornerCoordinate, cornerCoordinate);
   _tileInfo.spatialReference=new SpatialReference(_wkid);
   _tileInfo.lods = [
    new LOD(0, 156543.033928, 591657527.591555),
    new LOD(1, 78271.5169639999, 295828763.795777),
    new LOD(2, 39135.7584820001, 147914381.897889),
    new LOD(3, 19567.8792409999, 73957190.948944),
    new LOD(4, 9783.93962049996, 36978595.474472),
    new LOD(5, 4891.96981024998, 18489297.737236),
    new LOD(6, 2445.98490512499, 9244648.868618),
    new LOD(7, 1222.99245256249, 4622324.434309),
    new LOD(8, 611.49622628138, 2311162.217155),
    new LOD(9, 305.748113140558, 1155581.108577),
    new LOD(10, 152.874056570411, 577790.554289),
    new LOD(11, 76.4370282850732, 288895.277144),
    new LOD(12, 38.2185141425366, 144447.638572),
    new LOD(13, 19.1092570712683, 72223.819286),
    new LOD(14, 9.55462853563415, 36111.909643),
    new LOD(15, 4.77731426794937, 18055.954822),
    new LOD(16, 2.38865713397468, 9027.977411),
    new LOD(17, 1.19432856685505, 4513.988705),
    new LOD(18, 0.597164283559817, 2256.994353),
    new LOD(19, 0.298582141647617, 1128.497176)
   ];
  }
 }
}

 

 

PS：相关技术只作为爱好，如想作为商业用途，请与相关公司联系！！！

 

LaoDai007007
关注
专栏目录
flex布局(弹性盒)兼容性写法 兼容ie10 谷歌 火狐
希文Gershwin
08-19 8549
1.容器写法 display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */ display: -moz-box; /* Firefox 17- */ display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */ di...
【web】flex布局浏览器兼容处理
热门推荐
dd的博客
03-24 2万+
一.W3C各个版本的flex 2009 version 标志：display: box; or a property that is box-{*} (eg. box-pack) 2011 version 标志：display: flexbox; or the flex() function or flex-pack property 2012 version 标志：dis
flex布局兼容性写法
fanlc8888的博客
10-23 887
  1.容器写法 display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */ display: -moz-box; /* Firefox 17- */ display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */ d...
【css兼容】flex在低版本 chrome 浏览器的兼容问题
weixin_43841308的博客
12-16 4702
flex布局 在低版本chrome浏览器默认脱离文档流，父元素变更为浏览器，height：100%与预想效果不一致。
css3 flex属性 兼容性问题
huch的博客
05-23 5085
css3 flex在移动端的兼容性适配问题 如iphone手机 ios 8系统 最近在负责前端React项目开发，因为之前写RN的时候都是熟练使用Flex弹性盒子模型，转到React项目时自然地就直接用这个属性了。漏考虑了兼容性，待到测试同学拿着装ios8系统的iphone6手机测试的时候，那界面就全乱套了，我立马想到了 不兼容性，各种查询找到了针对移动端的解决方案（一般mobile的浏览器内...
Flexviewer兼容谷歌，百度，天地图等地图作为地图展示
dailiwei007的专栏
01-25 2091
FlexViewer兼容各种地图，网上搜索了好多今天在这里总结下：只是展示三种，其余可去下载开发包（swc）    地址：http://download.csdn.net/detail/dailiwei007/5028797   1    谷歌的：   package { import com.esri.ags.SpatialReference; import com.esri.
互联网在线地图平台对比分析
on-my-way->
12-12 1万+
（此文是在拿政府内部一个地图平台与其它在线地图平台对比情况下写的，目的是改进此地图平台，关于此地图平台的内容以删除，其它内容难免有错误或不足之处，欢迎批评指正） 一、互联网在线地图发展现状         随着地理信息技术与互联网技术的深入结合，在线地图应用服务逐步在互联网上扩展开来，互联网搜索引擎、门户网站、地图数据供应商和位置服务提供商纷纷建立自己的在线地图服务平台。在线地图平台提供的地图
React Native 百度地图 SDK 使用教程
gitblog_00685的博客
08-10 280
React Native 百度地图 SDK 使用教程 react-native-baidu-mapBaidu Map SDK modules and views for React Native(Android & iOS), support react native 0.61+. 百度地图 React Native 模块，支持 react native 0.61+，已更新到最新的百度地图SDK...
手机地图渲染的方式讨论
zhanyong168的专栏
08-17 4258
知乎  知乎搜索 搜索 提问 首页 话题 发现 注册知乎登录 Google 地图GIS（地理信息系统） Google 地图为什么不采用矢量地图渲染的方式，而是下载栅格化图像然后渲染的方式？ 1 条评论 分享 按票数排序 13 个回答
Arcgis for Js之加载wms服务
01-18 3552
概述：本节讲述Arcgis for Js加载ArcgisServer和GeoServer发布的wms服务。 1、定义resourceInfo var resourceInfo = { extent: new Extent(-126.40869140625,31.02539...
React Native地理位置与地图应用：使用地理定位与地图SDK
通过地理定位，应用可以获取用户所在的地理位置信息，为用户提供基于地理位置的个性化服务，比如附近的商家推荐、路径规划、天气信息等。而地图SDK能够在应用中展示地图，并实现标记、导航、交互等功
前端面试题
IT_Jiangxiaobai的博客
05-19 5217
01-HTML~02-CSS 1.每个HTML文件里面都有一个很重要的东西，Doctype，知道这是干什么的么？ 要点一 : 该标签告知浏览器浏览文档要使用的HTML规范 , 告知浏览器以何种规范解析页面 要点二 : 声明对大小写不敏感 2.常用浏览器有哪些，内核都是什么？ 答： 常用浏览器有chrome、safari、 IE、火狐(firefox) 、 Opera 、360、搜狗等 浏览器 内核 备注 IE Trident IE、猎豹安全、360极速浏览器、百度浏览器 firefo
技术合伙人必备攻略---app开发技术栈调研--多种方案对比--uniapp学习路线
直到世界的尽头
02-26 1890
app开发技术方案对比 app开发主要有几种技术方案如下： 原生开发 原生开发简介 原生(native)开发从定义上来说 一般是指用原生开发语言开发，原生开发语言就是开发整个系统时使用的编程语言。 对于iOS来说就是Objective C，对于Android来说…不太好说，因为Android用的Linux内核是用C开发的，中间层的库是用C/C++开发的，但应用程序框架和应用程序都是用Java开发的。 但实际上原生开发的含义有所扩展，主要区别于前端框架的跨端语言开发。 目前做ios原生开发多使用Swift语言
使用ThorUi
最新发布
Front小思的博客
11-08 819
如果你想在 Vue.js 项目中使用 ThorUI，你需要确保你的项目已经正确配置了 Thorium 和 ThorUI。如果你打算使用 ThorUI 来开发你的应用，以下是一些基本的步骤和示例代码，帮助你入门。以下是一个简单的示例，展示如何在 Angular 项目中使用 ThorUI 来创建一个基本的窗口。以下是一个简单的示例，展示如何在 Vue.js 项目中使用 ThorUI 来创建一个基本的窗口。以下是一个简单的示例，展示如何在 React 项目中使用 ThorUI 来创建一个基本的窗口。
Pinia小菠萝(状态管理器)
qq_58341172的博客
11-07 561
/getter的定义//将对象的方法使用return供组件使用return {count,increate,<template><div></div>
【ArcGISPro】单次将自己建立的工具箱添加至Arcpy中
Z_W_H_的博客
11-07 145
新建工具箱添加至Arcpy中调用刚添加的工具箱。
ArcGIS Pro SDK （二十二）订阅和搜索
Winemonk
11-06 216
【代码】ArcGIS Pro SDK （二十二）订阅和搜索。
钉钉调试微应用整理2
u014722196的博客
11-07 455
钉钉四端调试
Flex实现的Google地图源码修复版本
资源摘要信息:"用flex开发的google地图源代码集合" 知识点详细说明： 1. Flex技术概述： Flex是一种基于Flash的富客户端应用开发框架，它主要用于开发运行在Adobe Flash Player和Adobe AIR平台上的RIA（Rich ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值