From ef525f578389fde715d4f999fe27b0b6aa9d2eb2 Mon Sep 17 00:00:00 2001 From: Silvio Date: Wed, 27 Mar 2013 15:31:44 -0300 Subject: Initial import --- README | 0 gmap_arcgis.js | 316 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 316 insertions(+) create mode 100644 README create mode 100644 gmap_arcgis.js diff --git a/README b/README new file mode 100644 index 0000000..e69de29 diff --git a/gmap_arcgis.js b/gmap_arcgis.js new file mode 100644 index 0000000..d0bd721 --- /dev/null +++ b/gmap_arcgis.js @@ -0,0 +1,316 @@ +// $Id$ + +function gmapArcgis(config) { + return { + // Storable properties + config: config, + map: config.map, + + // UI unblocker wrapper + unblockUI: function() { + jQuery.unblockUI(); + }, + + // UI blocker wrapper + blockUI: function() { + jQuery.blockUI(); + }, + + // Set the current map + setMap: function(map) { + this.map = map; + }, + + // Get the default opacity of an layer element + defaultOpacity: function(element, store) { + store = (store != undefined) ? store : 'layers'; + + if (this.config[store][element] != undefined && this.config[store][element].opacity != undefined) { + return this.config[store][element].opacity; + } + else { + return 0.55; + } + }, + + // TODO: support for clickable polygons + // Add polygons from a given ArcGIS MapServer Layer + showPolygon: function(params, store) { + params.overlay = new gmaps.ags.MapOverlay(params['uri'], { + exportOptions: { + layerIds: params['layers'], + layerOption: 'show', + } + }); + + params.overlay.setMap(this.map); + params.overlay.setOpacity(params.opacity); + + if (params.callback == undefined) { + // Default callback: remove the blockUI once the layer is shown + google.maps.event.addListener(params.overlay.getMapService(), 'update', function() { + this.unblockUI(); + }); + } + else { + google.maps.event.addListener(params.overlay.getMapService(), 'update', function() { + params.callback(this.map, params) ; this.unblockUI(); + }); + } + + return params.overlay; + }, + + // Add a KML to the map + showKML: function(element) { + if (typeof this.config['kmls'][element].overlay == 'undefined') { + this.config['kmls'][element].overlay = new google.maps.KmlLayer(this.config['kmls'][element].uri); + } + + this.config['kmls'][element].overlay.setMap(this.map); + this.config['kmls'][element].isVisible = true; + }, + + // Add a KML layer into the map + addKML: function(element) { + if (typeof this.config['kmls'][element].overlay != 'undefined') { + this.showKML(element); + this.unblockUI(); + return; + } + + if (this.config['kmls'][element].overlayTime != undefined) { + this.showOverlay(this.config['kmls'][element].overlayTime); + } + + this.showKML(element); + }, + + // Add a layer to the map + addLayers: function(element) { + this.config['layers'][element].opacity = this.defaultOpacity(element); + + if (typeof this.config['layers'][element].overlay != 'undefined') { + this.config['layers'][element].overlay.setOpacity(this.config['layers'][element].opacity); + this.unblockUI(); + return; + } + + if (this.config['layers'][element].overlayTime != undefined) { + this.showOverlay(this.config['layers'][element].overlayTime); + } + + this.config['layers'][element].overlay = this.showPolygon(this.config['layers'][element]); + }, + + // Add a slider layer in the map + addSlider: function(layer, slider) { + this.config['sliders'][slider].opacity = this.defaultOpacity(layer, 'sliders'); + this.config['sliders'][slider].callback = this.sliderUpdateOpacity; + this.config['sliders'][slider].layers = [layer]; + + if (typeof this.config['sliders'][slider].overlays[layer] != 'undefined') { + this.config['sliders'][slider].overlays[layer].setOpacity(this.config['sliders'][slider].opacity); + this.unblockUI(); + } + + if (this.config['sliders'][slider].overlayTime != undefined) { + this.showOverlay(this.config['sliders'][slider].overlayTime); + } + + this.config['sliders'][slider].overlays[layer] = this.showPolygon(this.config['sliders'][slider]); + }, + + // Add makers to the map + addMarkers: function(element) { + var bounds = this.map.getBounds(); + var self = this; + + if (this.config['markers'][element].overlay != undefined) { + this.toggleMarkers(element); + return; + } else { + this.config['markers'][element].overlay = []; + } + + if (this.config['markers'][element].overlayTime != undefined) { + this.showOverlay(this.config['markers'][element].overlayTime); + } + + // Query parameters + var query = { + returnGeometry: true, + geometry: bounds, + where: (this.config['markers'][element].where != undefined) ? this.config['markers'][element].where : '1=1', + outFields: this.config['markers'][element].fields, + }; + + var layer = new gmaps.ags.Layer(this.config['markers'][element].uri); + + // Execute query + layer.query(query, processResultSet); + + // Configure infoWindow + this.config['markers'][element].infowindow = new google.maps.InfoWindow({ + content: '', + }); + + // Process results + function processResultSet(fset) { + var fs = fset.features; + var title; + for (var i = 0, c = fs.length; i < c; i++) { + fset = fs[i]; + + if (self.config['markers'][element].title != undefined) { + title = fset.attributes[self.config['markers'][element].title]; + } + else { + title = fset.attributes.nome; + } + + self.config['markers'][element].overlay[i] = {}; + self.config['markers'][element].overlay[i].marker = new google.maps.Marker({ + title: title, + icon: self.config['markers'][element].icon, + position: fset.geometry[0].getPosition(), + map: map, + }); + + // Use a closure so marker data remains available to the listeners + self.config['markers'][element].overlay[i].addListener = function() { + var marker = self.config['markers'][element].overlay[i].marker; + var infowindow = self.config['markers'][element].infowindow; + var content = self.config['markers'][element].content; + var attributes = fset.attributes; + + google.maps.event.addListener(marker, 'click', function() { + infowindow.setContent(content(attributes)); + infowindow.open(map, marker); + }); + }; + + // Execute + self.config['markers'][element].overlay[i].addListener(); + } + + self.unblockUI(); + } + }, + + // Toggle KML visibility + toggleKML: function(element) { + if (this.config['kmls'][element].overlay == undefined) { + return; + } else if (this.config['kmls'][element].isVisible == true) { + this.config['kmls'][element].isVisible = false; + this.config['kmls'][element].overlay.setMap(); + } else { + this.config['kmls'][element].isVisible = true; + this.config['kmls'][element].overlay.setMap(this.map); + } + }, + + // Toggle layer visibility + toggleLayers: function(element) { + this.config['layers'][element].overlay.setOpacity(0); + }, + + // Toggle marker visibility + toggleMarkers: function(element, raw) { + var markers = (raw == true) ? element : this.config['markers'][element].overlay; + + for (i=0; i < markers.length; i++) { + if (markers[i].marker.getVisible()) { + markers[i].marker.setVisible(false); + } else { + markers[i].marker.setVisible(true); + } + } + }, + + // Block the UI and show an overlay + showOverlay: function(t) { + if ($.browser.msie === false) { + message = this.config.overlayMessage; + + if (this.config.overlayCss != undefined) { + css = this.config.overlayCss; + } + else { + css = { }; + } + + if (t == false) { + $.blockUI({ + message: message, + css: css, + }); + } else { + $.blockUI({ + message: message, + css: css, + timeout: t, + }); + } + } + }, + + // Change a element in the map + changeElement: function(type, element, callback) { + if (this.config[type][element] == undefined || this.config[type][element]['showOn'] == undefined) { + return; + } + + if (jQuery.inArray(this.config.mapName, this.config[type][element]['showOn']) != -1) { + this[callback](element); + } + }, + + // Display slider + sliderUpdate: function(layer, slider) { + if (this.config['sliders'][slider].overlays == undefined) { + this.config['sliders'][slider].overlays = [ ]; + } + + if (this.config['sliders'][slider].overlays[layer] == undefined) { + this.addSlider(layer, slider); + } + + this.sliderUpdateOpacity(layer, slider); + }, + + // Fix slider opacity + sliderUpdateOpacity: function(layer, slider) { + for (var i in this.config['sliders'][slider].overlays) { + if (i == layer) { + this.config['sliders'][slider].overlays[i].setOpacity(this.defaultOpacity(slider, 'sliders')); + } + else { + this.config['sliders'][slider].overlays[i].setOpacity(0); + } + } + + // The second and all subsequent layers shall be intialized without opacity. + this.sliderOpacity = 0; + }, + + // jQuery slider wrapper + slider: function(element, slider) { + var self = this; + + // Max is the number of layers in the service + $(element).slider({ + value: 1, + min: -1, + max: 11, + step: 1, + animate: true, + change: function(event, ui) { + self.sliderUpdate.apply(self, [ ui.value, slider ]); + }, + }); + }, + + } +}; -- cgit v1.2.3