Download as
Browse Code »

Commit b5067d101dd900a6300e1df9b07f054c36b324f5

Authored by Edmar Moretti
1 parent ac8922aa
Exists in master and in 7 other branches composer, doc-root, docker, guia, licenca, readme, unmaintened

Corrigida função que possibilita iniciar o mapa com um visual diferente escolhid… 

…o (a função de troca de visual não estava sendo executada na inicialização)
Incluídos dois novos exemplos de configuração de visual.
Showing 5 changed files with 664 additions and 0 deletions   Show diff stats
classesjs/classe_interface.js
  Diff comments   View file @b5067d1
... ... @@ -279,6 +279,8 @@ i3GEO.interface = {
279 279 }
280 280 if(i3GEO.interface.ATIVAMENUCONTEXTO)
281 281 i3GEO.interface.padrao.ativaMenuContexto();
  282 + if(i3GEO.configura.visual != "default")
  283 + i3GEO.gadgets.visual.troca(i3GEO.configura.visual);
282 284 }
283 285 },
284 286 /*
... ...
exemplos/index.html
  Diff comments   View file @b5067d1
... ... @@ -29,4 +29,7 @@ body,td
29 29 <p><a href="camadas2.htm" target="_blank" >Legenda expandida</a></p>
30 30 <p><a href="camadas3.htm" target="_blank" >Árvore simplificada</a></p>
31 31 <p><a href="camadas4.htm" target="_blank" >Opção "mais temas" na guia de camadas</a></p>
  32 +<p>Visuais deiferentes</p>
  33 +<p><a href="visual1.htm" target="_blank" >Junho</a></p>
  34 +<p><a href="visual2.htm" target="_blank" >Laranja</a></p>
32 35 </body>
... ...
exemplos/visual1.htm 0 → 100644
  Diff comments   View file @b5067d1
... ... @@ -0,0 +1,332 @@
  1 +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  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 - Mapa interativo</title>
  7 +<!--
  8 + Leitura dos programas javaScript e estilos.
  9 + Os códigos do i3geo são compactados para tornar o carregamento mais rápido.
  10 + Se vc alterar os códigos originais, não se esqueça de compactá-los com classesjs/compactajs.php.
  11 + Para depurar o código sem ter de compactá-los, substitua na linha abaixo
  12 + o arquivo i3geo.js por i3geo.js
  13 +-->
  14 +<script type="text/javascript" src="../classesjs/i3geonaocompacto.js"></script>
  15 + <style>
  16 + .yui-skin-sam .yui-panel .hd {
  17 + background:transparent url(../pacotes/yui252/build/assets/skins/sam/sprite_junho_saojoao.png) repeat-x scroll 0 -200px;
  18 + }
  19 + </style>
  20 +</head>
  21 +<body id="i3geo">
  22 +
  23 +<table id='mst' summary="" style='display:none;' width=100% cellspacing='0'>
  24 +
  25 +<!--
  26 + Inclui a barra superior. Se vc não quiser o menu, é só comentar o TR
  27 +-->
  28 +<tr style="border:0px">
  29 + <td colspan=2 id="barraSuperior" style="background-image:url('../imagens/visual/default/cabeca.png');height:10px"></td>
  30 +</tr>
  31 +<tr>
  32 +<td>
  33 + <table width=100% cellspacing=0 cellpadding=0 >
  34 + <tr>
  35 + <td title="libera guias" class=tdclaro id=encolheFerramentas style="vertical-align:top;width:5px;text-align:left;"></td>
  36 + <td>
  37 + <!--
  38 + Guias principais, não mude o ID, apenas o nome se for desejado
  39 + -->
  40 +
  41 + <div class=verdeescuro style="top:0px;cursor:pointer;">
  42 + <div id=guia1 class=guia >Temas</div>
  43 + <div id=guia2 class=guia >Adiciona</div>
  44 + <div id=guia4 class=guia >Legenda</div>
  45 + <div id=guia5 class=guia >Links</div>
  46 + </div>
  47 + </td>
  48 +
  49 + </tr>
  50 + </table>
  51 +</td>
  52 +<td id="contemMenu" style="text-align:right;height:0px;border-width:0pt 0pt 1px;border-color:rgb(240,240,240)">
  53 + <!--
  54 + menu suspenso
  55 + -->
  56 + <div id="menus" ></div>
  57 +</td>
  58 +</tr>
  59 +<tr>
  60 + <td class=tdbranca id=contemFerramentas style="vertical-align:top;width:268px;text-align:left;">
  61 + <!--
  62 + Esta div acrescenta a lista de propriedades do mapa, caso vc queira colocá-la em um lugar específico
  63 + -->
  64 +
  65 + <!--<div id=listaPropriedades ></div>-->
  66 + <!--
  67 + Esta div acrescenta a opção de busca rápida, caso vc queira colocá-la em um lugar específico
  68 + -->
  69 + <!-- <div id=buscaRapida ></div> -->
  70 + <!--
  71 + As divs guiaNobj guardam o conteúdo que é mostrado quando a guia é clicada
  72 + Para cada botão na guia deve haver um div com o conteúdo, pe.
  73 + o div com id=guia1 deve ter um div com id=guia1obj
  74 + -->
  75 + <div id='guia1obj' >
  76 + <div style='left:5px;top:10px;' id=buscaRapida ></div>
  77 + <div id=listaPropriedades style='top:15px;' ></div>
  78 + <div id=listaTemas style='top:15px;'></div>
  79 + <!-- se vc quiser colocar a arvore de adição de temas em um lugar específico, use o div abaixo, caso contrário, a árvore será colocada na guia definida em objmapa.guiaMenu
  80 + <div id=arvoreAdicionaTema style='top:25px;' ></div>
  81 + <div id=outrasOpcoesAdiciona style='top:25px;' ></div>
  82 + -->
  83 + </div>
  84 +
  85 + <div id='guia2obj' style='display:none;'>Aguarde...<img alt="" src="../imagens/branco.gif" width=248 /></div>
  86 + <div id='guia4obj' style='display:none;text-align:left'><div id='legenda' style='text-align:left'></div></div>
  87 + <div id='guia5obj' style='display:none;text-align:left'><div id='banners' style='overflow:auto;text-align:left'>Aguarde...</div></div>
  88 + </td>
  89 + <td style="vertical-align:top;border-width:0px;">
  90 + <table width="100%" style="vertical-align:top;border-width:0px">
  91 + <!--
  92 + Corpo do mapa. Pode ser reposicionado, mas não mude os IDs. Se vc quiser que o mapa tenha um tamanho específico, inclua o estilo, exemplo, style=width:300px;height:300px
  93 + Vc pode usar o estilo para definir o tamanho do mapa. Se não tiver estilo definido, o tamanho será automático
  94 + -->
  95 + <tr><td class=verdeclaro id=contemImg >
  96 +
  97 + <div id=corpoMapa style="background-image:url('../imagens/i3geo1bw.jpg');"></div>
  98 + </td></tr>
  99 + </table>
  100 + </td>
  101 + </tr>
  102 +<!--
  103 +Mostra as coordenadas conforme o mouse é movimentado
  104 +-->
  105 +<!-- <div class=pcenter10 id='longlat'>Longitude e latitude</div> -->
  106 +<!--
  107 +Escala gráfica. Pode ser excluída.
  108 +-->
  109 +<!-- <div id="escalaGrafica" style="text-align:left"></div> -->
  110 +<!--
  111 +vc pode optar por colocar mensagens de ajuda em algum lugar
  112 +-->
  113 +<!--
  114 +<tr><td colspan=2 ><div id=i3geo_ajuda class=verdeescuro style="text-align:left;" >I3Geo</div></td></tr>
  115 +-->
  116 +<tr>
  117 +
  118 + <td class=tdbranca >
  119 + <!--
  120 + Nesse div são incluídos os ícones que permitem ao usuário modificar o visual de cores dos ícones
  121 + <div id=visual ></div>
  122 + -->
  123 + <!-- aqui serão incluídas as bandeiras que permitem a troca de idioma -->
  124 + <div id="seletorIdiomas" ></div>
  125 + <!-- aqui será incluído o contador de tempo quando o temporizador de redesenho do mapa estiver ativo -->
  126 + <div id=tempoRedesenho style=color:green;background-color:black;width:50px;display:none ></div>
  127 + </td>
  128 + <td class=tdbranca >
  129 + <table width=100% ><tr>
  130 + <td class=tdbranca ><div id=lugarquadros ></div></td>
  131 + <td class=tdbranca style=text-align:center >
  132 + <!-- aqui será incluído o gadget que mostra a coordenada geográfica da posição do mouse -->
  133 + <div id=localizarxy style="text-align:left;font-size:10px;">Aguarde...</div>
  134 + </td>
  135 + <td class=tdbranca >
  136 + <!-- aqui será incluída a escala numérica -->
  137 + <div id=escala ></div>
  138 + </td>
  139 + <!--
  140 + A opção de localização 'onde estou?' baseia-se na identificação do IP do usuário. Para
  141 + que esta opção funcione corretamente, deve estar instalado no I3Geo o pacote geoIP. Veja no
  142 + SVN do portal do software público o diretório arquivos_versões/pacotes para maiores informações
  143 + -->
  144 + <td class=tdbranca ><div id=ondeestou ></div></td>
  145 + </tr>
  146 + <!-- esta div recebe o cálculo do posicionamento do mouse em coordenadas UTM
  147 + As coordenadas UTM apenas serão mostradas nessa div se o parâmetro
  148 + i3GEO.gadgets.mostraCoordenadasUTM.idhtml for diferente de i3GEO.gadgets.mostraCoordenadasGEO.idhtml
  149 + se os IDs forem iguais, o tipo de coordenada mostrada será intercalada, ora UTM ora GEO.
  150 + <tr><td></td><td class="tdbranca"><div style="text-align:left;font-size:8px;background-color:white;display:none;" id=mostraUTM ></div></td><td></td></tr>
  151 + -->
  152 + </table>
  153 + </td>
  154 +</tr>
  155 +<tr style="border:0px"><td colspan=3 id="barraInferior" style="background-image:url('../imagens/visual/default/rodape.png');height:10px"></td></tr>
  156 +<!-- aqui são mostradas imagens obtidas do metadata mensagem que pode existir em cada layer -->
  157 +<tr style="border:0px"><td colspan=3 style=background-color:black ><input style="border:0px none; background-color:black;color:white;font-size:12pt;" type="text" size="1" id="i3geo_letreiro" ></td></tr>
  158 +<tr style="border:0px"><td colspan=3 style=background-color:black;color:white >geoprocessamento@mma.gov.br</td></tr>
  159 +
  160 +</table>
  161 +</center>
  162 +<!--
  163 + Barra de botoes que serão incluídos na janela móvel de navegação
  164 + Para excluir um botão é só apagar a linha.
  165 + Para adicionar um botão, é só criar uma linha e especificar a função que será executada quando o usuário clicar no botão
  166 +-->
  167 +<div id=barraDeBotoes1 style='display:none'>
  168 + <table style="width:100%"><caption style="text-align:center">&nbsp;</caption><tr><td style='background-color:rgb(250,250,250);'><div ID='historicozoom' ></div></td></tr><tr><td style=height:5px ></td></tr></table>
  169 + <div style='display:inline;background-color:rgb(250,250,250);'>
  170 + <p style='font-size:2px;'>&nbsp;</p>
  171 + <img title="zoom" alt="" src="../imagens/branco.gif" id='zoomli'/>
  172 + </div>
  173 + <div style='display:inline;background-color:rgb(250,250,250);'>
  174 + <p style='font-size:2px;'>&nbsp;</p>
  175 + <img title="desloca" alt="" src="../imagens/branco.gif" id='pan'/>
  176 + </div>
  177 + <div style='display:inline;background-color:rgb(250,250,250);'>
  178 + <p style='font-size:2px;'>&nbsp;</p>
  179 + <img title="info" alt="" src="../imagens/branco.gif" id='identifica'/>
  180 + </div>
  181 + <div style='display:inline;background-color:rgb(250,250,250);'>
  182 + <p style='font-size:2px;'>&nbsp;</p>
  183 + <img title="geral" alt="" src="../imagens/branco.gif" id='zoomtot'/>
  184 + </div>
  185 +</div>
  186 +<div id=barraDeBotoes2 style='display:none'>
  187 + <table style="width:100%"><caption style="text-align:center">&nbsp;</caption>
  188 + <tr><td style='background-color:rgb(250,250,250);'><img title="" alt="" src="../imagens/branco.gif" id='sobeferramentas'/></td></tr>
  189 + </table>
  190 +
  191 + <div style='display:inline;background-color:rgb(250,250,250);'>
  192 + <p style='font-size:2px;'>&nbsp;</p>
  193 + <img title="mede" alt="" src="../imagens/branco.gif" id='mede'/>
  194 + </div>
  195 +
  196 + <div style='display:inline;background-color:rgb(250,250,250);'>
  197 + <p style='font-size:2px;'>&nbsp;</p>
  198 + <img title="area" alt="" src="../imagens/branco.gif" id='area'/>
  199 + </div>
  200 +
  201 + <div style='display:inline;background-color:rgb(250,250,250);'>
  202 + <p style='font-size:2px;'>&nbsp;</p>
  203 + <img title="imprimir" alt="" src="../imagens/branco.gif" id='imprimir'/>
  204 + </div>
  205 +
  206 + <div style='display:inline;background-color:rgb(250,250,250);'>
  207 + <p style='font-size:2px;'>&nbsp;</p>
  208 + <img title="reinicia" alt="" src="../imagens/branco.gif" id='reinicia'/>
  209 + </div>
  210 +
  211 +
  212 + <div style='display:inline;background-color:rgb(250,250,250);'>
  213 + <p style='font-size:2px;'>&nbsp;</p>
  214 + <img title="extensao" alt="" src="../imagens/branco.gif" id='exten'/>
  215 + </div>
  216 +
  217 + <div style='display:inline;background-color:rgb(250,250,250);'>
  218 + <p style='font-size:2px;'>&nbsp;</p>
  219 + <img title="referencia" alt="" src="../imagens/branco.gif" id='referencia'/>
  220 + </div>
  221 + <div style='display:inline;background-color:rgb(250,250,250);'>
  222 + <p style='font-size:2px;'>&nbsp;</p>
  223 + <img title="insere xy" alt="" src="../imagens/branco.gif" id='inserexy'/>
  224 + </div>
  225 + <div style='display:inline;background-color:rgb(250,250,250);'>
  226 + <p style='font-size:2px;'>&nbsp;</p>
  227 + <img title="texto" alt="" src="../imagens/branco.gif" id='textofid'/>
  228 + </div>
  229 + <div style='display:inline;background-color:rgb(250,250,250);'>
  230 + <p style='font-size:2px;'>&nbsp;</p>
  231 + <img title="selecao" alt="" src="../imagens/branco.gif" id='selecao'/>
  232 +
  233 + </div>
  234 + <div style='display:inline;background-color:rgb(250,250,250);'>
  235 + <p style='font-size:2px;'>&nbsp;</p>
  236 + <img title="google" alt="" src="../imagens/branco.gif" id='google'/>
  237 + </div>
  238 + <div style='display:inline;background-color:rgb(250,250,250);'>
  239 + <p style='font-size:2px;'>&nbsp;</p>
  240 + <img title="insere grafico" alt="" src="../imagens/branco.gif" id='inseregrafico'/>
  241 + </div>
  242 + <div style='display:none;background-color:rgb(250,250,250);'>
  243 +
  244 + <p style='font-size:2px;'>&nbsp;</p>
  245 + <img title="lente" alt="" src="../imagens/branco.gif" id='lentei'/>
  246 + </div>
  247 + <div style='display:none;background-color:rgb(250,250,250);'>
  248 + <p style='font-size:2px;'>&nbsp;</p>
  249 + <img title="scielo" alt="" src="../imagens/branco.gif" id='scielo'/>
  250 + </div>
  251 + <div style='display:none;background-color:rgb(250,250,250);'>
  252 + <p style='font-size:2px;'>&nbsp;</p>
  253 +
  254 + <img title="confluencias" alt="" src="../imagens/branco.gif" id='confluence'/>
  255 + </div>
  256 + <div style='display:none;background-color:rgb(250,250,250);'>
  257 + <p style='font-size:2px;'>&nbsp;</p>
  258 + <img title="busca na wikipedia" alt="" src="../imagens/branco.gif" id='wiki'/>
  259 + </div>
  260 + <div style='display:none;background-color:rgb(250,250,250);'>
  261 + <p style='font-size:2px;'>&nbsp;</p>
  262 + <img title="3d" alt="" src="../imagens/branco.gif" id='v3d'/>
  263 +
  264 + </div>
  265 + <div style='display:none;background-color:rgb(250,250,250);'>
  266 + <p style='font-size:2px;'>&nbsp;</p>
  267 + <img title="fotos" alt="" src="../imagens/branco.gif" id='buscafotos'/>
  268 + </div>
  269 + <table style="width:100%;"><tr><td style='background-color:rgb(250,250,250);'><p style='font-size:6px;'>&nbsp;</p><img title="" alt="" src="../imagens/branco.gif" id='desceferramentas'/></td></tr></table>
  270 +</div>
  271 +
  272 +<!-- Variáveis globais e inicialização do mapa-->
  273 +<script type="text/javascript">
  274 +/*
  275 +Title: Interface normal
  276 +
  277 +Abre o i3geo com todas as suas funcionalidades.
  278 +
  279 +File: i3geo/aplicmap/geral.htm
  280 +
  281 +Exemplo:
  282 +
  283 +http://<host>/i3geo/ms_criamapa.php
  284 +
  285 +*/
  286 +/*
  287 + Indica a localização correta do i3geo.
  288 +
  289 + É utilizada para identificar o local correto onde estão os programas em php que são utilizados.
  290 +*/
  291 +i3GEO.configura.locaplic = i3GEO.util.protocolo()+"://"+window.location.host+"/i3geo";
  292 +var g_localimg = i3GEO.util.protocolo()+"://"+window.location.host+"/i3geo/imagens";
  293 +var g_3dmap = "3dmap.map";
  294 +
  295 +//i3GEO.arvoreDeTemas.INCLUISISTEMAS = false;
  296 +//i3GEO.idioma.MOSTRASELETOR = false;
  297 +//function tempi(){alert("oi")}
  298 +//i3GEO.configura.funcaoIdentifica = "tempi()"
  299 +
  300 +i3GEO.cria()
  301 +//Log
  302 +/*
  303 +var myContainer = document.body.appendChild(document.createElement("div"));
  304 +myContainer.style.textAlign="left";
  305 +i3geoLog = new YAHOO.widget.LogReader(myContainer);
  306 +i3geoLog.show();
  307 +*/
  308 +
  309 +/*
  310 + Inicializa o mapa
  311 +*/
  312 +//i3GEO.guias.ATUAL = "legenda"
  313 +
  314 +i3GEO.barraDeBotoes.AUTOALTURA = true
  315 +i3GEO.barraDeBotoes.ATIVAMENUCONTEXTO = true
  316 +i3GEO.barraDeBotoes.PERMITEFECHAR = false
  317 +i3GEO.barraDeBotoes.PERMITEDESLOCAR = false
  318 +
  319 +i3GEO.idioma.IDSELETOR = "seletorIdiomas"
  320 +i3GEO.interface.ATIVAMENUCONTEXTO = true
  321 +
  322 +i3GEO.inicia();
  323 +
  324 +//esconde a opção de inclusão da escala quando a resolução da tela for muito pequena
  325 +if($i("escala") && i3GEO.parametros.w < 500)
  326 +{$i("escala").style.display="none";}
  327 +
  328 +
  329 +</script>
  330 +
  331 +</body>
  332 +</html>
0 333 \ No newline at end of file
... ...
exemplos/visual2.htm 0 → 100644
  Diff comments   View file @b5067d1
... ... @@ -0,0 +1,327 @@
  1 +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  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 - Mapa interativo</title>
  7 +<!--
  8 + Leitura dos programas javaScript e estilos.
  9 + Os códigos do i3geo são compactados para tornar o carregamento mais rápido.
  10 + Se vc alterar os códigos originais, não se esqueça de compactá-los com classesjs/compactajs.php.
  11 + Para depurar o código sem ter de compactá-los, substitua na linha abaixo
  12 + o arquivo i3geo.js por i3geo.js
  13 +-->
  14 +<script type="text/javascript" src="../classesjs/i3geonaocompacto.js"></script>
  15 + <style>
  16 + .yui-skin-sam .yui-panel .hd {
  17 + background:transparent url(../pacotes/yui252/build/assets/skins/sam/sprite_junho_saojoao.png) repeat-x scroll 0 -200px;
  18 + }
  19 + </style>
  20 +</head>
  21 +<body id="i3geo">
  22 +
  23 +<table id='mst' summary="" style='display:none;' width=100% cellspacing='0'>
  24 +
  25 +<!--
  26 + Inclui a barra superior. Se vc não quiser o menu, é só comentar o TR
  27 +-->
  28 +<tr style="border:0px">
  29 + <td colspan=2 id="barraSuperior" style="background-image:url('../imagens/visual/default/cabeca.png');height:10px"></td>
  30 +</tr>
  31 +<tr>
  32 +<td>
  33 + <table width=100% cellspacing=0 cellpadding=0 >
  34 + <tr>
  35 + <td title="libera guias" class=tdclaro id=encolheFerramentas style="vertical-align:top;width:5px;text-align:left;"></td>
  36 + <td>
  37 + <!--
  38 + Guias principais, não mude o ID, apenas o nome se for desejado
  39 + -->
  40 +
  41 + <div class=verdeescuro style="top:0px;cursor:pointer;">
  42 + <div id=guia1 class=guia >Temas</div>
  43 + <div id=guia2 class=guia >Adiciona</div>
  44 + <div id=guia4 class=guia >Legenda</div>
  45 + <div id=guia5 class=guia >Links</div>
  46 + </div>
  47 + </td>
  48 +
  49 + </tr>
  50 + </table>
  51 +</td>
  52 +<td id="contemMenu" style="text-align:right;height:0px;border-width:0pt 0pt 1px;border-color:rgb(240,240,240)">
  53 + <!--
  54 + menu suspenso
  55 + -->
  56 + <div id="menus" ></div>
  57 +</td>
  58 +</tr>
  59 +<tr>
  60 + <td class=tdbranca id=contemFerramentas style="vertical-align:top;width:268px;text-align:left;">
  61 + <!--
  62 + Esta div acrescenta a lista de propriedades do mapa, caso vc queira colocá-la em um lugar específico
  63 + -->
  64 +
  65 + <!--<div id=listaPropriedades ></div>-->
  66 + <!--
  67 + Esta div acrescenta a opção de busca rápida, caso vc queira colocá-la em um lugar específico
  68 + -->
  69 + <!-- <div id=buscaRapida ></div> -->
  70 + <!--
  71 + As divs guiaNobj guardam o conteúdo que é mostrado quando a guia é clicada
  72 + Para cada botão na guia deve haver um div com o conteúdo, pe.
  73 + o div com id=guia1 deve ter um div com id=guia1obj
  74 + -->
  75 + <div id='guia1obj' >
  76 + <div style='left:5px;top:10px;' id=buscaRapida ></div>
  77 + <div id=listaPropriedades style='top:15px;' ></div>
  78 + <div id=listaTemas style='top:15px;'></div>
  79 + <!-- se vc quiser colocar a arvore de adição de temas em um lugar específico, use o div abaixo, caso contrário, a árvore será colocada na guia definida em objmapa.guiaMenu
  80 + <div id=arvoreAdicionaTema style='top:25px;' ></div>
  81 + <div id=outrasOpcoesAdiciona style='top:25px;' ></div>
  82 + -->
  83 + </div>
  84 +
  85 + <div id='guia2obj' style='display:none;'>Aguarde...<img alt="" src="../imagens/branco.gif" width=248 /></div>
  86 + <div id='guia4obj' style='display:none;text-align:left'><div id='legenda' style='text-align:left'></div></div>
  87 + <div id='guia5obj' style='display:none;text-align:left'><div id='banners' style='overflow:auto;text-align:left'>Aguarde...</div></div>
  88 + </td>
  89 + <td style="vertical-align:top;border-width:0px;">
  90 + <table width="100%" style="vertical-align:top;border-width:0px">
  91 + <!--
  92 + Corpo do mapa. Pode ser reposicionado, mas não mude os IDs. Se vc quiser que o mapa tenha um tamanho específico, inclua o estilo, exemplo, style=width:300px;height:300px
  93 + Vc pode usar o estilo para definir o tamanho do mapa. Se não tiver estilo definido, o tamanho será automático
  94 + -->
  95 + <tr><td class=verdeclaro id=contemImg >
  96 +
  97 + <div id=corpoMapa style="background-image:url('../imagens/i3geo1bw.jpg');"></div>
  98 + </td></tr>
  99 + </table>
  100 + </td>
  101 + </tr>
  102 +<!--
  103 +Mostra as coordenadas conforme o mouse é movimentado
  104 +-->
  105 +<!-- <div class=pcenter10 id='longlat'>Longitude e latitude</div> -->
  106 +<!--
  107 +Escala gráfica. Pode ser excluída.
  108 +-->
  109 +<!-- <div id="escalaGrafica" style="text-align:left"></div> -->
  110 +<!--
  111 +vc pode optar por colocar mensagens de ajuda em algum lugar
  112 +-->
  113 +<!--
  114 +<tr><td colspan=2 ><div id=i3geo_ajuda class=verdeescuro style="text-align:left;" >I3Geo</div></td></tr>
  115 +-->
  116 +<tr>
  117 +
  118 + <td class=tdbranca >
  119 + <!--
  120 + Nesse div são incluídos os ícones que permitem ao usuário modificar o visual de cores dos ícones
  121 + <div id=visual ></div>
  122 + -->
  123 + <!-- aqui serão incluídas as bandeiras que permitem a troca de idioma -->
  124 + <div id="seletorIdiomas" ></div>
  125 + <!-- aqui será incluído o contador de tempo quando o temporizador de redesenho do mapa estiver ativo -->
  126 + <div id=tempoRedesenho style=color:green;background-color:black;width:50px;display:none ></div>
  127 + </td>
  128 + <td class=tdbranca >
  129 + <table width=100% ><tr>
  130 + <td class=tdbranca ><div id=lugarquadros ></div></td>
  131 + <td class=tdbranca style=text-align:center >
  132 + <!-- aqui será incluído o gadget que mostra a coordenada geográfica da posição do mouse -->
  133 + <div id=localizarxy style="text-align:left;font-size:10px;">Aguarde...</div>
  134 + </td>
  135 + <td class=tdbranca >
  136 + <!-- aqui será incluída a escala numérica -->
  137 + <div id=escala ></div>
  138 + </td>
  139 + <!--
  140 + A opção de localização 'onde estou?' baseia-se na identificação do IP do usuário. Para
  141 + que esta opção funcione corretamente, deve estar instalado no I3Geo o pacote geoIP. Veja no
  142 + SVN do portal do software público o diretório arquivos_versões/pacotes para maiores informações
  143 + -->
  144 + <td class=tdbranca ><div id=ondeestou ></div></td>
  145 + </tr>
  146 + <!-- esta div recebe o cálculo do posicionamento do mouse em coordenadas UTM
  147 + As coordenadas UTM apenas serão mostradas nessa div se o parâmetro
  148 + i3GEO.gadgets.mostraCoordenadasUTM.idhtml for diferente de i3GEO.gadgets.mostraCoordenadasGEO.idhtml
  149 + se os IDs forem iguais, o tipo de coordenada mostrada será intercalada, ora UTM ora GEO.
  150 + <tr><td></td><td class="tdbranca"><div style="text-align:left;font-size:8px;background-color:white;display:none;" id=mostraUTM ></div></td><td></td></tr>
  151 + -->
  152 + </table>
  153 + </td>
  154 +</tr>
  155 +<tr style="border:0px"><td colspan=3 id="barraInferior" style="background-image:url('../imagens/visual/default/rodape.png');height:10px"></td></tr>
  156 +<!-- aqui são mostradas imagens obtidas do metadata mensagem que pode existir em cada layer -->
  157 +<tr style="border:0px"><td colspan=3 style=background-color:black ><input style="border:0px none; background-color:black;color:white;font-size:12pt;" type="text" size="1" id="i3geo_letreiro" ></td></tr>
  158 +<tr style="border:0px"><td colspan=3 style=background-color:black;color:white >geoprocessamento@mma.gov.br</td></tr>
  159 +
  160 +</table>
  161 +</center>
  162 +<!--
  163 + Barra de botoes que serão incluídos na janela móvel de navegação
  164 + Para excluir um botão é só apagar a linha.
  165 + Para adicionar um botão, é só criar uma linha e especificar a função que será executada quando o usuário clicar no botão
  166 +-->
  167 +<div id=barraDeBotoes1 style='display:none'>
  168 + <table style="width:100%"><caption style="text-align:center">&nbsp;</caption><tr><td style='background-color:rgb(250,250,250);'><div ID='historicozoom' ></div></td></tr><tr><td style=height:5px ></td></tr></table>
  169 + <div style='display:inline;background-color:rgb(250,250,250);'>
  170 + <p style='font-size:2px;'>&nbsp;</p>
  171 + <img title="zoom" alt="" src="../imagens/branco.gif" id='zoomli'/>
  172 + </div>
  173 + <div style='display:inline;background-color:rgb(250,250,250);'>
  174 + <p style='font-size:2px;'>&nbsp;</p>
  175 + <img title="desloca" alt="" src="../imagens/branco.gif" id='pan'/>
  176 + </div>
  177 + <div style='display:inline;background-color:rgb(250,250,250);'>
  178 + <p style='font-size:2px;'>&nbsp;</p>
  179 + <img title="info" alt="" src="../imagens/branco.gif" id='identifica'/>
  180 + </div>
  181 + <div style='display:inline;background-color:rgb(250,250,250);'>
  182 + <p style='font-size:2px;'>&nbsp;</p>
  183 + <img title="geral" alt="" src="../imagens/branco.gif" id='zoomtot'/>
  184 + </div>
  185 +</div>
  186 +<div id=barraDeBotoes2 style='display:none'>
  187 + <table style="width:100%"><caption style="text-align:center">&nbsp;</caption>
  188 + <tr><td style='background-color:rgb(250,250,250);'><img title="" alt="" src="../imagens/branco.gif" id='sobeferramentas'/></td></tr>
  189 + </table>
  190 +
  191 + <div style='display:inline;background-color:rgb(250,250,250);'>
  192 + <p style='font-size:2px;'>&nbsp;</p>
  193 + <img title="mede" alt="" src="../imagens/branco.gif" id='mede'/>
  194 + </div>
  195 +
  196 + <div style='display:inline;background-color:rgb(250,250,250);'>
  197 + <p style='font-size:2px;'>&nbsp;</p>
  198 + <img title="area" alt="" src="../imagens/branco.gif" id='area'/>
  199 + </div>
  200 +
  201 + <div style='display:inline;background-color:rgb(250,250,250);'>
  202 + <p style='font-size:2px;'>&nbsp;</p>
  203 + <img title="imprimir" alt="" src="../imagens/branco.gif" id='imprimir'/>
  204 + </div>
  205 +
  206 + <div style='display:inline;background-color:rgb(250,250,250);'>
  207 + <p style='font-size:2px;'>&nbsp;</p>
  208 + <img title="reinicia" alt="" src="../imagens/branco.gif" id='reinicia'/>
  209 + </div>
  210 +
  211 +
  212 + <div style='display:inline;background-color:rgb(250,250,250);'>
  213 + <p style='font-size:2px;'>&nbsp;</p>
  214 + <img title="extensao" alt="" src="../imagens/branco.gif" id='exten'/>
  215 + </div>
  216 +
  217 + <div style='display:inline;background-color:rgb(250,250,250);'>
  218 + <p style='font-size:2px;'>&nbsp;</p>
  219 + <img title="referencia" alt="" src="../imagens/branco.gif" id='referencia'/>
  220 + </div>
  221 + <div style='display:inline;background-color:rgb(250,250,250);'>
  222 + <p style='font-size:2px;'>&nbsp;</p>
  223 + <img title="insere xy" alt="" src="../imagens/branco.gif" id='inserexy'/>
  224 + </div>
  225 + <div style='display:inline;background-color:rgb(250,250,250);'>
  226 + <p style='font-size:2px;'>&nbsp;</p>
  227 + <img title="texto" alt="" src="../imagens/branco.gif" id='textofid'/>
  228 + </div>
  229 + <div style='display:inline;background-color:rgb(250,250,250);'>
  230 + <p style='font-size:2px;'>&nbsp;</p>
  231 + <img title="selecao" alt="" src="../imagens/branco.gif" id='selecao'/>
  232 +
  233 + </div>
  234 + <div style='display:inline;background-color:rgb(250,250,250);'>
  235 + <p style='font-size:2px;'>&nbsp;</p>
  236 + <img title="google" alt="" src="../imagens/branco.gif" id='google'/>
  237 + </div>
  238 + <div style='display:inline;background-color:rgb(250,250,250);'>
  239 + <p style='font-size:2px;'>&nbsp;</p>
  240 + <img title="insere grafico" alt="" src="../imagens/branco.gif" id='inseregrafico'/>
  241 + </div>
  242 + <div style='display:none;background-color:rgb(250,250,250);'>
  243 +
  244 + <p style='font-size:2px;'>&nbsp;</p>
  245 + <img title="lente" alt="" src="../imagens/branco.gif" id='lentei'/>
  246 + </div>
  247 + <div style='display:none;background-color:rgb(250,250,250);'>
  248 + <p style='font-size:2px;'>&nbsp;</p>
  249 + <img title="scielo" alt="" src="../imagens/branco.gif" id='scielo'/>
  250 + </div>
  251 + <div style='display:none;background-color:rgb(250,250,250);'>
  252 + <p style='font-size:2px;'>&nbsp;</p>
  253 +
  254 + <img title="confluencias" alt="" src="../imagens/branco.gif" id='confluence'/>
  255 + </div>
  256 + <div style='display:none;background-color:rgb(250,250,250);'>
  257 + <p style='font-size:2px;'>&nbsp;</p>
  258 + <img title="busca na wikipedia" alt="" src="../imagens/branco.gif" id='wiki'/>
  259 + </div>
  260 + <div style='display:none;background-color:rgb(250,250,250);'>
  261 + <p style='font-size:2px;'>&nbsp;</p>
  262 + <img title="3d" alt="" src="../imagens/branco.gif" id='v3d'/>
  263 +
  264 + </div>
  265 + <div style='display:none;background-color:rgb(250,250,250);'>
  266 + <p style='font-size:2px;'>&nbsp;</p>
  267 + <img title="fotos" alt="" src="../imagens/branco.gif" id='buscafotos'/>
  268 + </div>
  269 + <table style="width:100%;"><tr><td style='background-color:rgb(250,250,250);'><p style='font-size:6px;'>&nbsp;</p><img title="" alt="" src="../imagens/branco.gif" id='desceferramentas'/></td></tr></table>
  270 +</div>
  271 +
  272 +<!-- Variáveis globais e inicialização do mapa-->
  273 +<script type="text/javascript">
  274 +/*
  275 +Title: Interface normal
  276 +
  277 +Abre o i3geo com todas as suas funcionalidades.
  278 +
  279 +File: i3geo/aplicmap/geral.htm
  280 +
  281 +Exemplo:
  282 +
  283 +http://<host>/i3geo/ms_criamapa.php
  284 +
  285 +*/
  286 +/*
  287 + Indica a localização correta do i3geo.
  288 +
  289 + É utilizada para identificar o local correto onde estão os programas em php que são utilizados.
  290 +*/
  291 +i3GEO.configura.locaplic = i3GEO.util.protocolo()+"://"+window.location.host+"/i3geo";
  292 +var g_localimg = i3GEO.util.protocolo()+"://"+window.location.host+"/i3geo/imagens";
  293 +var g_3dmap = "3dmap.map";
  294 +i3GEO.cria()
  295 +//Log
  296 +/*
  297 +var myContainer = document.body.appendChild(document.createElement("div"));
  298 +myContainer.style.textAlign="left";
  299 +i3geoLog = new YAHOO.widget.LogReader(myContainer);
  300 +i3geoLog.show();
  301 +*/
  302 +
  303 +/*
  304 + Inicializa o mapa
  305 +*/
  306 +//i3GEO.guias.ATUAL = "legenda"
  307 +
  308 +i3GEO.barraDeBotoes.AUTOALTURA = false
  309 +i3GEO.barraDeBotoes.ATIVAMENUCONTEXTO = true
  310 +i3GEO.barraDeBotoes.PERMITEFECHAR = true
  311 +i3GEO.barraDeBotoes.PERMITEDESLOCAR = true
  312 +
  313 +i3GEO.idioma.IDSELETOR = "seletorIdiomas"
  314 +i3GEO.interface.ATIVAMENUCONTEXTO = true
  315 +i3GEO.configura.visual = "laranja";
  316 +
  317 +i3GEO.inicia();
  318 +
  319 +//esconde a opção de inclusão da escala quando a resolução da tela for muito pequena
  320 +if($i("escala") && i3GEO.parametros.w < 500)
  321 +{$i("escala").style.display="none";}
  322 +
  323 +
  324 +</script>
  325 +
  326 +</body>
  327 +</html>
0 328 \ No newline at end of file
... ...
pacotes/yui252/build/assets/skins/sam/sprite.png
View file @b5067d1

3.44 KB | W: | H:

3.05 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin