src\Background.js - leaflet.ptv

API Docs for: 0.1.0
Show:

File: src\Background.js

  1. /**
  2. @module L.PtvLayer
  3. **/
  4. L.PtvLayer = L.PtvLayer || {};
  5.  
  6. /**
  7. Provides the PTV Background TileLayer class.
  8. @class L.PtvLayer.Background
  9. @extends L.TileLayer
  10. @params {XMapClient} client XMapClient object
  11. @params {Object} options The options object
  12. @params {String} [options.format] The image format used in tile requests.
  13. @params {String} [options.beforeSend] Function to be called before sending the request with the request object given as first parameter. The (modified) request object must be returned.
  14. @params {String} [options.errorTileUrl] The image to display when requests fail.
  15. @constructor
  16. **/
  17. L.PtvLayer.Background = L.TileLayer.extend({
  18.  
  19. _client: null,
  20.  
  21. /**
  22. Default options used in this class.
  23. @property options
  24. @type Object
  25. **/
  26. options: {
  27. /**
  28. The image format used in tile requests.
  29. @property options.format
  30. @type String
  31. @default "PNG"
  32. **/
  33. format: 'PNG',
  34. /**
  35. Function to be called before sending the request with the request object given as first parameter. The (modified) request object must be returned.
  36. @property options.beforeSend
  37. @type function
  38. @default null
  39. **/
  40. beforeSend: null,
  41.  
  42. /**
  43. The image to display when requests fail.
  44. @property options.errorTileUrl
  45. @type String
  46. @default "tile-error.png"
  47. **/
  48. errorTileUrl: 'tile-error.png',
  49.  
  50. /**
  51. If set to true, the tiles just won't load outside the world width (-180 to 180 longitude) instead of repeating.
  52. @property options.noWrap
  53. @type boolean
  54. @default true
  55. **/
  56. noWrap: true,
  57.  
  58. /**
  59. The world bounds for PTV Maps.
  60. @property options.bounds
  61. @type L.LatLngBounds
  62. @default [[85.0, -178.965000], [-66.5, 178.965000]]
  63. **/
  64. bounds: new L.LatLngBounds([[85.0, -178.965000], [-66.5, 178.965000]]),
  65.  
  66. /**
  67. Minimum zoom number.
  68. @property options.minZoom
  69. @type boolean
  70. @default true
  71. **/
  72. minZoom: 2
  73. },
  74.  
  75. /**
  76. Constructor
  77. @method L.PtvLayer.Background
  78. @param {XMapClient} client optional XMapClient object
  79. @param {Object} options optional options object
  80. **/
  81. initialize: function(client, options) {
  82. this._client = client;
  83. if (typeof client !== 'object' ) {
  84. if (typeof XMapClient !== 'function') {
  85. throw Error('The XMapClient object is not accessible globally. Have you loaded "xmap-client.js" properly?');
  86. } else {
  87. this._client = new XMapClient(null, 5);
  88. }
  89. }
  90. L.Util.setOptions(this, options);
  91. },
  92.  
  93. onAdd: function(map) {
  94. L.TileLayer.prototype.onAdd.call(this, map);
  95. if ( typeof this._client.cancelPendingRequests === 'function') {
  96. map.on('zoomstart', this._client.cancelPendingRequests);
  97. }
  98. },
  99.  
  100. onRemove: function(map) {
  101. L.TileLayer.prototype.onAdd.call(this, map);
  102. if ( typeof this._client.cancelPendingRequests === 'function') {
  103. map.off('zoomstart', this._client.cancelPendingRequests);
  104. }
  105. },
  106.  
  107. /**
  108. Loads a specific tile and shows the result when finished.
  109. @method _loadTile
  110. @private
  111. @param {DOMElement} tile The tile dom img element
  112. @param {Point} tilePoint The tile point
  113. **/
  114. _loadTile: function(tile, tilePoint) {
  115. tile._layer = this;
  116. tile.onload = this._tileOnLoad;
  117. tile.onerror = this._tileOnError;
  118.  
  119. var tileUrl = this._requestTile(tile, tilePoint);
  120. },
  121.  
  122. /**
  123. Requests a specific tile from the server.
  124. @method _requestTile
  125. @private
  126. @param {DOMElement} tile The tile dom img element
  127. @param {Point} tilePoint The tile point
  128. **/
  129. _requestTile: function(tile, tilePoint) {
  130. var self = this, map = this._map, crs = map.options.crs, tileSize = this.options.tileSize, zoom = this._map.getZoom(), nwPoint = tilePoint.multiplyBy(tileSize), sePoint = nwPoint.add(new L.Point(tileSize, tileSize)), nw = crs.project(map.unproject(nwPoint, zoom)), se = crs.project(map.unproject(sePoint, zoom)), bbox = new L.LatLngBounds([se.y, nw.x], [nw.y, se.x]);
  131.  
  132. var mapSection = {
  133. leftTop: {
  134. "$type": "Point",
  135. point: {
  136. "$type": "PlainPoint",
  137. x: bbox.getNorthWest().lng,
  138. y: bbox.getNorthWest().lat
  139. }
  140. },
  141. rightBottom: {
  142. "$type": "Point",
  143. point: {
  144. "$type": "PlainPoint",
  145. x: bbox.getSouthEast().lng,
  146. y: bbox.getSouthEast().lat
  147. }
  148. }
  149. };
  150. var mapParams = {
  151. showScale: false,
  152. useMiles: false
  153. };
  154. var imageInfo = {
  155. format: this.options.format,
  156. width: tileSize,
  157. height: tileSize
  158. };
  159. var layers = [];
  160. var includeImageInResponse = true;
  161. var callerContext = {
  162. properties: [{
  163. key: "Profile",
  164. value: "ajax-bg"
  165. }, {
  166. key: "CoordFormat",
  167. value: "PTV_MERCATOR"
  168. }]
  169. };
  170. if (typeof this.options.beforeSend === "function") {
  171. var req = this.options.beforeSend({ mapSection: mapSection, mapParams: mapParams, imageInfo: imageInfo, layers: layers, includeImageInResponse: includeImageInResponse, callerContext: callerContext });
  172. mapSection = req.mapSection;
  173. mapParams = req.mapParams;
  174. imageInfo = req.imageInfo;
  175. layers = req.layers;
  176. includeImageInResponse = req.includeImageInResponse;
  177. callerContext = req.callerContext;
  178. }
  179.  
  180. var cb = (function(tile) {
  181. return function(resp, error) {
  182. if (!error && resp) {
  183. tile.src = L.PtvUtils.createDataURI(resp.image.rawImage);
  184. } else {
  185. tile.src = self.options.errorTileUrl;
  186. console.log(error.errorMessage);
  187. }
  188. };
  189. })(tile);
  190.  
  191. this._client.renderMapBoundingBox(mapSection, mapParams, imageInfo, layers, includeImageInResponse, callerContext, cb);
  192. }
  193. });
  194.  
  195. L.PtvLayer.background = function(client, options) {
  196. return new L.PtvLayer.Background(client, options);
  197. };
  198.