+++ /dev/null
-\r
-\r
- serialized = new OpenLayers.Layer.WMS.Untiled( "Your symbolized polygons",\r
- "http://193.190.223.53:8080/geoserver/wms", {layers:'topp:serialized_pols',GROUP:'remote',sld: '../../stable_sld/permanent_sld/transparent_pols.sld',transparent:"true",format:t_img_format},{opacity:1},{'reproject': false});\r
-\r
- queryEventHandler = new OpenLayers.Handler.Click({ 'map': map }, { ondblclick: function() {alert("double click")}, \r
- 'click': function(e) { doGetFeatureInfo(e); }}); \r
-\r
-\r
- myStyles = new OpenLayers.StyleMap({\r
- "first": new OpenLayers.Style({\r
- // pointRadius: "20", // sized according to type attribute\r
- fillColor: "#bcf099",\r
- strokeColor: "#3399ff",\r
- strokeWidth: "2",\r
- fillOpacity: "0.5"\r
-\r
- }),\r
- "default": new OpenLayers.Style({\r
- pointRadius: "20", // sized according to type attribute\r
- fillColor: "${color}",\r
- fillOpacity: "${fillOpacity}",\r
- strokeColor: "${strokeColor}",\r
- strokeWidth: "${strokeWidth}",\r
- strokeDashstyle: "${strokeDashstyle}"\r
- }),\r
- "select": new OpenLayers.Style({\r
- fillColor: "##baa2e2",\r
- strokeColor: "#3399ff",\r
- fillOpacity: "0.5"\r
- })\r
- })\r
-\r
- pointLayer = new OpenLayers.Layer.Vector("Point Layer",{styleMap: myStyles,GROUP:"remote"});\r
- polygonLayer = new OpenLayers.Layer.Vector("Polygon Layer",{GROUP:"remote",styleMap: myStyles["first"]});\r
- \r
- polygonLayerControl=new OpenLayers.Control.DrawFeature(polygonLayer, OpenLayers.Handler.Polygon);\r
- map.addControl(polygonLayerControl);\r
- \r
- \r
- // toggle the queryEventHandler active state\r
- function toggleQueryMode()\r
- { \r
-\r
- if(featureInfo.active) {\r
- queryEventHandler.activate();\r
- }\r
- else {\r
- queryEventHandler.deactivate();\r
- }\r
- }\r
-\r
- \r
-\r
-\r
-\r
-function doGetFeatureInfo(evt) { \r
- \r
- var lonlat = map.getLonLatFromViewPortPx(evt.xy);\r
- //console.info(lonlat);\r
-/* alert("You clicked near " + lonlat.lat + " N, " +\r
- + lonlat.lon + " E");\r
-*/\r
- x = parseFloat(lonlat.lon); // make into floats\r
- y = parseFloat(lonlat.lat);\r
- if (ppol_query=="false")\r
- { \r
- var ul = new Array();// x, y\r
- var ur = new Array();\r
- var bl = new Array();\r
- var br = new Array();// x, y \r
- ul[0] = x-0.1;\r
- ul[1] = y+0.1;\r
- bl[0]= x-0.1;\r
- bl[1]= y-0.1;\r
- ur[0]= x+0.1;\r
- ur[1]= y +0.1;\r
- br[0] = x+0.1;\r
- br[1] = y-0.1;\r
- bbox=[];\r
- bbox.push(ul,bl,ur,br,ul); \r
- \r
-//console.log("ppol_query false");\r
- $.getScript('js_code/bind_results_sld.js');\r
- }\r
- else\r
- {\r
-//console.log("ppol_query true"); \r
- $.getScript('js_code/bind_results_ppol_adaptat.js'); \r
- }\r
- }\r
-\r
-/*\r
-map.addLayers([vlayer,edit_blank,edit_admin,shoreline,s_america1,s_america2,oceania1,oceania2]);\r
-shoreline.setVisibility(false);\r
-s_america1.setVisibility(false);s_america2.setVisibility(false);oceania1.setVisibility(false);oceania2.setVisibility(false);\r
- map.setBaseLayer(edit_blank);\r
- map.addLayer(edit_gbif);\r
- edit_gbif.setVisibility(false);\r
-\r
-map.setCenter(bounds.getCenterLonLat(),map.getZoomForExtent(bounds));\r
-*/\r
-\r
-queryEventHandler2 = new OpenLayers.Handler.Click({ 'map': map }, { ondblclick: \r
- function() {alert("dounle lick")}, 'click': function(e) {//\r
- \r
- doGetFeatureInfo(e); \r
- }}); \r
-\r
-queryEventHandler2 = new OpenLayers.Handler.Click({ 'map': map }, { ondblclick: \r
- function() {alert("dounle lick")}, 'click': function(e) {//\r
- //alert("dogetfeature"); \r
- doGetFeatureInfo(e); \r
- }});\r
- \r
-// toggle the queryEventHandler active state\r
- function toggleQueryMode()\r
- { \r
-\r
- if(featureInfo.active) {\r
- queryEventHandler.activate();\r
- } \r
- else {\r
- queryEventHandler.deactivate();\r
- }\r
- }\r
- function toggleQueryMode2()\r
- { \r
-\r
- if(featureInfo2.active) {\r
- queryEventHandler.activate();\r
- }\r
- else {\r
- queryEventHandler.deactivate();\r
- }\r
- }\r
-// map.zoomToMaxExtent(bounds);\r
-\r
- //l'ordre influeeeix!\r
-function serialize(feature) \r
- {\r
-\r
- queryEventHandler.deactivate();\r
-//function(evt) {alert ('You clicked on marker m1'); OpenLayers.Event.stop (evt); }\r
- \r
- var wkt= new OpenLayers.Format.WKT(map.baseLayer.projection);\r
- polygon = wkt.write(feature);\r
- $.getScript('js_code/polygon_q_adaptat.js');\r
-\r
- } \r
-\r
- var f_options = {\r
- hover: false,\r
-// highlightOnly: true,\r
- click:true,\r
- clickout: true,\r
- onSelect: serialize\r
- \r
- };\r
- \r
- feature_select = new OpenLayers.Control.SelectFeature(vlayer, f_options);\r
- //vlayer.events.register ('mouseout', vlayer, function() {alert("out")});\r
- // feature_select\r
- // OpenLayers.Feature.Vector.style['default']['strokeWidth'] = '2';\r
- function show_mouseover_text(evt)\r
- {\r
- textContent =\r
- "The mouse is over" +\r
- " feature '" + evt.feature.id + "'" +\r
- " of group '" + evt.name + "'.";\r
- // console.warn(textContent);\r
- }\r
-\r
-\r
- map.addControl(feature_select);\r
- \r
- var id=0;\r
- var gml_serialize=function (feature)\r
- {\r
- // alert("sfd");\r
-\r
- polygonLayer.setVisibility(true);\r
-\r
-\r
-\r
- if (polygonLayer.features.length == 0) {id=0; } else { id=(polygonLayer.features.length -1);}\r
- polygonLayer.features[id].fid=id;\r
-\r
- html='<div id="polygon_symbolize" class="jqmdTL" style="background-size: 40%; z-index: 300;"><div class="jqmdTR"><div class="jqmdTC jqDrag">POLYGON SYMBOLIZER TOOL</div><input type="image" class="jqmdX jqmClose"/>';\r
- html+='<form id="fill_form"><label>Polygon fill color<select style="margin-left:20px;"><option value="e4381b">red</option><option value="252ab6">blue</option><option value="617589">grey</option><option value="6ef028">green</option></select></form>';\r
- html+='<form id="opacity_form"><label>Polygon opacity<select style="margin-left:20px;"><option value="1">100%</option><option value="0.5">50%</option><option value="0.3">30%</option><option value="0.1">10%</option><option value="0.01">0%</option></select></form>';\r
- html+='<form id="stroke_width_form"><label>Stroke width<select style="margin-left:20px;"><option value="1">1</option><option value="2">2</option><option value="5">5</option></select></form>';\r
- html+='<form id="stroke_color_form"><label>Polygon stroke color<select style="margin-left:20px;"><option value="e4381b">red</option><option value="252ab6">blue</option><option value="617589">grey</option><option value="6ef028">green</option></select></form>';\r
- html+='<form id="stroke_opacity_form"><label>Stroke opacity<select style="margin-left:20px;"><option value="1">100%</option><option value="0.5">50%</option><option value="0">0%</option></select></form>';\r
- html+='<form id="stroke_style_form"><label>Stroke style<select style="margin-left:20px;"><option value="solid">solid</option><option value="2_3">dotted</option><option value="2_7">long dotted</option><option value="4_2">short dash</option><option value="5_7">dashed</option><option value="10_5">long dashed</option><option value="10_30">Very long dashed</option></select></form>';\r
- html+='<br><br><p>If desired, add a text to your polygon</p><br><TEXTAREA id="label" COLS=40 ROWS=3></TEXTAREA>';\r
- html+='<form id="text_size_form"><label>Select the text size <select style="margin-left:20px;"><option value="5">5</option><option value="10">10</option><option value="30">30</option><option value="40">40</option></select></form>';\r
- html+='</div><br> <input type="button" value="print it" id="serialize"/><div class="jqmdTC jqDrag">POLYGON SYMBOLIZER TOOL</div>';\r
-\r
- if ($('#fill_form').length > 0)\r
- {\r
- $('#ex4').empty(); \r
- $('#ex4').append(html);\r
- }\r
- else { $('#ex4').append(html);}\r
- $('input.jqmdX').hover(function(){\r
- $(this).addClass('jqmdXFocus')},function(){ $(this).removeClass('jqmdXFocus')}).focus(function(){this.hideFocus=true;$(this).addClass('jqmdXFocus')}).blur(function(){$(this).removeClass('jqmdXFocus')}).click(function(){$('#ex4').empty().hide();\r
- });\r
- msie=($.browser.msie==true)?true:false; \r
- if (msie)\r
- {\r
-\r
- $('input.jqmdX').css('background','url(http://edit.africamuseum.be/edit_wp5/geo/mapviewer/img/close.gif) no-repeat top left').css('width','15px');\r
- }\r
- else \r
- {\r
- $('input.jqmdX').css('background','url(http://edit.africamuseum.be/edit_wp5/geo/mapviewer/img/close.gif) no-repeat top left');\r
- }\r
- $('input.jqmdX').hover(function(){$(this).addClass('jqmdXFocus')},function(){ $(this).removeClass('jqmdXFocus')}).focus(function(){this.hideFocus=true;$(this).addClass('jqmdXFocus')}).blur(function(){$(this).removeClass('jqmdXFocus')}).click(function(){$('#ex2').hide(); \r
- });\r
- $("#ex4") .jqDrag('.jqDrag')\r
- .jqResize('.jqResize') ;\r
-\r
- $("#ex4").animate({width:'420',height:'415'},"slow");\r
-\r
- feature.attributes = {};\r
-\r
- $("#ex4 input:button").click(function()\r
- {\r
-\r
- //defining the Feature in GML\r
- feature.attributes['fill_color'] = $("#fill_form option:selected").val(); \r
- feature.attributes['fill_opacity'] = $("#opacity_form option:selected").val(); \r
- feature.attributes['stroke_color'] = $("#stroke_color_form option:selected").val();\r
- feature.attributes['stroke_opacity'] = $("#stroke_opacity_form option:selected").val();\r
- feature.attributes['stroke_width'] = $("#stroke_width_form option:selected").val();\r
- feature.attributes['text_size'] = $("#text_size_form option:selected").val();\r
- \r
-\r
-\r
- // = $("#stroke_style_form option:selected").val();\r
- switch ($("#stroke_style_form option:selected").val())\r
- {\r
- case 'solid': { feature.attributes['stroke_style']='no_style';break}\r
- case '2_3':{ feature.attributes['stroke_style']="2 3 2 3";break;} //short dotted \r
- case '2_7':{ feature.attributes['stroke_style']="2 7 2 7";break;} //long dotted\r
- case '4_2':{ feature.attributes['stroke_style']="4 2 4 2";break;}\r
- case '5_7':{feature.attributes['stroke_style']="5 7 5 7";break;}\r
- case '10_5':{ feature.attributes['stroke_style']="10 5 10 5";break;}\r
- case '10_30':{ feature.attributes['stroke_style']="10 30 10 30";break;} //very long dash\r
- }\r
- feature.attributes['label'] = $("#label").val();\r
- feature.attributes['id'] = id;\r
-\r
- //definint polygonLayer\r
- polygonLayer.features[id].attributes.color=$("#fill_form option:selected").val(); \r
- polygonLayer.features[id].attributes.fillOpacity=$("#opacity_form option:selected").val();\r
- polygonLayer.features[id].attributes.strokeColor=$("#stroke_color_form option:selected").val();\r
- polygonLayer.features[id].attributes.strokeWidth=$("#stroke_width_form option:selected").val();\r
- polygonLayer.features[id].attributes.strokeDashstyle=$("#stroke_style_form option:selected").val();\r
-\r
- polygonLayer.redraw();\r
- //g variable is... new OpenLayers.Format.GML(); \r
- var data = g.write(feature.layer.features); //ALL THE FEATURES will be written in g (& data) variable-->GML-->SLD\r
- //OpenLayers.Util.getElement("gml").value = data;\r
- var wkt= new OpenLayers.Format.WKT(map.baseLayer.projection);\r
- to_insert = wkt.write(feature);\r
-\r
- $.ajax({url:'http://edit.africamuseum.be/edit_wp5/geo/queries/data_insert.php',\r
- processData:false, type:'GET',dataType:'text',data:'data='+to_insert+'&gid='+id+'&user='+userid,success:function()\r
- {\r
- // alert("polygon inserted on dbase");\r
- //let's create SLD\r
- $.ajax({url:'http://edit.africamuseum.be/edit_wp5/geo/gml_sld.php',\r
- processData:false, type:'POST',dataType:'text',data:'data='+data+'&user='+userid,\r
- success:function(url)\r
- {\r
- serialized.params.SLD=url;\r
-serialized.params.GROUP='no_remote';\r
- if (serialized.map==null)\r
- {\r
- map.addLayer(serialized);\r
- }\r
- else{ \r
- serialized.redraw();\r
- }\r
- polygonLayer.setVisibility(false);\r
- }\r
- })\r
- }\r
- });\r
-\r
- $("input[name='Your symbolized polygons']").show().next().show();\r
- //var text = format.write(doc);\r
- })\r
-\r
- } //end serialize function\r
- vlayer.onFeatureInsert =function(){\r
- $("input[name='Polygon to query']").show().next().show();\r
- if (vlayer.features.length >1) {vlayer.destroyFeatures(vlayer.features[0])};\r
- ppol_query="false"; \r
-\r
- //user='no_user'; \r
-\r
- feature_select.activate();\r
- draw_to_query.deactivate();\r
-\r
-\r
- };\r
- polygonLayer.onFeatureInsert = gml_serialize;\r
- var select_options = {\r
- onClick: true,\r
- multiple:false,\r
- onUnselect:function(feature) {feature.selected=false;},\r
- onSelect: function(feature) { \r
- \r
- polygonLayer.setVisibility(true);\r
- feature.selected=true; \r
- html='<div class="jqmdTL" style="background-size: 40%; z-index: 300;"><div class="jqmdTR"><div class="jqmdTC jqDrag">HOLA</div><input type="image" class="jqmdX jqmClose"/>';\r
- html+='<b><div id="remove_div">Do you want to delete some polygon? if yes, you can select more than one (just click over it). Then, if really want to delete, just click';\r
- html+='<button id="delete" onclick="remove()" value="Delete them!">Delete them!</button></div>';\r
- \r
- if ($('#remove_div').length == 0)\r
- {\r
- $('#ex5').empty(); \r
- $('#ex5').append(html);\r
-\r
-msie=($.browser.msie==true)?true:false; \r
-if (msie)\r
-{$('input.jqmdX').css('background','url(http://edit.africamuseum.be/edit_wp5/geo/mapviewer/img/close.gif) no-repeat top left').css('width','15px');}\r
-else {$('input.jqmdX').css('background','url(http://edit.africamuseum.be/edit_wp5/geo/mapviewer/img/close.gif) no-repeat top left');}\r
-$('input.jqmdX').hover(function(){$(this).addClass('jqmdXFocus')},function(){ $(this).removeClass('jqmdXFocus')}).focus(function(){this.hideFocus=true;$(this).addClass('jqmdXFocus')}).blur(function(){$(this).removeClass('jqmdXFocus')}).click(function(){$('#ex2').hide(); });\r
-$("#ex5").animate({width:'280',height:'105'},"slow");\r
- }\r
- }\r
- }; //END OnSelect de select_options \r
- var select = new OpenLayers.Control.SelectFeature(polygonLayer, select_options);\r
- map.addControl(select);\r
- // select.activate(); \r
-\r
-\r
-\r
- v_options = {\r
- hover: true,\r
- onSelect: function(feature) { \r
- // console.warn(feature.attributes.code);\r
- if ($("#polygon_info").length)\r
- {\r
- $("#polygon_info tr").each(function(i)\r
- {\r
- $(this).remove();\r
-\r
-\r
- })\r
-\r
- $("#polygon_info tbody").append('<tr><td>Polygon code: </td><td>'+feature.attributes.code+'</td></tr><tr><td>Number of genus: </td><td>'+feature.attributes.numtax+'</td></tr><tr><td>Number of records: </td><td>'+feature.attributes.numreg+'</td></tr><tr><td>Taxa/record: </td><td>'+feature.attributes.taxa_record+'</td></tr>'); \r
-\r
-\r
- }\r
-\r
- }\r
- };\r
- function v_toggle(element) {\r
-\r
- if(element.checked==true) {\r
- vectors.params.filter="<Filter><And><PropertyIsEqualTo><PropertyName>userid</PropertyName><Literal>"+userid+"</Literal></PropertyIsEqualTo></And></Filter>";\r
- // v_select.activate();\r
- if ($("#interactive_analysis_input").hasClass("first"))\r
-\r
- {\r
-\r
- map.addLayer(vectors);\r
-\r
-\r
- $("#interactive_analysis_input").removeClass('first');\r
- }\r
- else { \r
-\r
- vectors.setVisibility(true);\r
-\r
- } \r
- v_select.activate();\r
-\r
- } \r
- else \r
- { \r
- vectors.setVisibility(false);\r
-\r
- v_select.deactivate();\r
- }\r
- }\r
- myStyles2 = new OpenLayers.StyleMap({\r
- "default": new OpenLayers.Style({ \r
- fillColor: "#ebbc1e",\r
- fillOpacity:0.25,\r
- strokeColor: "#242b32",\r
- strokeWidth: 1.5\r
- }),\r
- "select": new OpenLayers.Style({\r
- fillColor: "#ee3e3a", //vermell\r
- fillOpacity:0.5,\r
- strokeWidth: 2,\r
- strokeColor: "#3399ff"\r
- })\r
-\r
- });\r
-\r
-\r
- vectors = new OpenLayers.Layer.WFS(\r
- "My polygons to hover",\r
- "http://193.190.223.53:8080/geoserver/wfs",\r
- {typename: "topp:point_pol",\r
- filter:"<Filter><And><PropertyIsEqualTo><PropertyName>userid</PropertyName><Literal>"+userid+"</Literal></PropertyIsEqualTo></And></Filter>"},\r
- {isBaseLayer: false, extractAttributes: true, styleMap: myStyles2}\r
- );\r
- v_select = new OpenLayers.Control.SelectFeature(vectors, v_options);\r
- map.addControl(v_select);\r
- v_select.handlers.feature.stopDown = false;\r
-\r
- v_select.handlers.feature.stopUp = false;\r
-\r
- g = new OpenLayers.Format.GML();\r
-\r
-\r
-\r
- //polygonLayer.features.attributes.color='#f9cac3';\r
BGBM BDI Projects / geo.git / blobdiff