Download as
Browse Code »

Commit 0d3f57a17260622b33d7046170f657920a041d90

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

--no commit message

Showing 1 changed file with 327 additions and 0 deletions   Show diff stats
exemplos/barraemlinha2.htm 0 → 100644
  Diff comments   View file @0d3f57a
... ... @@ -0,0 +1,327 @@
  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 +
  8 +<script src="../classesjs/i3geo.js"></script>
  9 +<script src="../pacotes/openlayers/OpenLayers2131.js"></script>
  10 +<link rel="stylesheet" type="text/css" href="../css/black.css">
  11 +</head>
  12 +<body id="i3geo" style='margin-left:7px;background:white;'>
  13 +<!-- inclui o nome do usuario logado -->
  14 +<div id="i3GEONomeLogin" style="position:absolute;left:10px;top:12px;font-size:11px;z-index:50000"></div>
  15 +<table id='mst' summary="" style='display:none;' width=100% cellspacing='0'>
  16 + <tr>
  17 + <td id="contemMenu" style="background:black;height:30px;text-align:right;border-width:0pt 0pt 1px;border-color:rgb(240,240,240)">
  18 + <!--menu suspenso-->
  19 + <div id="menus" style="height:0px;"></div>
  20 + </td>
  21 + </tr>
  22 + <tr>
  23 + <td style="vertical-align:top;border-width:0px;">
  24 + <table width="100%" style="vertical-align:top;border-width:0px">
  25 + <tr>
  26 + <td class=verdeclaro id=contemImg >
  27 + <div id=corpoMapa style="position:relative;background-image:url('../imagens/i3geo1bw.jpg');"></div>
  28 + </td>
  29 + </tr>
  30 + </table>
  31 + </td>
  32 + </tr>
  33 + <tr>
  34 + <td>
  35 + <table style="width:100%;height:28px" >
  36 + <tr>
  37 + <td class=fundoRodape >
  38 + <!--
  39 + Nesse div s&atilde;o inclu&iacute;dos os &iacute;cones que permitem ao usu&aacute;rio modificar o visual de cores dos &iacute;cones
  40 + <div id=visual ></div>
  41 + -->
  42 + <!-- bot&atilde;o de compartilhamento em redes sociais-->
  43 + <!-- <div id=i3GEOcompartilhar style="width:170px;margin:auto;text-align:left;border-top:1px solid rgb(250,250,250);padding-top:1px" ></div>-->
  44 + <!-- aqui ser&aacute; inclu&iacute;do o contador de tempo quando o temporizador de redesenho do mapa estiver ativo -->
  45 + <div id=tempoRedesenho style=z-index:100;position:absolute;top:0px;color:green;background-color:black;width:50px;display:none ></div>
  46 + </td>
  47 + <td class=fundoRodape style=width:20% >
  48 + <!-- aqui ser&aacute; inclu&iacute;da a escala num&eacute;rica -->
  49 + <div id=escala style="margin:auto;text-align:right;left:15px;" ></div>
  50 + </td>
  51 + <td class=fundoRodape style=width:60% >
  52 + <!-- aqui ser&aacute; inclu&iacute;do o gadget que mostra a coordenada geogr&aacute;fica da posi&ccedil;&atilde;o do mouse -->
  53 + <div id=localizarxy style="margin:auto;text-align:left;font-size:10px;display:inline-table"></div>
  54 + </td>
  55 + <!-- aqui ser&atilde;o inclu&iacute;das as bandeiras que permitem a troca de idioma -->
  56 + <td class=fundoRodape style="width:20%;" >
  57 + <div id=seletorIdiomas style="right:15px;"></div>
  58 + </td>
  59 + </tr>
  60 + </table>
  61 + </td>
  62 + </tr>
  63 +</table>
  64 + <table id="i3GEOlogoMarca"
  65 + style='margin: 0px auto; box-shadow: 0 1px 13px gray; border-radius: 5px;'>
  66 + <tr>
  67 + <td style=height:30px ><div id=versaoi3geo></div>
  68 + <h2
  69 + style="font-weight:normal;font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif;">i3Geo
  70 + - Software livre para cria&ccedil;&atilde;o de mapas interativos e
  71 + geoprocessamento</h2>
  72 + <h3
  73 + style="font-weight:normal;font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif;">Baseado
  74 + no Mapserver, &eacute; licenciado sob GPL e integra o Portal do
  75 + Software P&uacute;blico Brasileiro</h3></td>
  76 + </tr>
  77 + <tr>
  78 + <td style="padding: 10px;"><img
  79 + style="width: 560px; height: 81px" alt=""
  80 + src='../imagens/logo_inicio.png'></td>
  81 + </tr>
  82 + <tr>
  83 + <td>
  84 + <!--
  85 + <script id="ohloh" type="text/javascript" src="http://www.ohloh.net/p/150688/widgets/project_users.js?style=red"></script>
  86 + -->
  87 + </td>
  88 + </tr>
  89 + </table>
  90 +
  91 +
  92 +<div id="i3GEOguiaMovel" style="visibility:hidden;position:absolute;display:block;border:0px solid white;text-align:left;z-index:2000;background-color:none">
  93 + <div style="cursor:pointer;position:absolute;top:50%;margin-top: -65px;width:30px;z-index:5000; left:18px;">
  94 + <img src='../imagens/openbars1.png' style="width: 48px; position: absolute; left: -16px; height: 412px; top: -160px;">
  95 + <div id="iconeGuia_temas" ></div>
  96 + <div id="iconeGuia_adiciona" style="margin-top:3px;" ></div>
  97 + <div id="iconeGuia_legenda" style="margin-top:3px;"></div>
  98 + </div>
  99 +
  100 + <!--
  101 + <img id="i3GEOguiaMovelPuxador" onclick='i3GEO.guias.guiaMovel.abreFecha()' style='z-index:2;border:solid 0px white;left:0px;position:absolute;top:0px' width='0px' src='../imagens/openbars.png' >
  102 + -->
  103 + <div id="i3GEOguiaMovelMolde" style="top:0px;box-shadow:0 2px 10px 0 #888888;position:absolute;display:none;border:0px solid white;text-align:left;z-index:1000;background-color:gray">
  104 + <!--
  105 + <div id="i3GEOguiaMovelIcones" style='overflow:none;left:0px;display:none;position:absolute;top:0px;text-align:center;height:0px;width:0px;border:solid 0px white;background-color:white' ></div>
  106 + -->
  107 + <div id="i3GEOguiaMovelConteudo" style='top:10px;overflow:auto;display:none;position:absolute;border-color:gray;border-width:0px 0 0px 0px;left:0px;height:0px;background-color:white'>
  108 + <div id='guia1obj' style='display:none;' >
  109 + <!-- Esta div acrescenta a op&ccedil;&atilde;o de busca r&aacute;pida, caso vc queira coloc&aacute;-la em um lugar espec&iacute;fico -->
  110 + <div style='left:5px;top:10px;' id=buscaRapida ></div>
  111 + <!-- Esta div acrescenta a lista de propriedades do mapa -->
  112 + <div id=listaPropriedades style='top:15px;' ></div>
  113 + <!-- Esta div acrescenta a lista de de camadas do tipo 'baselayers' espec&iacute;ficas da interface Openlayers. Veja tamb&eacute;m a op&ccedil;&atilde;o i3GEO.Interface.openlayers.GADGETS.LayerSwitcher -->
  114 + <div id=listaLayersBase style='top:15px;'></div>
  115 + <!-- Esta div acrescenta a lista de de camadas dispon&iacute;veis no mapa atual -->
  116 + <div id=listaTemas style='top:15px;'></div>
  117 + </div>
  118 + <div id='guia2obj' style='display:none;'>Aguarde...<img alt="" src="../imagens/branco.gif" width=248 /></div>
  119 + <div id='guia4obj' style='display:none;text-align:left'><div id='legenda' style='text-align:left'></div></div>
  120 + <!--
  121 + <div id='guia5obj' style='display:none;text-align:left'><div id='banners' style='overflow:auto;text-align:left'>Aguarde...</div></div>
  122 + -->
  123 + </div>
  124 + </div>
  125 +</div>
  126 +<style>
  127 +#barraDeIcones {
  128 + border: 0px solid black;
  129 + border-radius: 4px;
  130 + height: 50px;
  131 + margin: auto;
  132 + padding: 1px;
  133 + position: relative;
  134 + top: -60px;
  135 + width: 510px;
  136 + z-index: 5000;
  137 + overflow: hidden;
  138 +}
  139 +#barraDeIcones_mascara{
  140 + z-index: -1;
  141 + opacity: 0.4;
  142 + display:block;
  143 + position:absolute;
  144 + width: 100%;
  145 + height: 100%;
  146 + background: none repeat scroll 0 0 black;
  147 + border-radius: 4px;
  148 + overflow: hidden;
  149 +}
  150 +</style>
  151 +<script>
  152 +
  153 +i3GEO.configura.locaplic = i3GEO.util.protocolo()+"://"+window.location.host+"/i3geo";
  154 +i3GEO.configura.diminuiyN = 90;
  155 +i3GEO.configura.diminuiyM = 90;
  156 +i3GEO.barraDeBotoes.INCLUIBOTAO = {
  157 + abreJanelaLegenda: false,
  158 + localizar: false,
  159 + zoomanterior: true,
  160 + zoomli: true,
  161 + zoomproximo: true,
  162 + zoomiauto: false,
  163 + zoomoauto: false,
  164 + pan: true,
  165 + zoomtot:true,
  166 + identifica: true,
  167 + identificaBalao: true,
  168 + mede: true,
  169 + area: true,
  170 + selecao: true,
  171 + barraedicao: false,
  172 + imprimir: false,
  173 + google: true,
  174 + referencia: false,
  175 + exten: false,
  176 + inserexy: false,
  177 + textofid: false,
  178 + reinicia: false,
  179 + buscafotos: false,
  180 + wiki: false,
  181 + metar: false,
  182 + lentei: false,
  183 + confluence: false,
  184 + inseregrafico: false,
  185 + v3d: false
  186 +};
  187 +
  188 +
  189 +i3GEO.configura.autotamanho = false;
  190 +
  191 +//tipo de barra de bot&otilde;es
  192 +//no final do script deve ser colocado o codigo de inicializacao da barra
  193 +i3GEO.barraDeBotoes.TIPO = "emlinha";
  194 +
  195 +i3GEO.Interface.ATUAL = "openlayers";
  196 +i3GEO.Interface.IDCORPO = "contemImg";
  197 +//ativa ou desativa o balao de info ao clicar no mapa
  198 +i3GEO.eventos.cliquePerm.ativo = true;
  199 +
  200 +//
  201 +//define a funcao que sera executada ao clicar no mapa
  202 +//default (balao do tipo etiqueta)
  203 +i3GEO.eventos.MOUSECLIQUEPERM = [i3GEO.configura.funcaoTip];
  204 +//alternativo (janela de identificacao
  205 +//i3GEO.eventos.MOUSECLIQUEPERM = [i3GEO.configura.funcaoIdentifica];
  206 +//
  207 +i3GEO.Interface.openlayers.GADGETS = {
  208 + PanZoomBar:true,
  209 + PanZoom:false,
  210 + LayerSwitcher:true,
  211 + ScaleLine:true,
  212 + OverviewMap:false
  213 + };
  214 +i3GEO.Interface.openlayers.TILES = true;
  215 +i3GEO.gadgets.PARAMETROS.mostraMenuSuspenso.finaliza = 'if($i("omenudataInterface1")){i3GEOoMenuBar.getMenuItem("omenudataInterface1").cfg.setProperty("text", " ");}';
  216 +
  217 +/*
  218 +Após a cria&ccedil;&atilde;o, &eacute; criado o objeto i3geoOL que corresponde ao objeto map da API do OpenLayers.
  219 +Vc pode usar i3geoOL para aplicar os m&eacute;todos e verificar as propriedades da API do OpenLayers
  220 +*/
  221 +i3GEO.mapa.AUTORESIZE = true;
  222 +i3GEO.cria();
  223 +/*
  224 + Inicializa o mapa
  225 +*/
  226 +//n&atilde;o mostra o mapa de refer&ecirc;ncia
  227 +i3GEO.configura.mapaRefDisplay = "none";
  228 +//remove itens dos menus que n&atilde;o s&atilde;o necess&aacute;rios, j&aacute; que est&atilde;o como &iacute;cones na barra de bot&otilde;es
  229 +i3GEO.configura.oMenuData["submenus"]["janelas"] = [];
  230 +i3GEO.gadgets.PARAMETROS.mostraMenuSuspenso.permiteLogin = true;
  231 +
  232 +i3GEO.ajuda.ATIVAJANELA = false;
  233 +i3GEO.idioma.IDSELETOR = "seletorIdiomas";
  234 +i3GEO.Interface.ATIVAMENUCONTEXTO = false;
  235 +//i3GEO.arvoreDeTemas.TIPOBOTAO = "radio";
  236 +
  237 +i3GEO.arvoreDeTemas.OPCOESADICIONAIS.comentarios = true;
  238 +i3GEO.arvoreDeCamadas.VERIFICAABRANGENCIATEMAS = true;
  239 +i3GEO.arvoreDeCamadas.MOSTRALISTAKML = false;
  240 +
  241 +i3GEO.guias.TIPO = "movel";
  242 +
  243 +
  244 +//i3GEO.guias.guiaMovel.ABERTA = true;
  245 +//posi&ccedil;&atilde;o da guia movel em rela&ccedil;&atilde;o ao topo do mapa. Se for igual a 0, o c&aacute;lculo ser&aacute; feito de forma autom&aacute;tica
  246 +i3GEO.guias.guiaMovel.config.topGuiaMovel = 37;
  247 +//
  248 +//define quanto tempo &eacute; aguardado para considerar que o mouse est&aacute; parado sobre um lugar.
  249 +//utilizado pela fun&ccedil;&atilde;o de identifica&ccedil;&atilde;o do tipo bal&atilde;o
  250 +//
  251 +//i3GEO.configura.tempoMouseParado = 1000
  252 +//
  253 +//esta &eacute; uma vari&aacute;vel interna do OpenLayers que define o endere&ccedil;o do diretório onde est&atilde;o as imagens usadas nos &iacute;cones
  254 +//
  255 +OpenLayers.ImgPath = "../pacotes/openlayers/img/";
  256 +//
  257 +//adiciona camadas que podem ser ativadas como fundo do mapa
  258 +//
  259 +(function(){
  260 + var oce = new OpenLayers.Layer.ArcGIS93Rest(
  261 + "ESRI Ocean Basemap",
  262 + "http://server.arcgisonline.com/ArcGIS/rest/services/Ocean_Basemap/MapServer/export",
  263 + {format:"jpeg"},
  264 + {isBaseLayer:true,visibility:false}
  265 + );
  266 + var ims = new OpenLayers.Layer.ArcGIS93Rest(
  267 + "ESRI Imagery World 2D",
  268 + "http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_Imagery_World_2D/MapServer/export",
  269 + {format:"jpeg"},
  270 + {isBaseLayer:true,visibility:false}
  271 + );
  272 + var wsm = new OpenLayers.Layer.ArcGIS93Rest(
  273 + "ESRI World Street Map",
  274 + "http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer/export",
  275 + {format:"jpeg"},
  276 + {isBaseLayer:true,visibility:false}
  277 + );
  278 + var bra = new OpenLayers.Layer.WMS(
  279 + "Base carto MMA",
  280 + "http://mapas.mma.gov.br/cgi-bin/mapserv?map=/opt/www/html/webservices/baseraster.map",
  281 + {layers:"baseraster",srs:"EPSG:4618",format:"image/png",isBaseLayer:false},
  282 + {isBaseLayer:true,visibility:false}
  283 + );
  284 +
  285 + var tms = new OpenLayers.Layer.TMS(
  286 + "OSGEO",
  287 + "http://tilecache.osgeo.org/wms-c/Basic.py/",
  288 + {
  289 + layername: "basic",
  290 + type: "png",
  291 + // set if different than the bottom left of map.maxExtent
  292 + tileOrigin: new OpenLayers.LonLat(-180,-90),
  293 + isBaseLayer:true,
  294 + visibility:false
  295 + }
  296 + );
  297 +
  298 + i3GEO.Interface.openlayers.LAYERSADICIONAIS = [oce,ims,wsm,tms,bra];
  299 +})();
  300 +//
  301 +//substitui a janela de alerta normal do navegador por uma janela estilizada. Pode ser comentado sem problemas. No Safari apresentou problemas.
  302 +//
  303 +i3GEO.janela.ativaAlerta();
  304 +//
  305 +//inicia o mapa
  306 +//
  307 +//esconde a logomarca ao finalizar o mapa
  308 +i3GEO.finaliza = function(){
  309 + if($i("i3GEOlogoMarca"))
  310 + {$i("i3GEOlogoMarca").style.display = "none";}
  311 + i3GEO.mapa.insereDobraPagina("googlemaps","../imagens/dobragooglemaps.png");
  312 + //
  313 + //cria o div com id "barraDeIcones" e insere a barra
  314 + //
  315 + i3GEO.barraDeBotoes.inicializaBarra("","",false,0,0,"barraDeIcones");
  316 +};
  317 +i3GEO.arvoreDeTemas.OPCOESADICIONAIS.navegacaoDir = true;
  318 +//OpenLayers.DOTS_PER_INCH = 96
  319 +//i3GEO.configura.sid = "";
  320 +i3GEO.janela.TRANSICAOSUAVE = true;
  321 +
  322 +i3GEO.inicia();
  323 +
  324 +
  325 +</script>
  326 +</body>
  327 +</html>
... ...