Download as
Browse Code »

Commit a4921cb3411d56e01a9df412aef4276cd0795b1a

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

Criação de exemplo para inclusão de controle Openlayers

Showing 1 changed file with 262 additions and 0 deletions   Show diff stats
exemplos/controleol.htm 0 → 100755
  Diff comments   View file @a4921cb
... ... @@ -0,0 +1,262 @@
  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.php"></script>
  10 +<link rel="stylesheet" type="text/css" href="../css/black.css">
  11 +
  12 +</head>
  13 +<body id="i3geo" style='margin-left: 7px; background: white;'>
  14 + <!-- inclui o nome do usuario logado -->
  15 + <div id="i3GEONomeLogin" style="position: absolute; left: 10px; top: 12px; font-size: 11px; z-index: 50000"></div>
  16 + <table id='mst' summary="" style='display: none;' width=100% cellspacing='0'>
  17 + <tr>
  18 + <td id="contemMenu" style="background: black; height: 30px; text-align: right; border-width: 0pt 0pt 1px; border-color: rgb(240, 240, 240)">
  19 + <!--menu suspenso-->
  20 + <div id="menus" style="height: 0px;"></div>
  21 + </td>
  22 + </tr>
  23 + <tr>
  24 + <td style="vertical-align: top; border-width: 0px;">
  25 + <table width="100%" style="vertical-align: top; border-width: 0px">
  26 + <tr>
  27 + <td class=verdeclaro id=contemImg>
  28 + <div id=corpoMapa style="position: relative; background-image: url('../imagens/i3geo1bw.jpg');"></div>
  29 + </td>
  30 + </tr>
  31 + </table>
  32 + </td>
  33 + </tr>
  34 + <tr>
  35 + <td>
  36 + <div style="background: black; height: 10px;">&nbsp;</div>
  37 + </td>
  38 + </tr>
  39 + </table>
  40 + <table id="i3GEOlogoMarca" style='margin: 0px auto; box-shadow: 0 1px 13px gray; border-radius: 5px;'>
  41 + <tr>
  42 + <td style="height: 30px"><div id=versaoi3geo></div>
  43 + <h2 style="font-weight: normal; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif;">i3Geo - Software livre para cria&ccedil;&atilde;o de mapas interativos e geoprocessamento</h2>
  44 + <h3 style="font-weight: normal; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif;">Baseado no Mapserver, &eacute; licenciado sob GPL e integra o Portal do Software P&uacute;blico Brasileiro</h3></td>
  45 + </tr>
  46 + <tr>
  47 + <td style="padding: 10px;"><img style="width: 560px; height: 81px" alt="" src='../imagens/logo_inicio.png'></td>
  48 + </tr>
  49 + <tr>
  50 + <td></td>
  51 + </tr>
  52 + </table>
  53 +
  54 + <div id="i3GEOguiaMovel" style="visibility: hidden; position: absolute; display: block; border: 0px solid white; text-align: left; z-index: 2000; background-color: none">
  55 + <div style="cursor: pointer; position: absolute; top: 50%; margin-top: -65px; width: 30px; z-index: 5000; left: 18px;">
  56 + <img src='../imagens/openbars1.png' style="width: 48px; position: absolute; left: -16px; height: 412px; top: -160px;">
  57 + <div id="iconeGuia_temas"></div>
  58 + <div id="iconeGuia_adiciona" style="margin-top: 3px;"></div>
  59 + <div id="iconeGuia_legenda" style="margin-top: 3px;"></div>
  60 + </div>
  61 +
  62 + <!--
  63 + <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' >
  64 + -->
  65 + <div id="i3GEOguiaMovelMolde" style="top: 0px; box-shadow: 0 2px 10px 0 #888888; border-radius: 5px 0px 0px 5px; position: absolute; display: none; border: 0px solid white; text-align: left; z-index: 1000; background-color: gray">
  66 + <!--
  67 + <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>
  68 + -->
  69 + <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'>
  70 + <div id='guia1obj' style='display: none;'>
  71 + <!-- 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 -->
  72 + <div style='left: 5px; top: 10px;' id=buscaRapida></div>
  73 + <!-- Esta div acrescenta a lista de propriedades do mapa -->
  74 + <div id=listaPropriedades style='top: 15px;'></div>
  75 + <!-- 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 -->
  76 + <div id=listaLayersBase style='top: 15px;'></div>
  77 + <!-- Esta div acrescenta a lista de de camadas dispon&iacute;veis no mapa atual -->
  78 + <div id=listaTemas style='top: 15px;'></div>
  79 + </div>
  80 + <div id='guia2obj' style='display: none;'>
  81 + Aguarde...
  82 + <img alt="" src="../imagens/branco.gif" width=248 />
  83 + </div>
  84 + <div id='guia4obj' style='display: none; text-align: left'>
  85 + <div id='legenda' style='text-align: left'></div>
  86 + </div>
  87 + <!--
  88 + <div id='guia5obj' style='display:none;text-align:left'><div id='banners' style='overflow:auto;text-align:left'>Aguarde...</div></div>
  89 + -->
  90 + </div>
  91 + </div>
  92 + </div>
  93 +<style>
  94 +.olControlEditingToolbar1 div {
  95 + background-image: url(../mashups/openlayers.png);
  96 + background-repeat: no-repeat;
  97 + float: right;
  98 + right: 0px;
  99 + height: 29px;
  100 + margin: 2px;
  101 + width: 29px;
  102 + cursor: pointer;
  103 + top: 10px;
  104 +}
  105 +div .olControlMousePosition{
  106 + right: 40px;
  107 + font-size: 12px;
  108 +}
  109 +</style>
  110 + <script>
  111 + i3GEO.configura.locaplic = i3GEO.util.protocolo()
  112 + + "://"
  113 + + window.location.host
  114 + + "/i3geo";
  115 +
  116 + //adiciona um controle especifico via API do openlayers
  117 + i3GEO.Interface.openlayers.parametrosMap.controls.push(new OpenLayers.Control.MousePosition({
  118 + formatOutput: function(lonLat) {
  119 + var markup = i3GEO.calculo.dd2dms(lonLat.lon,lonLat.lat);
  120 + return markup;
  121 + }
  122 + }));
  123 +
  124 + i3GEO.configura.autotamanho = false;
  125 + i3GEO.Interface.ATUAL = "openlayers";
  126 + i3GEO.Interface.IDCORPO = "contemImg";
  127 + i3GEO.Interface.openlayers.TILES = true;
  128 + i3GEO.configura.oMenuData.submenus["interface"] = [
  129 + {
  130 + id : "omenudataInterface0a",
  131 + text : '<span style=color:gray;text-decoration:underline; ><b>'
  132 + + $trad("d27")
  133 + + '</b></span>',
  134 + url : "#"
  135 + }, {
  136 + id : "omenudataInterface2",
  137 + text : "OpenLayers",
  138 + url : "javascript:window.location = i3GEO.configura.locaplic+'/interface/black_ol.htm?'+i3GEO.configura.sid"
  139 + }, {
  140 + id : "omenudataInterface2a",
  141 + text : "OpenLayers OSM",
  142 + url : "javascript:window.location = i3GEO.configura.locaplic+'/interface/black_osm.htm?'+i3GEO.configura.sid"
  143 + }, {
  144 + id : "omenudataInterface4",
  145 + text : "Google Maps",
  146 + url : "javascript:window.location = i3GEO.configura.locaplic+'/interface/black_gm.phtml?'+i3GEO.configura.sid"
  147 + }, {
  148 + id : "omenudataInterface5",
  149 + text : "Google Earth",
  150 + url : "javascript:window.location = i3GEO.configura.locaplic+'/interface/googleearth.phtml?'+i3GEO.configura.sid"
  151 + }, {
  152 + id : "omenudataInterface0b",
  153 + text : '<span style=color:gray;text-decoration:underline; ><b>'
  154 + + $trad("u27")
  155 + + '</b></span>',
  156 + url : "#"
  157 + }, {
  158 + id : "omenudataInterface6",
  159 + text : $trad("u21"),
  160 + url : "javascript:var w = window.open(i3GEO.configura.locaplic+'/geradordelinks.htm')"
  161 + }, {
  162 + id : "omenudataInterface7",
  163 + text : "Servi&ccedil;os WMS",
  164 + url : "javascript:var w = window.open(i3GEO.configura.locaplic+'/ogc.htm')"
  165 + }, {
  166 + id : "omenudataInterface9",
  167 + text : "Download de dados",
  168 + url : "javascript:var w = window.open(i3GEO.configura.locaplic+'/datadownload.htm')"
  169 + }, {
  170 + id : "omenudataInterface11",
  171 + text : $trad("p20"),
  172 + url : "javascript:i3GEO.mapa.dialogo.telaRemota()"
  173 + }
  174 + ];
  175 +
  176 + i3GEO.gadgets.PARAMETROS.mostraMenuSuspenso.finaliza = 'if($i("omenudataInterface1")){i3GEOoMenuBar.getMenuItem("omenudataInterface1").cfg.setProperty("text", " ");}';
  177 +
  178 + i3GEO.cria();
  179 + i3GEO.configura.mapaRefDisplay = "none";
  180 + i3GEO.barraDeBotoes.TIPO = "olhodepeixe";
  181 + //ajusta o deslocamento da barra de botoes
  182 + i3GEO.barraDeBotoes.OFFSET = 25;
  183 + //ajusta a posicao da barra de botoes no IE
  184 + if (navm) {
  185 + i3GEO.barraDeBotoes.OFFSET = 25;
  186 + }
  187 + if (chro) {
  188 + i3GEO.barraDeBotoes.OFFSET = 30;
  189 + }
  190 +
  191 + i3GEO.configura.oMenuData["submenus"]["janelas"] = [];
  192 + i3GEO.ajuda.ATIVAJANELA = false;
  193 + i3GEO.idioma.IDSELETOR = "seletorIdiomas";
  194 + i3GEO.Interface.ATIVAMENUCONTEXTO = false;
  195 + //i3GEO.arvoreDeTemas.TIPOBOTAO = "radio";
  196 + i3GEO.arvoreDeTemas.OPCOESADICIONAIS.comentarios = true;
  197 + i3GEO.arvoreDeCamadas.VERIFICAABRANGENCIATEMAS = true;
  198 + i3GEO.arvoreDeCamadas.MOSTRALISTAKML = false;
  199 + i3GEO.mapa.AUTORESIZE = true;
  200 + i3GEO.guias.TIPO = "movel";
  201 + i3GEO.guias.guiaMovel.config.topGuiaMovel = 36;
  202 + i3GEO.janela.ativaAlerta();
  203 + i3GEO.finaliza = function() {
  204 + if ($i("i3GEOlogoMarca")) {
  205 + $i("i3GEOlogoMarca").style.display = "none";
  206 + }
  207 + i3GEO.mapa.insereDobraPagina(
  208 + "googlemaps",
  209 + "../imagens/dobragooglemaps.png");
  210 + };
  211 + //indica se a opcao de navegacao nas pastas do servidor sera ativada
  212 + i3GEO.arvoreDeTemas.OPCOESADICIONAIS.navegacaoDir = true;
  213 + i3GEO.janela.TRANSICAOSUAVE = true;
  214 +
  215 + OpenLayers.ImgPath = "../pacotes/openlayers/img/";
  216 + (function() {
  217 + var oce = new OpenLayers.Layer.ArcGIS93Rest("ESRI Ocean Basemap", "http://server.arcgisonline.com/ArcGIS/rest/services/Ocean_Basemap/MapServer/export", {
  218 + format : "jpeg"
  219 + }, {
  220 + isBaseLayer : true,
  221 + visibility : false
  222 + });
  223 + var ims = new OpenLayers.Layer.ArcGIS93Rest("ESRI Imagery World 2D", "http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_Imagery_World_2D/MapServer/export", {
  224 + format : "jpeg"
  225 + }, {
  226 + isBaseLayer : true,
  227 + visibility : false
  228 + });
  229 + var wsm = new OpenLayers.Layer.ArcGIS93Rest("ESRI World Street Map", "http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer/export", {
  230 + format : "jpeg"
  231 + }, {
  232 + isBaseLayer : true,
  233 + visibility : false
  234 + });
  235 + var bra = new OpenLayers.Layer.WMS("Base carto MMA", "http://mapas.mma.gov.br/cgi-bin/mapserv?map=/opt/www/html/webservices/baseraster.map", {
  236 + layers : "baseraster",
  237 + srs : "EPSG:4618",
  238 + format : "image/png",
  239 + isBaseLayer : false
  240 + }, {
  241 + isBaseLayer : true,
  242 + visibility : false
  243 + });
  244 +
  245 + var tms = new OpenLayers.Layer.TMS("OSGEO", "http://tilecache.osgeo.org/wms-c/Basic.py/", {
  246 + layername : "basic",
  247 + type : "png",
  248 + // set if different than the bottom left of map.maxExtent
  249 + tileOrigin : new OpenLayers.LonLat(-180, -90),
  250 + isBaseLayer : true,
  251 + visibility : false
  252 + });
  253 +
  254 + i3GEO.Interface.openlayers.LAYERSADICIONAIS = [
  255 + oce, ims, wsm, tms, bra
  256 + ];
  257 + })();
  258 +
  259 + i3GEO.inicia();
  260 + </script>
  261 +</body>
  262 +</html>
... ...