Revision 90713556
Added by Andreas Kohlbecker over 13 years ago
| modules/cdm_dataportal/js/openlayers_map.js | ||
|---|---|---|
| 4 | 4 |
|
| 5 | 5 |
var map = null; |
| 6 | 6 |
|
| 7 |
var dataBounds = null; |
|
| 8 |
|
|
| 7 | 9 |
var layerByNameMap = {
|
| 8 | 10 |
tdwg1: 'topp:tdwg_level_1', |
| 9 | 11 |
tdwg2: 'topp:tdwg_level_2', |
| ... | ... | |
| 44 | 46 |
*/ |
| 45 | 47 |
this.init = function(){
|
| 46 | 48 |
|
| 47 |
// get and prepare the Urls |
|
| 49 |
initOpenLayers(); |
|
| 50 |
|
|
| 51 |
// -- Distribution Layer -- |
|
| 48 | 52 |
var distributionQuery = mapElement.attr('distributionQuery');
|
| 49 |
if(typeof legendPosition == 'number'){
|
|
| 50 |
distributionQuery = mergeQueryStrings(distributionQuery, 'legend=1&mlp=' + options.legendPosition); |
|
| 53 |
|
|
| 54 |
if(distributionQuery != undefined){
|
|
| 55 |
if(typeof legendPosition == 'number'){
|
|
| 56 |
distributionQuery = mergeQueryStrings(distributionQuery, 'legend=1&mlp=' + options.legendPosition); |
|
| 57 |
} |
|
| 58 |
|
|
| 59 |
distributionQuery = mergeQueryStrings(distributionQuery, 'callback=?'); |
|
| 60 |
var legendFormatQuery = mapElement.attr('legendFormatQuery');
|
|
| 61 |
if(legendFormatQuery !== undefined){
|
|
| 62 |
legendImgSrc = mergeQueryStrings('/GetLegendGraphic?SERVICE=WMS&VERSION=1.1.1', legendFormatQuery);
|
|
| 63 |
} |
|
| 64 |
|
|
| 65 |
var mapServiceRequest = mapserverBaseUrl + '/areas.php?' + distributionQuery; |
|
| 66 |
|
|
| 67 |
$.ajax({
|
|
| 68 |
url: mapServiceRequest, |
|
| 69 |
dataType: "jsonp", |
|
| 70 |
success: function(data){
|
|
| 71 |
addDistributionLayer(data); |
|
| 72 |
} |
|
| 73 |
}); |
|
| 51 | 74 |
} |
| 52 |
// jsonp |
|
| 53 |
distributionQuery = mergeQueryStrings(distributionQuery, 'callback=?'); |
|
| 54 | 75 |
|
| 55 |
var legendFormatQuery = mapElement.attr('legendFormatQuery');
|
|
| 56 |
if(legendFormatQuery !== undefined){
|
|
| 57 |
legendImgSrc = mergeQueryStrings('/GetLegendGraphic?SERVICE=WMS&VERSION=1.1.1', legendFormatQuery);
|
|
| 76 |
// -- Occurrence Layer -- |
|
| 77 |
var occurrenceQuery = mapElement.attr('occurrenceQuery');
|
|
| 78 |
if(occurrenceQuery != undefined){
|
|
| 79 |
// if(typeof legendPosition == 'number'){
|
|
| 80 |
// occurrenceQuery = mergeQueryStrings(distributionQuery, 'legend=1&mlp=' + options.legendPosition); |
|
| 81 |
// } |
|
| 82 |
|
|
| 83 |
occurrenceQuery = mergeQueryStrings(occurrenceQuery, 'callback=?'); |
|
| 84 |
// var legendFormatQuery = mapElement.attr('legendFormatQuery');
|
|
| 85 |
// if(legendFormatQuery !== undefined){
|
|
| 86 |
// legendImgSrc = mergeQueryStrings('/GetLegendGraphic?SERVICE=WMS&VERSION=1.1.1', legendFormatQuery);
|
|
| 87 |
// } |
|
| 88 |
|
|
| 89 |
var mapServiceRequest = mapserverBaseUrl + '/points.php?' + occurrenceQuery; |
|
| 90 |
|
|
| 91 |
$.ajax({
|
|
| 92 |
url: mapServiceRequest, |
|
| 93 |
dataType: "jsonp", |
|
| 94 |
success: function(data){
|
|
| 95 |
addDistributionLayer(data); |
|
| 96 |
} |
|
| 97 |
}); |
|
| 58 | 98 |
} |
| 59 | 99 |
|
| 60 |
var mapServiceRequest = mapserverBaseUrl + '/areas.php?' + distributionQuery; |
|
| 61 |
$.ajax({
|
|
| 62 |
url: mapServiceRequest, |
|
| 63 |
dataType: "jsonp", |
|
| 64 |
success: function(data){
|
|
| 65 |
initOpenLayers(data); |
|
| 66 |
} |
|
| 67 |
}); |
|
| 68 | 100 |
|
| 69 |
// $.ajax({
|
|
| 70 |
// url: mapServiceRequest, |
|
| 71 |
// dataType: "jsonp", |
|
| 72 |
// success: function(data){
|
|
| 73 |
// initOpenLayers(data); |
|
| 74 |
// }, |
|
| 75 |
// jsonp: "foo" |
|
| 76 |
// }); |
|
| 77 | 101 |
}; |
| 78 | 102 |
|
| 79 | 103 |
/** |
| 80 |
* |
|
| 104 |
* Initialize the Openlayers viewer with the base layer
|
|
| 81 | 105 |
*/ |
| 82 |
var initOpenLayers = function(mapResponseObj){
|
|
| 106 |
var initOpenLayers = function(){
|
|
| 83 | 107 |
|
| 84 | 108 |
// instatiate the openlayers viewer |
| 85 | 109 |
map = new OpenLayers.Map('openlayers_map', mapOptions);
|
| ... | ... | |
| 87 | 111 |
//add the base layer |
| 88 | 112 |
map.addLayers([baseLayer]); |
| 89 | 113 |
|
| 114 |
|
|
| 115 |
//map.addControl(new OpenLayers.Control.LayerSwitcher({'ascending':false}));
|
|
| 116 |
|
|
| 117 |
|
|
| 118 |
// zoom to the required area |
|
| 119 |
var boundsStr = (typeof options.boundingBox == 'string' && options.boundingBox.length > 6 ? options.boundingBox : '-180, -90, 180, 90'); |
|
| 120 |
var zoomToBounds = OpenLayers.Bounds.fromString( boundsStr ); |
|
| 121 |
map.zoomToExtent(zoomToBounds, false); |
|
| 122 |
|
|
| 123 |
// adjust height of openlayers container div |
|
| 124 |
$('#openlayers').css('height', $('#openlayers #openlayers_map').height());
|
|
| 125 |
|
|
| 126 |
}; |
|
| 127 |
|
|
| 128 |
/** |
|
| 129 |
* add a distribution layer |
|
| 130 |
*/ |
|
| 131 |
var addDistributionLayer = function(mapResponseObj){
|
|
| 132 |
|
|
| 133 |
|
|
| 90 | 134 |
// add additional layers, get them from |
| 91 | 135 |
// the mapResponseObj |
| 92 | 136 |
if(mapResponseObj !== undefined){
|
| 93 |
for ( var i in mapResponseObj.layers) {
|
|
| 94 |
|
|
| 95 |
var layerData = mapResponseObj.layers[i];
|
|
| 137 |
if(mapResponseObj.points_sld !== undefined){
|
|
| 138 |
// it is a response from the points.php |
|
| 139 |
//TODO points_sld should be renamed to sld in response + fill path to sld should be given
|
|
| 96 | 140 |
|
| 97 | 141 |
var layer = new OpenLayers.Layer.WMS.Untiled( |
| 98 |
layerData.tdwg, |
|
| 99 |
mapResponseObj.geoserver + "/wms", |
|
| 100 |
{layers: layerByNameMap[layerData.tdwg] ,transparent:"true", format:"image/png"},
|
|
| 101 |
defaultLayerOptions ); |
|
| 142 |
'points', |
|
| 143 |
"http://193.190.116.6:8080/geoserver/wms/wms", |
|
| 144 |
{layers: 'topp:rest_points' ,transparent:"true", format:"image/png"},
|
|
| 145 |
defaultLayerOptions ); |
|
| 146 |
|
|
| 147 |
var sld = mapResponseObj.points_sld; |
|
| 148 |
if(sld.indexOf("http://") != 0){
|
|
| 149 |
sld = "http://edit.br.fgov.be/synthesys/www/v1/sld/" + sld; |
|
| 150 |
} |
|
| 102 | 151 |
|
| 103 |
layer.params.SLD = layerData.sld;
|
|
| 152 |
layer.params.SLD = sld;
|
|
| 104 | 153 |
map.addLayers([layer]); |
| 154 |
|
|
| 155 |
} else {
|
|
| 156 |
// it is a response from the areas.php |
|
| 157 |
for ( var i in mapResponseObj.layers) {
|
|
| 158 |
var layerData = mapResponseObj.layers[i]; |
|
| 159 |
|
|
| 160 |
var layer = new OpenLayers.Layer.WMS.Untiled( |
|
| 161 |
layerData.tdwg, |
|
| 162 |
mapResponseObj.geoserver + "/wms", |
|
| 163 |
{layers: layerByNameMap[layerData.tdwg] ,transparent:"true", format:"image/png"},
|
|
| 164 |
defaultLayerOptions ); |
|
| 165 |
layer.params.SLD = layerData.sld; |
|
| 166 |
layer.setOpacity(options.distributionOpacity); |
|
| 167 |
map.addLayers([layer]); |
|
| 168 |
|
|
| 169 |
} |
|
| 105 | 170 |
|
| 106 | 171 |
} |
| 107 |
|
|
| 108 |
//map.addControl(new OpenLayers.Control.LayerSwitcher({'ascending':false}));
|
|
| 109 | 172 |
|
| 110 |
|
|
| 111 | 173 |
// zoom to the required area |
| 112 |
var boundsStr = (typeof options.boundingBox == 'string' && options.boundingBox.length > 6 ? |
|
| 113 |
options.boundingBox : (mapResponseObj.bbox ? |
|
| 114 |
mapResponseObj.bbox : '-180, -90, 180, 90') |
|
| 115 |
); |
|
| 116 |
var zoomToBounds = OpenLayers.Bounds.fromString( boundsStr ); |
|
| 117 |
map.zoomToExtent(zoomToBounds, false); |
|
| 174 |
if(mapResponseObj.bbox != undefined){
|
|
| 175 |
var newBounds = OpenLayers.Bounds.fromString( mapResponseObj.bbox ); |
|
| 176 |
if(dataBounds !== null){
|
|
| 177 |
dataBounds.extend(newBounds); |
|
| 178 |
} else if(newBounds !== undefined){
|
|
| 179 |
dataBounds = newBounds; |
|
| 180 |
} |
|
| 181 |
map.zoomToExtent(dataBounds, false); |
|
| 182 |
if(map.getZoom() > options.maxZoom){
|
|
| 183 |
map.zoomTo(options.maxZoom); |
|
| 184 |
} |
|
| 185 |
} |
|
| 118 | 186 |
|
| 119 |
// HACK: |
|
| 120 |
// var hack = "/var/www/"; |
|
| 121 |
// mapResponseObj.legend = "http://edit.br.fgov.be/" + mapResponseObj.legend.substr(hack.length - 1); |
|
| 122 |
// END OF HACK |
|
| 123 |
if(options.legendPosition != undefined){
|
|
| 187 |
|
|
| 188 |
if(options.legendPosition != undefined && mapResponseObj.legend != undefined){
|
|
| 124 | 189 |
var legendSrcUrl = mapResponseObj.geoserver + legendImgSrc + mapResponseObj.legend; |
| 125 | 190 |
addLegendAsElement(legendSrcUrl); |
| 126 | 191 |
//addLegendAsLayer(legendSrcUrl, map); |
| 127 | 192 |
} |
| 128 | 193 |
} |
| 129 | 194 |
|
| 130 |
// adjust height of openlayers container div |
|
| 131 |
$('#openlayers').css('height', $('#openlayers #openlayers_map').height());
|
|
| 132 |
|
|
| 133 | 195 |
}; |
| 134 | 196 |
|
| 197 |
/** |
|
| 198 |
* |
|
| 199 |
*/ |
|
| 135 | 200 |
var addLegendAsElement= function(legendSrcUrl){
|
| 136 | 201 |
|
| 137 | 202 |
mapElement.after('<div class="openlayers_legend"><img src="' + legendSrcUrl + '"></div>');
|
| 138 |
mapElement.next('.openlayers_legend').find('img').load(function () {
|
|
| 203 |
mapElement.next('.openlayers_legend').css('opacity', options.legendOpacity).find('img').load(function () {
|
|
| 139 | 204 |
$(this).parent() |
| 140 | 205 |
.css('position', 'relative')
|
| 141 | 206 |
.css('z-index', '30000')
|
| ... | ... | |
| 151 | 216 |
|
| 152 | 217 |
// 1. download imge to find height and width |
| 153 | 218 |
mapElement.after('<div class="openlayers_legend"><img src="' + legendSrcUrl + '"></div>');
|
| 154 |
mapElement.next('.openlayers_legend').css('display', 'none').find('img').load(function () {
|
|
| 219 |
mapElement.next('.openlayers_legend').css('display', 'none').css('opacity', options.legendOpacity).find('img').load(function () {
|
|
| 155 | 220 |
|
| 156 | 221 |
w = mapElement.next('.openlayers_legend').find('img').width();
|
| 157 | 222 |
h = mapElement.next('.openlayers_legend').find('img').height();
|
| ... | ... | |
| 218 | 283 |
$.fn.cdm_openlayers_map.defaults = { // set up default options
|
| 219 | 284 |
legendPosition: null, // 1,2,3,4,5,6 = display a legend in the corner specified by the number |
| 220 | 285 |
displayWidth: 400, |
| 221 |
boundingBox: null |
|
| 286 |
distributionOpacity: 0.75, |
|
| 287 |
legendOpacity: 0.75, |
|
| 288 |
boundingBox: null, |
|
| 289 |
maxZoom: 4 |
|
| 222 | 290 |
}; |
| 223 | 291 |
|
Also available in: Unified diff
display of specimens with occurence map & remember tab