From 33b219223651665c4bf2f37f59b50cb3575c9189 Mon Sep 17 00:00:00 2001 From: edmarmoretti Date: Sun, 2 Apr 2017 23:29:13 -0300 Subject: [PATCH] Inclusão de botão, que abre a tela de configuração do plugin heatmap, no editor gráfico de mapfiles. --- admin/admin.db | Bin 340992 -> 0 bytes classesjs/classe_plugini3geo.js | 33 ++++++++++++++++----------------- ferramentas/atalhosedicao/index.js | 61 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ferramentas/atalhosedicao/template_mst.html | 7 +++++++ ferramentas/heatmap/googlemaps_js.php | 4 ++-- ferramentas/heatmap/openlayers_js.php | 6 +++--- ferramentas/markercluster/googlemaps_js.php | 4 ++-- ferramentas/markercluster/openlayers_js.php | 4 ++-- js/plugini3geo.js | 29 ++++++++++++++--------------- pacotes/heatmap/src/heatmap-openlayers.js | 47 +++++++++++++++++++++++++++++------------------ 10 files changed, 136 insertions(+), 59 deletions(-) diff --git a/admin/admin.db b/admin/admin.db index 2fa0ae3..6e1cf2e 100755 Binary files a/admin/admin.db and b/admin/admin.db differ diff --git a/classesjs/classe_plugini3geo.js b/classesjs/classe_plugini3geo.js index b01fa53..1d14b56 100755 --- a/classesjs/classe_plugini3geo.js +++ b/classesjs/classe_plugini3geo.js @@ -42,8 +42,6 @@ i3GEO.pluginI3geo = * * Utilizado no editor de mapfiles do sistema de administracao */ - //XXX criar plugin geojson - //XXX criar plugin que aceite um JSON generico PLUGINS : [ { "classe" : "heatmap", // namespace da classe @@ -224,25 +222,25 @@ i3GEO.pluginI3geo = parametros = config.parametros; ins += "" + "

Coluna que contém os dados:" - + "

" + + "' size='30'>

" + "

Ou valor numérico para cada ponto:" - + "

" + + "' size='30'>

" + "

Raio de cada ponto em pixels:" - + "

" + + "' size='30'>

" // + "

Valor máximo em cada ponto:" // + "

" + "

Tipo de gradiente (deixe vazio para utilizar as classes definidas no Layer ou escreva 'default' para usar o normal):" - + "

" + + "' size='30'>

" + "

Para definir os cortes no gradiente de cores utilize valores entre 0 e 1." + " As cores são definidas nas classes do LAYER, sendo que o nome define o valor superior do gradiente e COLOR define a cor." + " Veja o exemplo utilizado no tema _lmapadecalor.map

"; @@ -432,7 +430,9 @@ i3GEO.pluginI3geo = }; i3GEO.pluginI3geo.OBJETOS[camada.name] = heatmap; + objMapa.addLayer(heatmap); + heatmap.setDataSet(transformedTestData); heatmap_dados = null; @@ -510,13 +510,13 @@ i3GEO.pluginI3geo = parametros = config.parametros; ins += "" + "

Distância máxima entre ponto em pixels:" - + "

" + + "' size='30'>

" + "

Tipo de estilos (deixe vazio para utilizar as classes definidas no Layer ou escreva 'default' para usar o normal):" - + "

" + + "' size='30'>

" + "

Os símbolos utilizados podem ser customizados alterando-se as classes do Mapfile

" + "

Veja o exemplo utilizado no tema _lmapadecluster.map

"; @@ -737,7 +737,7 @@ i3GEO.pluginI3geo = 'Canvas', 'SVG' ], strategies : [ - new OpenLayers.Strategy.AnimatedCluster({ + new OpenLayers.Strategy.Cluster({ distance : parseInt(camada.plugini3geo.parametros.gridSize, 10) }) ], @@ -788,8 +788,7 @@ i3GEO.pluginI3geo = + "&g_sid=" + i3GEO.configura.sid + "&tipoEstilos=" - + camada.plugini3geo.parametros.tipoEstilos - + "&nomevariavel=markercluster_dados&nomevariavelConfig=markercluster_config"; + + camada.plugini3geo.parametros.tipoEstilos; i3GEO.util.scriptTag(p, criaLayer, nomeScript); } } diff --git a/ferramentas/atalhosedicao/index.js b/ferramentas/atalhosedicao/index.js index 290571a..9dc98db 100755 --- a/ferramentas/atalhosedicao/index.js +++ b/ferramentas/atalhosedicao/index.js @@ -215,6 +215,67 @@ i3GEOF.atalhosedicao = } }); $i("i3GEOFatalhosedicaoLayerkml-button").style.width = "200px"; + new YAHOO.widget.Button("i3GEOFatalhosedicaoMarkercluster", { + onclick : { + fn : function() { + i3GEO.temaAtivo = i3GEOF.atalhosedicao.tema; + YAHOO.namespace("admin"); + YAHOO.namespace("admin.container"); + core_montaEditor("","450px","500px","","Plugin",true,false,false); + var sUrl = i3GEO.configura.locaplic + "/admin1/catalogo/mapfile/exec.php?funcao=pegaPlugin&codigoMap="+i3GEO.temaAtivo+"&codigoLayer="+i3GEO.temaAtivo+"&g_sid="+i3GEO.configura.sid; + var montaEditorPlugin = function(retorno){ + var plugin = "markercluster"; + var ins = "" + + ""; + //pega os campos do formulario + ins += i3GEO.pluginI3geo.formAdmin(plugin,retorno); + var ajuda = "

Mais informações:
" + i3GEO.pluginI3geo.linkAjuda(plugin) + "

"; + $i("editor_bd").innerHTML = ins + ajuda; + + new YAHOO.widget.Button("salvarPlugin",{ onclick: { fn: function(){ + i3GEOF.atalhosedicao.salvarDadosEditorPlugin($i("editor_bd"),plugin,i3GEOF.atalhosedicao.tema,i3GEOF.atalhosedicao.tema); + } }}); + + new YAHOO.widget.Button("removerPlugin",{ onclick: { fn: function(){ + i3GEOF.atalhosedicao.salvarDadosEditorPlugin($i("editor_bd"),"",i3GEOF.atalhosedicao.tema,i3GEOF.atalhosedicao.tema); + } }}); + }; + core_pegaDados("",sUrl,montaEditorPlugin); + } + } + }); + $i("i3GEOFatalhosedicaoMarkercluster-button").style.width = "200px"; + + new YAHOO.widget.Button("i3GEOFatalhosedicaoHeatmap", { + onclick : { + fn : function() { + i3GEO.temaAtivo = i3GEOF.atalhosedicao.tema; + YAHOO.namespace("admin"); + YAHOO.namespace("admin.container"); + core_montaEditor("","450px","500px","","Plugin",true,false,false); + var sUrl = i3GEO.configura.locaplic + "/admin1/catalogo/mapfile/exec.php?funcao=pegaPlugin&codigoMap="+i3GEO.temaAtivo+"&codigoLayer="+i3GEO.temaAtivo+"&g_sid="+i3GEO.configura.sid; + var montaEditorPlugin = function(retorno){ + var plugin = "heatmap"; + var ins = "" + + ""; + //pega os campos do formulario + ins += i3GEO.pluginI3geo.formAdmin(plugin,retorno); + var ajuda = "

Mais informações:
" + i3GEO.pluginI3geo.linkAjuda(plugin) + "

"; + $i("editor_bd").innerHTML = ins + ajuda; + + new YAHOO.widget.Button("salvarPlugin",{ onclick: { fn: function(){ + i3GEOF.atalhosedicao.salvarDadosEditorPlugin($i("editor_bd"),plugin,i3GEOF.atalhosedicao.tema,i3GEOF.atalhosedicao.tema); + } }}); + + new YAHOO.widget.Button("removerPlugin",{ onclick: { fn: function(){ + i3GEOF.atalhosedicao.salvarDadosEditorPlugin($i("editor_bd"),"",i3GEOF.atalhosedicao.tema,i3GEOF.atalhosedicao.tema); + } }}); + }; + core_pegaDados("",sUrl,montaEditorPlugin); + } + } + }); + $i("i3GEOFatalhosedicaoHeatmap-button").style.width = "200px"; new YAHOO.widget.Button("i3GEOFatalhosedicaoTemaComGrafico", { onclick : { diff --git a/ferramentas/atalhosedicao/template_mst.html b/ferramentas/atalhosedicao/template_mst.html index 6a144bd..23bae13 100755 --- a/ferramentas/atalhosedicao/template_mst.html +++ b/ferramentas/atalhosedicao/template_mst.html @@ -94,4 +94,11 @@

+

+ +

+

+ +

+ \ No newline at end of file diff --git a/ferramentas/heatmap/googlemaps_js.php b/ferramentas/heatmap/googlemaps_js.php index 7168d0f..9a20e21 100755 --- a/ferramentas/heatmap/googlemaps_js.php +++ b/ferramentas/heatmap/googlemaps_js.php @@ -34,8 +34,8 @@ if(isset($map_file) && isset($postgis_mapa) && $map_file != ""){ restauraCon($map_file,$postgis_mapa); } -echo $nomevariavel.' = ['.implode(",",$resultado).'];'; -echo $nomevariavelConfig.' = '.$gradiente.';'; +echo 'heatmap_dados = ['.implode(",",$resultado).'];'; +echo 'heatmap_config = '.$gradiente.';'; if($carregajs === "sim"){ include_once($dir."/../../pacotes/heatmap/src/heatmap.js"); diff --git a/ferramentas/heatmap/openlayers_js.php b/ferramentas/heatmap/openlayers_js.php index d7c61ae..fec1204 100755 --- a/ferramentas/heatmap/openlayers_js.php +++ b/ferramentas/heatmap/openlayers_js.php @@ -59,10 +59,10 @@ if(isset($map_file) && isset($postgis_mapa) && $map_file != ""){ restauraCon($map_file,$postgis_mapa); } -echo $nomevariavel.' = ['.implode(",",$resultado).'];'; -echo $nomevariavelConfig.' = '.$gradiente.';'; +echo 'heatmap_dados = ['.implode(",",$resultado).'];'; +echo 'heatmap_config = '.$gradiente.';'; -if($carregajs === "sim"){ +if($_GET["carregajs"] === "sim"){ include_once($dir."/../../pacotes/heatmap/src/heatmap.js"); include_once($dir."/../../pacotes/heatmap/src/heatmap-openlayers.js"); } diff --git a/ferramentas/markercluster/googlemaps_js.php b/ferramentas/markercluster/googlemaps_js.php index 3bf045e..fc5c170 100755 --- a/ferramentas/markercluster/googlemaps_js.php +++ b/ferramentas/markercluster/googlemaps_js.php @@ -30,8 +30,8 @@ $map_file = markerclusterMapfile(); $resultado = markerclusterDados($map_file); $tipoEstilos = markerclusterEstilos($map_file,$layer,$tipoEstilos); -echo $nomevariavel.' = ['.implode(",",$resultado).'];'; -echo $nomevariavelConfig.' = '.$tipoEstilos.';'; +echo 'markercluster_dados = ['.implode(",",$resultado).'];'; +echo 'markercluster_config = '.$tipoEstilos.';'; if($carregajs === "sim"){ include_once($dir."/../../pacotes/markercluster/google/markerclusterer.js"); diff --git a/ferramentas/markercluster/openlayers_js.php b/ferramentas/markercluster/openlayers_js.php index 9fd96f6..bbc219c 100755 --- a/ferramentas/markercluster/openlayers_js.php +++ b/ferramentas/markercluster/openlayers_js.php @@ -46,8 +46,8 @@ if($map_file == ""){ $resultado = markerclusterDados($map_file); $tipoEstilos = markerclusterEstilos($map_file,$layer,$tipoEstilos); -echo $nomevariavel.' = ['.implode(",",$resultado).'];'; -echo $nomevariavelConfig.' = '.$tipoEstilos.';'; +echo 'markercluster_dados = ['.implode(",",$resultado).'];'; +echo 'markercluster_config = '.$tipoEstilos.';'; if($carregajs === "sim"){ include_once($dir."/../../pacotes/markercluster/openlayers/AnimatedCluster.js"); diff --git a/js/plugini3geo.js b/js/plugini3geo.js index 5ccf2ba..46b755f 100755 --- a/js/plugini3geo.js +++ b/js/plugini3geo.js @@ -229,25 +229,25 @@ i3GEO.pluginI3geo = parametros = config.parametros; ins += "" + "

Coluna que contém os dados:" - + "

" + + "' size='30'>

" + "

Ou valor numérico para cada ponto:" - + "

" + + "' size='30'>

" + "

Raio de cada ponto em pixels:" - + "

" + + "' size='30'>

" // + "

Valor máximo em cada ponto:" // + "

" + "

Tipo de gradiente (deixe vazio para utilizar as classes definidas no Layer ou escreva 'default' para usar o normal):" - + "

" + + "' size='30'>

" + "

Para definir os cortes no gradiente de cores utilize valores entre 0 e 1." + " As cores são definidas nas classes do LAYER, sendo que o nome define o valor superior do gradiente e COLOR define a cor." + " Veja o exemplo utilizado no tema _lmapadecalor.map

"; @@ -512,13 +512,13 @@ i3GEO.pluginI3geo = parametros = config.parametros; ins += "" + "

Distância máxima entre ponto em pixels:" - + "

" + + "' size='30'>

" + "

Tipo de estilos (deixe vazio para utilizar as classes definidas no Layer ou escreva 'default' para usar o normal):" - + "

" + + "' size='30'>

" + "

Os símbolos utilizados podem ser customizados alterando-se as classes do Mapfile

" + "

Veja o exemplo utilizado no tema _lmapadecluster.map

"; @@ -742,7 +742,7 @@ i3GEO.pluginI3geo = 'Canvas', 'SVG' ], strategies : [ - new OpenLayers.Strategy.AnimatedCluster({ + new OpenLayers.Strategy.Cluster({ distance : parseInt(camada.plugini3geo.parametros.gridSize, 10) }) ], @@ -793,8 +793,7 @@ i3GEO.pluginI3geo = + "&g_sid=" + i3GEO.configura.sid + "&tipoEstilos=" - + camada.plugini3geo.parametros.tipoEstilos - + "&nomevariavel=markercluster_dados&nomevariavelConfig=markercluster_config"; + + camada.plugini3geo.parametros.tipoEstilos; i3GEO.util.scriptTag(p, criaLayer, nomeScript); } } diff --git a/pacotes/heatmap/src/heatmap-openlayers.js b/pacotes/heatmap/src/heatmap-openlayers.js index 7096e9c..b17acc1 100755 --- a/pacotes/heatmap/src/heatmap-openlayers.js +++ b/pacotes/heatmap/src/heatmap-openlayers.js @@ -1,16 +1,16 @@ -/* +/* * heatmap.js OpenLayers Heatmap Class * * Copyright (c) 2011, Patrick Wied (http://www.patrick-wied.at) * Dual-licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) * and the Beerware (http://en.wikipedia.org/wiki/Beerware) license. - * + * * Modified on Jun,06 2011 by Antonio Santiago (http://www.acuriousanimal.com) * - Heatmaps as independent map layer. * - Points based on OpenLayers.LonLat. * - Data initialization in constructor. * - Improved 'addDataPoint' to add new lonlat based points. - */ + */ OpenLayers.Layer.Heatmap = OpenLayers.Class(OpenLayers.Layer, { // the heatmap isn't a basic layer by default - you usually want to display the heatmap over another map ;) isBaseLayer: false, @@ -34,18 +34,18 @@ OpenLayers.Layer.Heatmap = OpenLayers.Class(OpenLayers.Layer, { // create the heatmap with passed heatmap-options this.heatmap = h337.create(hmoptions); - handler = function(){ + handler = function(){ if(this.map && this.tmpData.max){ - this.updateLayer(); + this.updateLayer(); } }; - handler1 = function(){ + handler1 = function(){ if(this.tmpData && this.tmpData.max){ this.toggle(); this.updateLayer(); } }; - + // on zoomend and moveend we have to move the canvas element and redraw the datapoints with new positions //map.events.register("zoomend", this, handler); map.events.register("moveend", this, handler); @@ -53,16 +53,16 @@ OpenLayers.Layer.Heatmap = OpenLayers.Class(OpenLayers.Layer, { map.events.register( "removed", this, - function(){ + function(){ if(this.tmpData.max){ - this.destroy(); + this.destroy(); } }); }, updateLayer: function(){ var pixelOffset = this.getPixelOffset(), el = this.heatmap.get('element'); - // if the pixeloffset e.g. for x was positive move the canvas element to the left by setting left:-offset.y px + // if the pixeloffset e.g. for x was positive move the canvas element to the left by setting left:-offset.y px // otherwise move it the right by setting it a positive value. same for top el.style.top = ((pixelOffset.y > 0)?('-'+pixelOffset.y):(Math.abs(pixelOffset.y)))+'px'; el.style.left = ((pixelOffset.x > 0)?('-'+pixelOffset.x):(Math.abs(pixelOffset.x)))+'px'; @@ -80,9 +80,9 @@ OpenLayers.Layer.Heatmap = OpenLayers.Class(OpenLayers.Layer, { c_lonlat = new OpenLayers.LonLat(c.lon, c.lat), c_pixel = this.mapLayer.getViewPortPxFromLonLat(c_lonlat); - return { + return { x: o_pixel.x - c_pixel.x, - y: o_pixel.y - c_pixel.y + y: o_pixel.y - c_pixel.y }; }, @@ -90,20 +90,31 @@ OpenLayers.Layer.Heatmap = OpenLayers.Class(OpenLayers.Layer, { var set = {}, dataset = obj.data, dlen = dataset.length, - entry, lonlat, pixel; + entry, lonlat, pixel, proj, tproj, vp; set.max = obj.max; set.data = []; + // get the pixels for all the lonlat entries + proj = this.map.getProjectionObject(); + tproj = this.projection; while(dlen--){ - entry = dataset[dlen], - lonlat = entry.lonlat.clone().transform(this.projection, this.map.getProjectionObject()), - pixel = this.roundPixels(this.getViewPortPxFromLonLat(lonlat)); + entry = dataset[dlen]; + try{ + lonlat = entry.lonlat.clone().transform(tproj, proj); + if(lonlat){ + vp = this.getViewPortPxFromLonLat(lonlat); - if(pixel){ - set.data.push({x: pixel.x, y: pixel.y, count: entry.count}); + pixel = this.roundPixels(vp); + + if(pixel){ + set.data.push({x: pixel.x, y: pixel.y, count: entry.count}); + } + } } + catch(e){} } + this.tmpData = obj; this.heatmap.store.setDataSet(set); }, -- libgit2 0.21.2