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 @@ |
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 @@ |
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 @@ |
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 @@ |
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 @@ |
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 | 73 | <a href="codemirror.php?&pagina=cursodsv6.htm" target="_blank">[6]</a> |
74 | 74 | |
75 | 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 | 86 | </p> |
77 | 87 | </fieldset> |
78 | 88 | <fieldset> | ... | ... |