Commit 575582072a03d2e575175b2040788b5df2bca92b
1 parent
39298fd9
Exists in
master
and in
7 other branches
Novos exemplos de customização
Showing
8 changed files
with
295 additions
and
0 deletions
Show diff stats
admin/admin.db
No preview for this file type
@@ -0,0 +1,76 @@ | @@ -0,0 +1,76 @@ | ||
1 | +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/strict.dtd"> | ||
2 | +<html> | ||
3 | +<head> | ||
4 | +<meta http-equiv="Category" content="i3Geo Mapa interativo MMA geoprocessamento sig mobile"> | ||
5 | +<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1"> | ||
6 | +<title>i3GEO - OpenLayers</title> | ||
7 | +<script src="../classesjs/i3geonaocompacto.js"></script> | ||
8 | +<script src="../pacotes/openlayers/OpenLayers2131.js"></script> | ||
9 | +<link rel="stylesheet" type="text/css" href="../css/black.css"> | ||
10 | +</head> | ||
11 | +<body style='margin-left:7px;background:white;' class=yui-skin-sam > | ||
12 | +<div style="top:50px;"> | ||
13 | +<div id="arvoreDeCamadas" style="width:250px;height:400px;border:1px solid;float:left;"> | ||
14 | + | ||
15 | +</div> | ||
16 | +<div id=i3geo > | ||
17 | +<div id=corpoMapa style="left:255px;width:700px;height:400px;background-image:url('../imagens/i3geo1bw.jpg');"> | ||
18 | +</div> | ||
19 | +</div> | ||
20 | +</div> | ||
21 | +<div id="logMapa" ></div> | ||
22 | +<script> | ||
23 | +/************ | ||
24 | +Antes de iniciar a arvore de camadas, os parametros de configuracao podem ser alterados para ajustar a arvore. | ||
25 | + | ||
26 | +Nesse mapa os parametros sao ajustados separadamente indicando quais as funcoes que operam sobre cada camada | ||
27 | +serao ou nao mostradas. | ||
28 | + | ||
29 | +Mais detalhes em: | ||
30 | + | ||
31 | + http://localhost/i3geo/documentacao/files/classesjs/classe_arvoredecamadas-js.html | ||
32 | + | ||
33 | +************/ | ||
34 | + | ||
35 | +i3GEO.idioma.MOSTRASELETOR = false; //para nao mostrar as bandeiras de escolha do idioma | ||
36 | +//parametros de configuracao da arvore | ||
37 | +i3GEO.arvoreDeCamadas.EXPANDIDA = true; | ||
38 | +//opcoes da barra de icones principal | ||
39 | +i3GEO.arvoreDeCamadas.LIGARDESLIGARTODOS = false; | ||
40 | +//opcoes dos nos abaixo de cada tema | ||
41 | +i3GEO.arvoreDeCamadas.FUNCOES = { | ||
42 | + farolescala : false, | ||
43 | + excluir : false, | ||
44 | + sobe : false, | ||
45 | + desce : false, | ||
46 | + fonte : true, | ||
47 | + zoomtema : true, | ||
48 | + compartilhar : true, | ||
49 | + opacidade : false, | ||
50 | + mudanome : false, | ||
51 | + procurar : false, | ||
52 | + toponimia : false, | ||
53 | + etiquetas : false, | ||
54 | + filtrar : false, | ||
55 | + tabela : true, | ||
56 | + grafico : false, | ||
57 | + editorlegenda : false, | ||
58 | + destacar : false, | ||
59 | + cortina : false, | ||
60 | + sql : false, | ||
61 | + comentar : false, | ||
62 | + temporizador : false, | ||
63 | + wms : false, | ||
64 | + tme : false, | ||
65 | + copia : false | ||
66 | + }; | ||
67 | + | ||
68 | +i3GEO.finalizaAPI = function(){ | ||
69 | + i3GEO.arvoreDeCamadas.inicia("arvoreDeCamadas"); | ||
70 | +}; | ||
71 | +i3GEO.cria(); | ||
72 | +i3GEO.inicia(); | ||
73 | + | ||
74 | +</script> | ||
75 | +</body> | ||
76 | +</html> |
@@ -0,0 +1,45 @@ | @@ -0,0 +1,45 @@ | ||
1 | +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/strict.dtd"> | ||
2 | +<html> | ||
3 | +<head> | ||
4 | +<meta http-equiv="Category" content="i3Geo Mapa interativo MMA geoprocessamento sig mobile"> | ||
5 | +<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1"> | ||
6 | +<title>i3GEO - OpenLayers</title> | ||
7 | +<script src="../classesjs/i3geonaocompacto.js"></script> | ||
8 | +<script src="../pacotes/openlayers/OpenLayers2131.js"></script> | ||
9 | +<link rel="stylesheet" type="text/css" href="../css/black.css"> | ||
10 | +</head> | ||
11 | +<body style='margin-left:7px;background:white;' class=yui-skin-sam > | ||
12 | +<div style="top:50px;"> | ||
13 | + <div id="arvoreDeCamadas" style="width:250px;height:400px;border:1px solid;float:left;overflow:auto;"> | ||
14 | + | ||
15 | + </div> | ||
16 | + <div id=i3geo > | ||
17 | + <div id=corpoMapa style="left:255px;width:700px;height:400px;background-image:url('../imagens/i3geo1bw.jpg');"> | ||
18 | + </div> | ||
19 | + </div> | ||
20 | +</div> | ||
21 | +<div id="logMapa" ></div> | ||
22 | +<script> | ||
23 | +/************ | ||
24 | +Ajustando-se os parametros e possivel simplificar bastante a arvore. | ||
25 | + | ||
26 | +Nesse mapa apenas a legenda em cada tema pode ser mostrada. | ||
27 | + | ||
28 | +************/ | ||
29 | + | ||
30 | +i3GEO.idioma.MOSTRASELETOR = false; //para nao mostrar as bandeiras de escolha do idioma | ||
31 | +//parametros de configuracao da arvore | ||
32 | +i3GEO.arvoreDeCamadas.EXPANDIDA = true; | ||
33 | +i3GEO.arvoreDeCamadas.OPCOESICONES = false; | ||
34 | +i3GEO.arvoreDeCamadas.OPCOESTEMAS = false; | ||
35 | +i3GEO.arvoreDeCamadas.OPCOESARVORE = false; | ||
36 | +i3GEO.arvoreDeCamadas.EXPANDESOLEGENDA = false; | ||
37 | +i3GEO.finalizaAPI = function(){ | ||
38 | + i3GEO.arvoreDeCamadas.inicia("arvoreDeCamadas"); | ||
39 | +}; | ||
40 | +i3GEO.cria(); | ||
41 | +i3GEO.inicia(); | ||
42 | + | ||
43 | +</script> | ||
44 | +</body> | ||
45 | +</html> |
@@ -0,0 +1,63 @@ | @@ -0,0 +1,63 @@ | ||
1 | +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/strict.dtd"> | ||
2 | +<html> | ||
3 | +<head> | ||
4 | +<meta http-equiv="Category" content="i3Geo Mapa interativo MMA geoprocessamento sig mobile"> | ||
5 | +<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1"> | ||
6 | +<title>i3GEO - OpenLayers</title> | ||
7 | +<script src="../classesjs/i3geonaocompacto.js"></script> | ||
8 | +<script src="../pacotes/openlayers/OpenLayers2131.js"></script> | ||
9 | +<link rel="stylesheet" type="text/css" href="../css/black.css"> | ||
10 | +</head> | ||
11 | +<body style='margin-left:7px;background:white;' class=yui-skin-sam > | ||
12 | +<div style="top:50px;"> | ||
13 | + <div id="arvoreDeCamadas" style="width:250px;height:400px;border:1px solid;float:left;overflow:auto;"> | ||
14 | + | ||
15 | + </div> | ||
16 | + <div id=i3geo > | ||
17 | + <div id=corpoMapa style="left:255px;width:700px;height:400px;background-image:url('../imagens/i3geo1bw.jpg');"> | ||
18 | + </div> | ||
19 | + </div> | ||
20 | +</div> | ||
21 | +<div id="logMapa" ></div> | ||
22 | +<style> | ||
23 | +a.ygtvspacer, .ygtvdepthcell, .ygtvtm, .ygtvln, .ygtvtn, .ygtvlm { | ||
24 | + display: none; | ||
25 | + outline-style: none; | ||
26 | + text-decoration: none; | ||
27 | +} | ||
28 | +.ygtvchildren { | ||
29 | + margin-left:5px; | ||
30 | +} | ||
31 | +.legendatemas .inputsb { | ||
32 | + display:none; | ||
33 | +} | ||
34 | +</style> | ||
35 | +<script> | ||
36 | +/************ | ||
37 | +A arvore pode mostrar apenas a legenda e iniciar expandida. | ||
38 | + | ||
39 | +Novas camadas podem ser adicionadas ao mapa indicando-se seus codigos em variaveis especiais da classe "mapa" | ||
40 | + | ||
41 | +Controlando-se os estilos, pode-se evitar que sejam mostradas as linhas entre os nos e outros elementos. | ||
42 | + | ||
43 | +************/ | ||
44 | + | ||
45 | +i3GEO.idioma.MOSTRASELETOR = false; //para nao mostrar as bandeiras de escolha do idioma | ||
46 | +//camadas adicionais e quais ficarao visiveis | ||
47 | +i3GEO.mapa.TEMASINICIAIS = "_lbiomashp,_llocali"; | ||
48 | +i3GEO.mapa.TEMASINICIAISLIGADOS = "_lbiomashp"; | ||
49 | +//parametros de configuracao da arvore | ||
50 | +i3GEO.arvoreDeCamadas.EXPANDIDA = true; | ||
51 | +i3GEO.arvoreDeCamadas.OPCOESICONES = false; | ||
52 | +i3GEO.arvoreDeCamadas.OPCOESTEMAS = false; | ||
53 | +i3GEO.arvoreDeCamadas.OPCOESARVORE = false; | ||
54 | +i3GEO.arvoreDeCamadas.EXPANDESOLEGENDA = true; | ||
55 | +i3GEO.finalizaAPI = function(){ | ||
56 | + i3GEO.arvoreDeCamadas.inicia("arvoreDeCamadas"); | ||
57 | +}; | ||
58 | +i3GEO.cria(); | ||
59 | +i3GEO.inicia(); | ||
60 | + | ||
61 | +</script> | ||
62 | +</body> | ||
63 | +</html> |
@@ -0,0 +1,53 @@ | @@ -0,0 +1,53 @@ | ||
1 | +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/strict.dtd"> | ||
2 | +<html> | ||
3 | +<head> | ||
4 | +<meta http-equiv="Category" content="i3Geo Mapa interativo MMA geoprocessamento sig mobile"> | ||
5 | +<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1"> | ||
6 | +<title>i3GEO - OpenLayers</title> | ||
7 | +<script src="../classesjs/i3geonaocompacto.js"></script> | ||
8 | +<script src="../pacotes/openlayers/OpenLayers2131.js"></script> | ||
9 | +<link rel="stylesheet" type="text/css" href="../css/black.css"> | ||
10 | +</head> | ||
11 | +<body style='margin-left:7px;background:white;' class=yui-skin-sam > | ||
12 | +<div style="top:50px;"> | ||
13 | +<div id="arvoreDeCamadas" style="width:250px;height:400px;border:1px solid;float:left;"> | ||
14 | + | ||
15 | +</div> | ||
16 | +<div id=i3geo > | ||
17 | +<div id=corpoMapa style="left:255px;width:700px;height:400px;background-image:url('../imagens/i3geo1bw.jpg');"> | ||
18 | +</div> | ||
19 | +</div> | ||
20 | +</div> | ||
21 | +<div id="logMapa" ></div> | ||
22 | +<script> | ||
23 | +/************ | ||
24 | +Alguns componentes sao normalmente inseridos nas guias laterais ou moveis. Esses | ||
25 | +componentes podem ser inseridos tambem em outros lugares. | ||
26 | + | ||
27 | +Como o i3Geo faz requisicoes assincronas, para iniciar esses componentes e necessario esperar o retorno | ||
28 | +dessas requisicoes. | ||
29 | + | ||
30 | +A funcao especial i3GEO.finalizaAPI e sempre executada apos essas requisicoes terminarem. | ||
31 | + | ||
32 | +A arvore de camadas tambem possui uma funcao semelhante, chamada i3GEO.arvoreDeCamadas.FINALIZA | ||
33 | + | ||
34 | +A arvore criada e um objeto do YAHOO e fica armazenada em i3GEO.arvoreDeCamadas.ARVORE | ||
35 | + | ||
36 | +************/ | ||
37 | + | ||
38 | +i3GEO.idioma.MOSTRASELETOR = false; //para nao mostrar as bandeiras de escolha do idioma | ||
39 | +i3GEO.finalizaAPI = function(){ | ||
40 | + //cria a arvore apos o mapa ter terminado | ||
41 | + $i("logMapa").innerHTML += "<p class=paragrafo >O mapa terminou..."; | ||
42 | + i3GEO.arvoreDeCamadas.inicia("arvoreDeCamadas"); | ||
43 | +}; | ||
44 | +i3GEO.arvoreDeCamadas.FINALIZA = function(){ | ||
45 | + //executado quando a arvore termina de ser criada | ||
46 | + $i("logMapa").innerHTML += "<p class=paragrafo >A arvore terminou..."; | ||
47 | +} | ||
48 | +i3GEO.cria(); | ||
49 | +i3GEO.inicia(); | ||
50 | + | ||
51 | +</script> | ||
52 | +</body> | ||
53 | +</html> |
@@ -0,0 +1,46 @@ | @@ -0,0 +1,46 @@ | ||
1 | +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/strict.dtd"> | ||
2 | +<html> | ||
3 | +<head> | ||
4 | +<meta http-equiv="Category" content="i3Geo Mapa interativo MMA geoprocessamento sig mobile"> | ||
5 | +<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1"> | ||
6 | +<title>i3GEO - OpenLayers</title> | ||
7 | +<script src="../classesjs/i3geonaocompacto.js"></script> | ||
8 | +<script src="../pacotes/openlayers/OpenLayers2131.js"></script> | ||
9 | +<link rel="stylesheet" type="text/css" href="../css/black.css"> | ||
10 | +</head> | ||
11 | +<body style='margin-left:7px;background:white;' class=yui-skin-sam > | ||
12 | +<div style="top:50px;"> | ||
13 | +<div id="arvoreDeCamadas" style="width:250px;height:400px;border:1px solid;float:left;"> | ||
14 | + | ||
15 | +</div> | ||
16 | +<div id=i3geo > | ||
17 | +<div id=corpoMapa style="left:255px;width:700px;height:400px;background-image:url('../imagens/i3geo1bw.jpg');"> | ||
18 | +</div> | ||
19 | +</div> | ||
20 | +</div> | ||
21 | +<div id="logMapa" ></div> | ||
22 | +<script> | ||
23 | +/************ | ||
24 | +O objeto i3GEO.arvoreDeCamadas.ARVORE pode ser manipulado utilizando-se os metodos da API do YAHOO, | ||
25 | +como no exemplo abaixo que recolhe a arvore apos sua criacao | ||
26 | + | ||
27 | +Veja mais em: http://yui.github.io/yui2/docs/yui_2.9.0_full/docs/YAHOO.widget.TreeView.html | ||
28 | + | ||
29 | +************/ | ||
30 | + | ||
31 | +i3GEO.idioma.MOSTRASELETOR = false; //para nao mostrar as bandeiras de escolha do idioma | ||
32 | +i3GEO.arvoreDeCamadas.FINALIZA = function(){ | ||
33 | + if(i3GEO.arvoreDeCamadas.ARVORE){ | ||
34 | + //recolhe todos os nos da arvore | ||
35 | + i3GEO.arvoreDeCamadas.ARVORE.collapseAll(); | ||
36 | + } | ||
37 | +}; | ||
38 | +i3GEO.finalizaAPI = function(){ | ||
39 | + i3GEO.arvoreDeCamadas.inicia("arvoreDeCamadas"); | ||
40 | +}; | ||
41 | +i3GEO.cria(); | ||
42 | +i3GEO.inicia(); | ||
43 | + | ||
44 | +</script> | ||
45 | +</body> | ||
46 | +</html> |
exemplos/index.html
@@ -73,6 +73,16 @@ body,td { | @@ -73,6 +73,16 @@ body,td { | ||
73 | <a href="codemirror.php?&pagina=cursodsv6.htm" target="_blank">[6]</a> | 73 | <a href="codemirror.php?&pagina=cursodsv6.htm" target="_blank">[6]</a> |
74 | | 74 | |
75 | <a href="codemirror.php?&pagina=cursodsv7.htm" target="_blank">[7]</a> | 75 | <a href="codemirror.php?&pagina=cursodsv7.htm" target="_blank">[7]</a> |
76 | + | ||
77 | + <a href="codemirror.php?&pagina=cursodsv8.htm" target="_blank">[8]</a> | ||
78 | + | ||
79 | + <a href="codemirror.php?&pagina=cursodsv9.htm" target="_blank">[9]</a> | ||
80 | + | ||
81 | + <a href="codemirror.php?&pagina=cursodsv10.htm" target="_blank">[10]</a> | ||
82 | + | ||
83 | + <a href="codemirror.php?&pagina=cursodsv11.htm" target="_blank">[11]</a> | ||
84 | + | ||
85 | + <a href="codemirror.php?&pagina=cursodsv12.htm" target="_blank">[12]</a> | ||
76 | </p> | 86 | </p> |
77 | </fieldset> | 87 | </fieldset> |
78 | <fieldset> | 88 | <fieldset> |