Fábio Ribeiro / i3geo

Browse Code »

Commit ddb6f815d9c853a2e9376874582562fabeedf56d

Authored by Edmar Moretti 2014-04-16 20:18:12 +0000

1 parent 70a41f41

Exists in master and in 7 other branches

V6 - correção na ferramenta linha de tempo na versão OSM

Showing 1 changed file with 271 additions and 275 deletions Show diff stats

ferramentas/linhadotempo/index.php

Diff comments View file @ddb6f81

1	-<html>
2	-<head>
3	-<script src="../../classesjs/i3geo.js" type="text/javascript"></script>
4	-<script>
5	-Timeline_ajax_url="../../pacotes/simile/timeline_2.3.0/timeline_ajax/simile-ajax-api.js";
6	-Timeline_urlPrefix='../../pacotes/simile/timeline_2.3.0/timeline_js/';
7	-Timeline_parameters='bundle=true';
8	-</script>
9	-<script src="../../pacotes/simile/timeline_2.3.0/timeline_js/timeline-api.js" type="text/javascript"></script>
10	-<style>
11	-.timeline-band-1 .timeline-ether-bg
12	-{background-color:white;}
13	-.timeline-event-bubble-title
14	-{visibility:hidden;display:none;}
15	-</style>
16	-</head>
17	-<body onload="inicializa()" >
18	-<div class=paragrafo id="combotemas" >Aguarde</div>
19	-<div class=paragrafo id="totaleventos" style="position:absolute;top:30px;left:200px;"></div>
20	-<div class=paragrafo id="tl" style="height: 85%;width:100%; border: 1px solid #aaa;overflow-x:hidden; overflow-y:scroll"> </div>
21	-
22	-<script>
23	-/*
24	-Title: Linha do tempo
25	-
26	-Cria um gráfico de linha do tempo, tendo como base os atributos dos elementos de um tema visíveis na extensão geográfica
27	-do mapa atual. Para possibilitar a geração do gráfico, o layer deve estar configurado corretamente, contendo os METADATA
28	-específicos para essa ferramenta (veja o editor de mapfile do sistema de administração do i3Geo). Essa ferramenta é baseada
29	-no pacote TIMELINE, distribuído junto com o i3Geo.
30	-
31	-Veja:
32	-
33	-<i3GEO.analise.dialogo.linhaDoTempo>
34	-
35	-Arquivo:
36	-
37	-i3geo/ferramentas/linhadotempo/index.php
38	-
39	-Licenca:
40	-
41	-GPL2
42	-
43	-i3Geo Interface Integrada de Ferramentas de Geoprocessamento para Internet
44	-
45	-Direitos Autorais Reservados (c) 2006 Ministério do Meio Ambiente Brasil
46	-Desenvolvedor: Edmar Moretti edmar.moretti@gmail.com
47	-
48	-Este programa é software livre; você pode redistribuí-lo
49	-e/ou modificá-lo sob os termos da Licença Pública Geral
50	-GNU conforme publicada pela Free Software Foundation;
51	-
52	-Este programa é distribuído na expectativa de que seja útil,
53	-porém, SEM NENHUMA GARANTIA; nem mesmo a garantia implícita
54	-de COMERCIABILIDADE OU ADEQUAÇÃO A UMA FINALIDADE ESPECÍFICA.
55	-Consulte a Licença Pública Geral do GNU para mais detalhes.
56	-Você deve ter recebido uma cópia da Licença Pública Geral do
57	-GNU junto com este programa; se não, escreva para a
58	-Free Software Foundation, Inc., no endereço
59	-59 Temple Street, Suite 330, Boston, MA 02111-1307 USA.
60	-*/
61	-
62	-if(navm){
63	- i3GEO.janela.tempoMsg("o funcionamento da linha do tempo é muito melhor com o Firefox")
64	-}
65	-$i = function(id){
66	- return document.getElementById(id);
67	-};
68	-cpJSON = new cpaint();
69	-cpJSON.set_response_type("JSON");
70	-var tl;
71	-var eventSource1 = new Timeline.DefaultEventSource();
72	-
73	-/*
74	-Function: inicializa
75	-
76	-Inicializa a ferramenta construindo o combo para escolha do tema que será usado no gráfico
77	-
78	-Veja:
79	-
80	-<i3GEO.util.comboTemas>
81	-*/
82	-function inicializa(){
83	- document.body.className = "";
84	- document.body.style.background = "white";
85	- document.body.style.margin = "5px";
86	- i3GEO.arvoreDeCamadas.CAMADAS = window.parent.i3GEO.arvoreDeCamadas.CAMADAS;
87	- i3GEO.util.comboTemas(
88	- "tema",
89	- function(retorno){
90	- $i("combotemas").innerHTML = retorno.dados;
91	- if ($i("tema")){
92	- $i("tema").onchange = function(){
93	- if($i("tema").value === ""){return;}
94	- bandas();
95	- carregaDados();
96	- window.parent.i3GEO.mapa.ativaTema($i("tema").value);
97	- };
98	- }
99	- if(window.parent.i3GEO.temaAtivo !== ""){
100	- $i("tema").value = window.parent.i3GEO.temaAtivo;
101	- if($i("tema").value !== "")
102	- {$i("tema").onchange.call();}
103	- }
104	- },
105	- "combotemas",
106	- "",
107	- false,
108	- "linhaDoTempo"
109	- );
110	-}
111	-/*
112	-Function: bandas
113	-
114	-Cria o objeto bandInfos com os parâmetros necessários para a criação do gráfico
115	-*/
116	-function bandas(){
117	- tl_el = $i("tl");
118	- tl_el.innerHTML = "<span>"+$trad("o1")+"</span>";
119	- var theme1 = Timeline.ClassicTheme.create();
120	- theme1.event.bubble.width = 250;
121	- if(navn){
122	- theme1.autoWidth = false;
123	- bandInfos = [
124	- Timeline.createBandInfo({
125	- width: "20%",
126	- intervalUnit: Timeline.DateTime.DECADE,
127	- intervalPixels: 200,
128	- overview: true,
129	- eventSource: eventSource1
130	- }),
131	-
132	- Timeline.createBandInfo({
133	- width: "80%",
134	- intervalUnit: Timeline.DateTime.YEAR,
135	- intervalPixels: 200,
136	- eventSource: eventSource1,
137	- theme: theme1,
138	- layout: 'original' // original, overview, detailed
139	- })
140	- ];
141	- bandInfos[1].syncWith = 0;
142	- bandInfos[0].highlight = true;
143	- }
144	- else{
145	- theme1.autoWidth = false;
146	- bandInfos = [
147	- Timeline.createBandInfo({
148	- width: "100%",
149	- intervalUnit: Timeline.DateTime.DECADE,
150	- intervalPixels: 200,
151	- eventSource: eventSource1,
152	- theme: theme1,
153	- layout: 'original' // original, overview, detailed
154	- })
155	- ];
156	- }
157	- var url = '.'; // The base url for image, icon and background image
158	-}
159	-/*
160	-Function: carregaDados
161	-
162	-Obtém os dados que serão incluídos no gráfico. É criado o objeto Timeline chamado tl
163	-
164	-Veja:
165	-
166	-<DADOSLINHADOTEMPO>
167	-*/
168	-function carregaDados(){
169	- //alert(window.parent.i3GEO.parametros.mapexten)
170	- tl_el.innerHTML = "<span>"+$trad("o1")+"</span>";
171	- var retorna = function(retorno){
172	- //eventSource1.clear();
173	- if(retorno && retorno.data && retorno.data.events){
174	- if(retorno.data.events.length == 0){
175	- tl_el.innerHTML = "<span>"+$trad("x42")+" "+$i("tema").value+"</span>";
176	- }
177	- else{
178	- $i("totaleventos").innerHTML = retorno.data.events.length+" eventos";
179	- tl = Timeline.create(tl_el, bandInfos, Timeline.HORIZONTAL);
180	- eventSource1.loadJSON(retorno.data, '.'); // The data was stored into the
181	- tl.layout(); // display the Timeline
182	- tl.getBand(0).scrollToCenter(Timeline.DateTime.parseGregorianDateTime(retorno.data.maiorano));
183	- }
184	- }
185	- else{
186	- tl_el.innerHTML = "<span>"+$trad("x42")+" "+$i("tema").value+"</span>";
187	- }
188	- }
189	- var p = window.parent.i3GEO.configura.locaplic+"/classesphp/mapa_controle.php?funcao=dadosLinhaDoTempo&g_sid="+window.parent.i3GEO.configura.sid+"&tema="+$i("tema").value+"&ext="+window.parent.i3GEO.parametros.mapexten;
190	- cpJSON.call(p,"void",retorna);
191	-}
192	-/*
193	-Function: tituloover
194	-
195	-Indica no mapa a localização de um evento quando o usuário passa o mouse sobre o título de um evento
196	-
197	-Parametro:
198	-
199	-wkt {String} - coordenadas do evento no formato WKT
200	-*/
201	-function tituloover(wkt){
202	- try{
203	- if(!window.parent){return;}
204	- if(!window.parent.i3GEO){return;}
205	- if(!window.parent.i3GEO.calculo){return;}
206	- }
207	- catch(e){if(typeof(console) !== 'undefined'){console.error(e);};return;}
208	-
209	- re = new RegExp("POINT", "g");
210	- wkt = wkt.replace(re,"");
211	- wkt = wkt.split("(")[1].split(")")[0];
212	- wkt = wkt.split(" ");
213	-
214	- var xy = window.parent.i3GEO.calculo.dd2tela(wkt[0],wkt[1],window.parent.document.getElementById(window.parent.i3GEO.Interface.IDMAPA),window.parent.i3GEO.parametros.mapexten,window.parent.i3GEO.parametros.pixelsize)
215	-
216	- window.parent.i3GEO.util.criaPin('marcaIdentifica',window.parent.i3GEO.configura.locaplic+"/imagens/marker.png","21px","25px");
217	- var i = window.parent.document.getElementById('marcaIdentifica')
218	- i.style.top = xy[1]-25+"px";
219	- i.style.left = xy[0]-10+"px";
220	- i.style.display = "block"
221	-}
222	-/*
223	-Function: tituloclique
224	-
225	-Seleciona os elementos do tema ativo com base na coordenada do evento
226	-
227	-Parametro:
228	-
229	-wkt {String} - coordenadas do evento no formato WKT
230	-*/
231	-function tituloclique(wkt){
232	- try{
233	- if(!window.parent){return;}
234	- if(!window.parent.i3GEO){return;}
235	- if(!window.parent.i3GEO.calculo){return;}
236	- }
237	- catch(e){if(typeof(console) !== 'undefined'){console.error(e);};return;}
238	- re = new RegExp("POINT", "g");
239	- wkt = wkt.replace(re,"");
240	- wkt = wkt.split("(")[1].split(")")[0];
241	- wkt = wkt.split(" ");
242	- var retorna = function(retorno)
243	- {
244	- window.parent.i3GEO.atualiza(retorno);
245	- window.parent.i3GEO.Interface.atualizaTema(retorno,$i("tema").value);
246	- };
247	-
248	- //window.parent.i3GEO.janela.abreAguarde("i3GEO.atualiza",$trad("o1"));
249	- window.parent.i3GEO.php.selecaopt(retorna,$i("tema").value,wkt[0]+" "+wkt[1],"adiciona",0);
250	-}
251	-/*
252	-Function: tituloout
253	-
254	-Remove do mapa a marca de localização do evento quando o usuário move o mouse para fora do título do evento
255	-
256	-*/
257	-function tituloout(){
258	- window.parent.i3GEO.util.escondePin();
259	-}
260	-/*
261	-Function: onResize
262	-
263	-Modifica o tamanho da linha do tempo se a janela da ferramenta tiver seu tamanho modificado
264	-*/
265	-function onResize() {
266	- if (resizeTimerID != undefined && resizeTimerID == null) {
267	- resizeTimerID = window.setTimeout(function() {
268	- resizeTimerID = null;
269	- tl.layout();
270	- }, 500);
271	- }
272	-}
273	-</script>
274	-</body>
275	-	1	+<html>
		2	+<head>
		3	+<script src="../../classesjs/i3geo.js" type="text/javascript"></script>
		4	+<script>
		5	+Timeline_ajax_url="../../pacotes/simile/timeline_2.3.0/timeline_ajax/simile-ajax-api.js";
		6	+Timeline_urlPrefix='../../pacotes/simile/timeline_2.3.0/timeline_js/';
		7	+Timeline_parameters='bundle=true';
		8	+</script>
		9	+<script src="../../pacotes/simile/timeline_2.3.0/timeline_js/timeline-api.js" type="text/javascript"></script>
		10	+<style>
		11	+.timeline-band-1 .timeline-ether-bg
		12	+{background-color:white;}
		13	+.timeline-event-bubble-title
		14	+{visibility:hidden;display:none;}
		15	+</style>
		16	+</head>
		17	+<body onload="inicializa()" onresize="onResize()">
		18	+<div class=paragrafo id="combotemas" ></div>
		19	+<div class=paragrafo id="totaleventos" ></div>
		20	+<div class=paragrafo id="tl" style="height: 220px; border: 1px solid #aaa;overflow-x:hidden; overflow-y:scroll"> </div>
		21	+
		22	+<script>
		23	+/*
		24	+Title: Linha do tempo
		25	+
		26	+Cria um gráfico de linha do tempo, tendo como base os atributos dos elementos de um tema visíveis na extensão geográfica
		27	+do mapa atual. Para possibilitar a geração do gráfico, o layer deve estar configurado corretamente, contendo os METADATA
		28	+específicos para essa ferramenta (veja o editor de mapfile do sistema de administração do i3Geo). Essa ferramenta é baseada
		29	+no pacote TIMELINE, distribuído junto com o i3Geo.
		30	+
		31	+Veja:
		32	+
		33	+<i3GEO.analise.dialogo.linhaDoTempo>
		34	+
		35	+Arquivo:
		36	+
		37	+i3geo/ferramentas/linhadotempo/index.php
		38	+
		39	+Licenca:
		40	+
		41	+GPL2
		42	+
		43	+i3Geo Interface Integrada de Ferramentas de Geoprocessamento para Internet
		44	+
		45	+Direitos Autorais Reservados (c) 2006 Ministério do Meio Ambiente Brasil
		46	+Desenvolvedor: Edmar Moretti edmar.moretti@gmail.com
		47	+
		48	+Este programa é software livre; você pode redistribuí-lo
		49	+e/ou modificá-lo sob os termos da Licença Pública Geral
		50	+GNU conforme publicada pela Free Software Foundation;
		51	+
		52	+Este programa é distribuído na expectativa de que seja útil,
		53	+porém, SEM NENHUMA GARANTIA; nem mesmo a garantia implícita
		54	+de COMERCIABILIDADE OU ADEQUAÇÃO A UMA FINALIDADE ESPECÍFICA.
		55	+Consulte a Licença Pública Geral do GNU para mais detalhes.
		56	+Você deve ter recebido uma cópia da Licença Pública Geral do
		57	+GNU junto com este programa; se não, escreva para a
		58	+Free Software Foundation, Inc., no endereço
		59	+59 Temple Street, Suite 330, Boston, MA 02111-1307 USA.
		60	+*/
		61	+
		62	+if(navm){
		63	+ i3GEO.janela.tempoMsg("o funcionamento da linha do tempo é muito melhor com o Firefox")
		64	+}
		65	+$i = function(id){
		66	+ return document.getElementById(id);
		67	+};
		68	+cpJSON = new cpaint();
		69	+cpJSON.set_response_type("JSON");
		70	+var tl;
		71	+var eventSource1 = new Timeline.DefaultEventSource();
		72	+
		73	+/*
		74	+Function: inicializa
		75	+
		76	+Inicializa a ferramenta construindo o combo para escolha do tema que será usado no gráfico
		77	+
		78	+Veja:
		79	+
		80	+<i3GEO.util.comboTemas>
		81	+*/
		82	+function inicializa(){
		83	+ document.body.className = "";
		84	+ document.body.style.background = "white";
		85	+ document.body.style.margin = "5px";
		86	+ i3GEO.arvoreDeCamadas.CAMADAS = window.parent.i3GEO.arvoreDeCamadas.CAMADAS;
		87	+ i3GEO.util.comboTemas(
		88	+ "tema",
		89	+ function(retorno){
		90	+ $i("combotemas").innerHTML = retorno.dados;
		91	+ if ($i("tema")){
		92	+ $i("tema").onchange = function(){
		93	+ if($i("tema").value === ""){return;}
		94	+ bandas();
		95	+ carregaDados();
		96	+ window.parent.i3GEO.mapa.ativaTema($i("tema").value);
		97	+ };
		98	+ }
		99	+ if(window.parent.i3GEO.temaAtivo !== ""){
		100	+ $i("tema").value = window.parent.i3GEO.temaAtivo;
		101	+ if($i("tema").value !== "")
		102	+ {$i("tema").onchange.call();}
		103	+ }
		104	+ },
		105	+ "combotemas",
		106	+ "",
		107	+ false,
		108	+ "linhaDoTempo"
		109	+ );
		110	+}
		111	+/*
		112	+Function: bandas
		113	+
		114	+Cria o objeto bandInfos com os parâmetros necessários para a criação do gráfico
		115	+*/
		116	+function bandas(){
		117	+ tl_el = $i("tl");
		118	+ tl_el.innerHTML = "<span style=color:red; >"+$trad("o1")+"</span>";
		119	+ var theme1 = Timeline.ClassicTheme.create();
		120	+ theme1.event.bubble.width = 250;
		121	+ if(navn){
		122	+ theme1.autoWidth = false;
		123	+ bandInfos = [
		124	+ Timeline.createBandInfo({
		125	+ width: "20%",
		126	+ intervalUnit: Timeline.DateTime.DECADE,
		127	+ intervalPixels: 200,
		128	+ overview: true,
		129	+ eventSource: eventSource1
		130	+ }),
		131	+
		132	+ Timeline.createBandInfo({
		133	+ width: "80%",
		134	+ intervalUnit: Timeline.DateTime.YEAR,
		135	+ intervalPixels: 200,
		136	+ eventSource: eventSource1,
		137	+ theme: theme1,
		138	+ layout: 'original' // original, overview, detailed
		139	+ })
		140	+ ];
		141	+ bandInfos[1].syncWith = 0;
		142	+ bandInfos[0].highlight = true;
		143	+ }
		144	+ else{
		145	+ theme1.autoWidth = false;
		146	+ bandInfos = [
		147	+ Timeline.createBandInfo({
		148	+ width: "100%",
		149	+ intervalUnit: Timeline.DateTime.DECADE,
		150	+ intervalPixels: 200,
		151	+ eventSource: eventSource1,
		152	+ theme: theme1,
		153	+ layout: 'original' // original, overview, detailed
		154	+ })
		155	+ ];
		156	+ }
		157	+ var url = '.'; // The base url for image, icon and background image
		158	+}
		159	+/*
		160	+Function: carregaDados
		161	+
		162	+Obtém os dados que serão incluídos no gráfico. É criado o objeto Timeline chamado tl
		163	+
		164	+Veja:
		165	+
		166	+<DADOSLINHADOTEMPO>
		167	+*/
		168	+function carregaDados(){
		169	+ //alert(window.parent.i3GEO.parametros.mapexten)
		170	+ tl_el.innerHTML = "<span style=color:red; >"+$trad("o1")+"</span>";
		171	+ var retorna = function(retorno){
		172	+ eventSource1.clear();
		173	+ $i("totaleventos").innerHTML = retorno.data.events.length+" eventos";
		174	+ tl = Timeline.create(tl_el, bandInfos, Timeline.HORIZONTAL);
		175	+ eventSource1.loadJSON(retorno.data, '.'); // The data was stored into the
		176	+ tl.layout(); // display the Timeline
		177	+ tl.getBand(0).scrollToCenter(Timeline.DateTime.parseGregorianDateTime(retorno.data.maiorano));
		178	+ }
		179	+ var ext = window.parent.i3GEO.util.extOSM2Geo(window.parent.i3GEO.parametros.mapexten);
		180	+ var p = window.parent.i3GEO.configura.locaplic+"/classesphp/mapa_controle.php?funcao=dadosLinhaDoTempo&g_sid="+window.parent.i3GEO.configura.sid+"&tema="+$i("tema").value+"&ext="+ext;
		181	+ cpJSON.call(p,"void",retorna);
		182	+}
		183	+/*
		184	+Function: tituloover
		185	+
		186	+Indica no mapa a localização de um evento quando o usuário passa o mouse sobre o título de um evento
		187	+
		188	+Parametro:
		189	+
		190	+wkt {String} - coordenadas do evento no formato WKT
		191	+*/
		192	+function tituloover(wkt){
		193	+ //@FIXME nao funciona no OSM
		194	+ if(window.parent.i3GEO.Interface.openlayers.googleLike === true){
		195	+ return;
		196	+ }
		197	+ try{
		198	+ if(!window.parent){return;}
		199	+ if(!window.parent.i3GEO){return;}
		200	+ if(!window.parent.i3GEO.calculo){return;}
		201	+ }
		202	+ catch(e){if(typeof(console) !== 'undefined'){console.error(e);};return;}
		203	+
		204	+ re = new RegExp("POINT", "g");
		205	+ wkt = wkt.replace(re,"");
		206	+ wkt = wkt.split("(")[1].split(")")[0];
		207	+ wkt = wkt.split(" ");
		208	+
		209	+ var ext = window.parent.i3GEO.util.extOSM2Geo(window.parent.i3GEO.parametros.mapexten);
		210	+ var xy = window.parent.i3GEO.calculo.dd2tela(wkt[0],wkt[1],window.parent.document.getElementById(window.parent.i3GEO.Interface.IDMAPA),ext,window.parent.i3GEO.parametros.pixelsize)
		211	+
		212	+ window.parent.i3GEO.util.criaPin('marcaIdentifica',window.parent.i3GEO.configura.locaplic+"/imagens/marker.png","21px","25px");
		213	+ var i = window.parent.document.getElementById('marcaIdentifica')
		214	+ i.style.top = xy[1]-25+"px";
		215	+ i.style.left = xy[0]-10+"px";
		216	+ i.style.display = "block"
		217	+}
		218	+/*
		219	+Function: tituloclique
		220	+
		221	+Seleciona os elementos do tema ativo com base na coordenada do evento
		222	+
		223	+Parametro:
		224	+
		225	+wkt {String} - coordenadas do evento no formato WKT
		226	+*/
		227	+function tituloclique(wkt){
		228	+ try{
		229	+ if(!window.parent){return;}
		230	+ if(!window.parent.i3GEO){return;}
		231	+ if(!window.parent.i3GEO.calculo){return;}
		232	+ }
		233	+ catch(e){if(typeof(console) !== 'undefined'){console.error(e);};return;}
		234	+ re = new RegExp("POINT", "g");
		235	+ wkt = wkt.replace(re,"");
		236	+ wkt = wkt.split("(")[1].split(")")[0];
		237	+ wkt = wkt.split(" ");
		238	+ var retorna = function(retorno)
		239	+ {
		240	+ window.parent.i3GEO.atualiza(retorno);
		241	+ window.parent.i3GEO.Interface.atualizaTema(retorno,$i("tema").value);
		242	+ };
		243	+
		244	+ //window.parent.i3GEO.janela.abreAguarde("i3GEO.atualiza",$trad("o1"));
		245	+ window.parent.i3GEO.php.selecaopt(retorna,$i("tema").value,wkt[0]+" "+wkt[1],"adiciona",0);
		246	+}
		247	+/*
		248	+Function: tituloout
		249	+
		250	+Remove do mapa a marca de localização do evento quando o usuário move o mouse para fora do título do evento
		251	+
		252	+*/
		253	+function tituloout(){
		254	+ window.parent.i3GEO.util.escondePin();
		255	+}
		256	+/*
		257	+Function: onResize
		258	+
		259	+Modifica o tamanho da linha do tempo se a janela da ferramenta tiver seu tamanho modificado
		260	+*/
		261	+function onResize() {
		262	+ if (resizeTimerID == null) {
		263	+ resizeTimerID = window.setTimeout(function() {
		264	+ resizeTimerID = null;
		265	+ tl.layout();
		266	+ }, 500);
		267	+ }
		268	+ }
		269	+</script>
		270	+</body>
		271	+
276	</html>	272	</html>
277	\ No newline at end of file	273	\ No newline at end of file