v3.js 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351
  1. /* Copyright (c) 2006-2013 by OpenLayers Contributors (see authors.txt for
  2. * full list of contributors). Published under the 2-clause BSD license.
  3. * See license.txt in the OpenLayers distribution or repository for the
  4. * full text of the license. */
  5. /**
  6. * @requires OpenLayers/Layer/Google.js
  7. */
  8. /**
  9. * Constant: OpenLayers.Layer.Google.v3
  10. *
  11. * Mixin providing functionality specific to the Google Maps API v3.
  12. *
  13. * To use this layer, you must include the GMaps v3 API in your html.
  14. *
  15. * Note that this layer configures the google.maps.map object with the
  16. * "disableDefaultUI" option set to true. Using UI controls that the Google
  17. * Maps API provides is not supported by the OpenLayers API.
  18. */
  19. OpenLayers.Layer.Google.v3 = {
  20. /**
  21. * Constant: DEFAULTS
  22. * {Object} It is not recommended to change the properties set here. Note
  23. * that Google.v3 layers only work when sphericalMercator is set to true.
  24. *
  25. * (code)
  26. * {
  27. * sphericalMercator: true,
  28. * projection: "EPSG:900913"
  29. * }
  30. * (end)
  31. */
  32. DEFAULTS: {
  33. sphericalMercator: true,
  34. projection: "EPSG:900913"
  35. },
  36. /**
  37. * APIProperty: animationEnabled
  38. * {Boolean} If set to true, the transition between zoom levels will be
  39. * animated (if supported by the GMaps API for the device used). Set to
  40. * false to match the zooming experience of other layer types. Default
  41. * is true. Note that the GMaps API does not give us control over zoom
  42. * animation, so if set to false, when zooming, this will make the
  43. * layer temporarily invisible, wait until GMaps reports the map being
  44. * idle, and make it visible again. The result will be a blank layer
  45. * for a few moments while zooming.
  46. */
  47. animationEnabled: true,
  48. /**
  49. * Method: loadMapObject
  50. * Load the GMap and register appropriate event listeners.
  51. */
  52. loadMapObject: function() {
  53. if (!this.type) {
  54. this.type = google.maps.MapTypeId.ROADMAP;
  55. }
  56. var mapObject;
  57. var cache = OpenLayers.Layer.Google.cache[this.map.id];
  58. if (cache) {
  59. // there are already Google layers added to this map
  60. mapObject = cache.mapObject;
  61. // increment the layer count
  62. ++cache.count;
  63. } else {
  64. // this is the first Google layer for this map
  65. // create GMap
  66. var center = this.map.getCenter();
  67. var container = document.createElement('div');
  68. container.className = "olForeignContainer";
  69. container.style.width = '100%';
  70. container.style.height = '100%';
  71. mapObject = new google.maps.Map(container, {
  72. center: center ?
  73. new google.maps.LatLng(center.lat, center.lon) :
  74. new google.maps.LatLng(0, 0),
  75. zoom: this.map.getZoom() || 0,
  76. mapTypeId: this.type,
  77. disableDefaultUI: true,
  78. keyboardShortcuts: false,
  79. draggable: false,
  80. disableDoubleClickZoom: true,
  81. scrollwheel: false,
  82. streetViewControl: false
  83. });
  84. var googleControl = document.createElement('div');
  85. googleControl.style.width = '100%';
  86. googleControl.style.height = '100%';
  87. mapObject.controls[google.maps.ControlPosition.TOP_LEFT].push(googleControl);
  88. // cache elements for use by any other google layers added to
  89. // this same map
  90. cache = {
  91. googleControl: googleControl,
  92. mapObject: mapObject,
  93. count: 1
  94. };
  95. OpenLayers.Layer.Google.cache[this.map.id] = cache;
  96. }
  97. this.mapObject = mapObject;
  98. this.setGMapVisibility(this.visibility);
  99. },
  100. /**
  101. * APIMethod: onMapResize
  102. */
  103. onMapResize: function() {
  104. if (this.visibility) {
  105. google.maps.event.trigger(this.mapObject, "resize");
  106. }
  107. },
  108. /**
  109. * Method: setGMapVisibility
  110. * Display the GMap container and associated elements.
  111. *
  112. * Parameters:
  113. * visible - {Boolean} Display the GMap elements.
  114. */
  115. setGMapVisibility: function(visible) {
  116. var cache = OpenLayers.Layer.Google.cache[this.map.id];
  117. var map = this.map;
  118. if (cache) {
  119. var type = this.type;
  120. var layers = map.layers;
  121. var layer;
  122. for (var i=layers.length-1; i>=0; --i) {
  123. layer = layers[i];
  124. if (layer instanceof OpenLayers.Layer.Google &&
  125. layer.visibility === true && layer.inRange === true) {
  126. type = layer.type;
  127. visible = true;
  128. break;
  129. }
  130. }
  131. var container = this.mapObject.getDiv();
  132. if (visible === true) {
  133. if (container.parentNode !== map.div) {
  134. if (!cache.rendered) {
  135. var me = this;
  136. google.maps.event.addListenerOnce(this.mapObject, 'tilesloaded', function() {
  137. cache.rendered = true;
  138. me.setGMapVisibility(me.getVisibility());
  139. me.moveTo(me.map.getCenter());
  140. });
  141. } else {
  142. map.div.appendChild(container);
  143. cache.googleControl.appendChild(map.viewPortDiv);
  144. google.maps.event.trigger(this.mapObject, 'resize');
  145. }
  146. }
  147. this.mapObject.setMapTypeId(type);
  148. } else if (cache.googleControl.hasChildNodes()) {
  149. map.div.appendChild(map.viewPortDiv);
  150. map.div.removeChild(container);
  151. }
  152. }
  153. },
  154. /**
  155. * Method: getMapContainer
  156. *
  157. * Returns:
  158. * {DOMElement} the GMap container's div
  159. */
  160. getMapContainer: function() {
  161. return this.mapObject.getDiv();
  162. },
  163. //
  164. // TRANSLATION: MapObject Bounds <-> OpenLayers.Bounds
  165. //
  166. /**
  167. * APIMethod: getMapObjectBoundsFromOLBounds
  168. *
  169. * Parameters:
  170. * olBounds - {<OpenLayers.Bounds>}
  171. *
  172. * Returns:
  173. * {Object} A MapObject Bounds, translated from olBounds
  174. * Returns null if null value is passed in
  175. */
  176. getMapObjectBoundsFromOLBounds: function(olBounds) {
  177. var moBounds = null;
  178. if (olBounds != null) {
  179. var sw = this.sphericalMercator ?
  180. this.inverseMercator(olBounds.bottom, olBounds.left) :
  181. new OpenLayers.LonLat(olBounds.bottom, olBounds.left);
  182. var ne = this.sphericalMercator ?
  183. this.inverseMercator(olBounds.top, olBounds.right) :
  184. new OpenLayers.LonLat(olBounds.top, olBounds.right);
  185. moBounds = new google.maps.LatLngBounds(
  186. new google.maps.LatLng(sw.lat, sw.lon),
  187. new google.maps.LatLng(ne.lat, ne.lon)
  188. );
  189. }
  190. return moBounds;
  191. },
  192. /************************************
  193. * *
  194. * MapObject Interface Controls *
  195. * *
  196. ************************************/
  197. // LonLat - Pixel Translation
  198. /**
  199. * APIMethod: getMapObjectLonLatFromMapObjectPixel
  200. *
  201. * Parameters:
  202. * moPixel - {Object} MapObject Pixel format
  203. *
  204. * Returns:
  205. * {Object} MapObject LonLat translated from MapObject Pixel
  206. */
  207. getMapObjectLonLatFromMapObjectPixel: function(moPixel) {
  208. var size = this.map.getSize();
  209. var lon = this.getLongitudeFromMapObjectLonLat(this.mapObject.center);
  210. var lat = this.getLatitudeFromMapObjectLonLat(this.mapObject.center);
  211. var res = this.map.getResolution();
  212. var delta_x = moPixel.x - (size.w / 2);
  213. var delta_y = moPixel.y - (size.h / 2);
  214. var lonlat = new OpenLayers.LonLat(
  215. lon + delta_x * res,
  216. lat - delta_y * res
  217. );
  218. if (this.wrapDateLine) {
  219. lonlat = lonlat.wrapDateLine(this.maxExtent);
  220. }
  221. return this.getMapObjectLonLatFromLonLat(lonlat.lon, lonlat.lat);
  222. },
  223. /**
  224. * APIMethod: getMapObjectPixelFromMapObjectLonLat
  225. *
  226. * Parameters:
  227. * moLonLat - {Object} MapObject LonLat format
  228. *
  229. * Returns:
  230. * {Object} MapObject Pixel transtlated from MapObject LonLat
  231. */
  232. getMapObjectPixelFromMapObjectLonLat: function(moLonLat) {
  233. var lon = this.getLongitudeFromMapObjectLonLat(moLonLat);
  234. var lat = this.getLatitudeFromMapObjectLonLat(moLonLat);
  235. var res = this.map.getResolution();
  236. var extent = this.map.getExtent();
  237. return this.getMapObjectPixelFromXY((1/res * (lon - extent.left)),
  238. (1/res * (extent.top - lat)));
  239. },
  240. /**
  241. * APIMethod: setMapObjectCenter
  242. * Set the mapObject to the specified center and zoom
  243. *
  244. * Parameters:
  245. * center - {Object} MapObject LonLat format
  246. * zoom - {int} MapObject zoom format
  247. */
  248. setMapObjectCenter: function(center, zoom) {
  249. if (this.animationEnabled === false && zoom != this.mapObject.zoom) {
  250. var mapContainer = this.getMapContainer();
  251. google.maps.event.addListenerOnce(
  252. this.mapObject,
  253. "idle",
  254. function() {
  255. mapContainer.style.visibility = "";
  256. }
  257. );
  258. mapContainer.style.visibility = "hidden";
  259. }
  260. this.mapObject.setOptions({
  261. center: center,
  262. zoom: zoom
  263. });
  264. },
  265. // Bounds
  266. /**
  267. * APIMethod: getMapObjectZoomFromMapObjectBounds
  268. *
  269. * Parameters:
  270. * moBounds - {Object} MapObject Bounds format
  271. *
  272. * Returns:
  273. * {Object} MapObject Zoom for specified MapObject Bounds
  274. */
  275. getMapObjectZoomFromMapObjectBounds: function(moBounds) {
  276. return this.mapObject.getBoundsZoomLevel(moBounds);
  277. },
  278. /************************************
  279. * *
  280. * MapObject Primitives *
  281. * *
  282. ************************************/
  283. // LonLat
  284. /**
  285. * APIMethod: getMapObjectLonLatFromLonLat
  286. *
  287. * Parameters:
  288. * lon - {Float}
  289. * lat - {Float}
  290. *
  291. * Returns:
  292. * {Object} MapObject LonLat built from lon and lat params
  293. */
  294. getMapObjectLonLatFromLonLat: function(lon, lat) {
  295. var gLatLng;
  296. if(this.sphericalMercator) {
  297. var lonlat = this.inverseMercator(lon, lat);
  298. gLatLng = new google.maps.LatLng(lonlat.lat, lonlat.lon);
  299. } else {
  300. gLatLng = new google.maps.LatLng(lat, lon);
  301. }
  302. return gLatLng;
  303. },
  304. // Pixel
  305. /**
  306. * APIMethod: getMapObjectPixelFromXY
  307. *
  308. * Parameters:
  309. * x - {Integer}
  310. * y - {Integer}
  311. *
  312. * Returns:
  313. * {Object} MapObject Pixel from x and y parameters
  314. */
  315. getMapObjectPixelFromXY: function(x, y) {
  316. return new google.maps.Point(x, y);
  317. }
  318. };