openlayersdebug.htm 11.1 KB
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Category" content="i3Geo Mapa interativo MMA geoprocessamento sig mobile">
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>i3GEO - OpenLayers</title>
<script src="../pacotes/ol3/ol-debug.js"></script>
<script src="../js/i3geonaocompacto.js"></script>
<link rel="stylesheet" type="text/css" href="../css/black.css">
<link rel="stylesheet" type="text/css" href="../pacotes/ol3/ol.css">
<style>
.ol-zoom {
	padding-left: 4px;
	padding-right: 4px;
	top: 2em;
}

.ol-zoomslider {
	top: 6em;
}

.ol-attribution img {
	display: none;
}

.ol-attribution.ol-uncollapsible {
	height: 2.1em;
	right: 24px;
	background: none;
	margin-bottom: 15px;
}

</style>
</head>
<body id="i3geo" style='margin-left: 7px; background: white;'>

	<!-- inclui o nome do usuario logado -->
	<div id="i3GEONomeLogin" style="position: absolute; left: 10px; top: 12px; font-size: 11px; z-index: 50000"></div>
	<table id='mst' summary="" style='display: none;' width=100% cellspacing='0'>
		<tr>
			<td id="contemMenu" style="background: black; height: 30px; text-align: right; border-width: 0pt 0pt 1px; border-color: rgb(240, 240, 240)">
				<!--menu suspenso-->
				<div id="menus" style="height: 30px;"></div>
			</td>
		</tr>
		<tr>
			<td style="vertical-align: top; border-width: 0px;">
				<table width="100%" style="vertical-align: top; border-width: 0px">
					<tr>
						<td class=verdeclaro id=contemImg>
							<div id=corpoMapa style="position: relative; background-image: url('../imagens/i3geo1bw.jpg');"></div>
						</td>
					</tr>
				</table>
			</td>
		</tr>
		<tr>
			<td>
				<table style="width: 100%; height: 28px">
					<tr>
						<td class=fundoRodape style="width: 25%">
							<!-- aqui ser&aacute; inclu&iacute;da a escala num&eacute;rica -->
							<div id=escala style="margin: auto; text-align: right; left: 15px;"></div>
						</td>
						<td class=fundoRodape style="width: 5%"></td>
						<td class=fundoRodape style="width: 40%">
							<!-- aqui ser&aacute; inclu&iacute;do o gadget que mostra a coordenada geogr&aacute;fica da posi&ccedil;&atilde;o do mouse -->
							<div id=localizarxy style="margin: auto; text-align: left; font-size: 10px; display: inline-table"></div>
						</td>
						<td class=fundoRodape style="width: 20%">
							<!-- bot&atilde;o de compartilhamento em redes sociais-->
							<!--<div id=i3GEOcompartilhar style="width: 170px; margin: auto; text-align: left; padding-top: 1px"></div> -->
							<!-- aqui ser&aacute; inclu&iacute;do o contador de tempo quando o temporizador de redesenho do mapa estiver ativo -->
							<div id=tempoRedesenho style="z-index: 100; position: absolute; top: 0px; color: green; background-color: black; width: 50px; display: none"></div>
						</td>
						<!-- aqui ser&atilde;o inclu&iacute;das as bandeiras que permitem a troca de idioma -->
						<td class=fundoRodape style="width: 10%;">
							<div id=seletorIdiomas style="right: 15px;"></div>
						</td>
					</tr>
				</table>
			</td>
		</tr>
	</table>
	<table id="i3GEOlogoMarca" style='margin: 0px auto; box-shadow: 0 1px 13px gray; border-radius: 5px;'>
		<tr>
			<td style="height: 30px">
				<div id=versaoi3geo></div>
				<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>
				<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>
		</tr>
		<tr>
			<td style="padding: 10px;">
				<img style="width: 560px; height: 81px" alt="" src='../imagens/logo_inicio.png'>
			</td>
		</tr>
		<tr>
			<td>
				<!--
			<script id="ohloh" type="text/javascript" src="http://www.ohloh.net/p/150688/widgets/project_users.js?style=red"></script>
			-->
			</td>
		</tr>
	</table>

	<div id="i3GEOguiaMovel" style="visibility: hidden; position: absolute; display: block; border: 0px solid white; text-align: left; z-index: 2000; background-color: none">
		<div style="cursor: pointer; position: absolute; top: 50%; margin-top: -65px; width: 30px; z-index: 5000; left: 18px;">
			<div id="iconeGuia_temas"></div>
			<div id="iconeGuia_adiciona" style="margin-top: 3px;"></div>
			<div id="iconeGuia_legenda" style="margin-top: 3px;"></div>
			<div id="iconeGuia_dobraPagina" style="margin-top: 3px;"></div>
		</div>
		<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">
			<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'>
				<div id='guia1obj' style='display: none;'>
					<!-- 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 -->
					<div style='left: 5px; top: 10px; width: 150px;' id=buscaRapida></div>
					<!--	Esta div acrescenta a lista de propriedades do mapa -->
					<!--<div id=listaPropriedades style='top:15px;' ></div>-->
					<!--	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 -->
					<div id=listaLayersBase style='top: 15px;'></div>
					<!--	Esta div acrescenta a lista de de camadas dispon&iacute;veis no mapa atual -->
					<div id=listaTemas style='top: 15px;'></div>
				</div>
				<div id='guia2obj' style='display: none;'>
					Aguarde...
					<img alt="" src="../imagens/branco.gif" width=248 />
				</div>
				<div id='guia4obj' style='display: none; text-align: left'>
					<div id='legenda' style='text-align: left'></div>
				</div>
				<!--
			<div id='guia5obj' style='display:none;text-align:left'><div id='banners' style='overflow:auto;text-align:left'>Aguarde...</div></div>
			 -->
			</div>
		</div>
	</div>
	<script>
		i3GEO.configura.locaplic = i3GEO.util.protocolo() + "://" + window.location.host + "/i3geo";
		i3GEO.configura.autotamanho = false;
		i3GEO.Interface.ATUAL = "openlayers";
		i3GEO.Interface.IDCORPO = "contemImg";
		i3GEO.gadgets.PARAMETROS.mostraMenuSuspenso.permiteLogin = true;

		i3GEO.Interface.openlayers.TILES = true;
		i3GEO.Interface.openlayers.googleLike = false;

		i3GEO.configura.guardaExtensao = true;
		i3GEO.gadgets.PARAMETROS.mostraMenuSuspenso.finaliza =
			'if($i("omenudataInterface1")){i3GEOoMenuBar.getMenuItem("omenudataInterface1").cfg.setProperty("text", " ");}';

		i3GEO.cria();
		i3GEO.configura.mapaRefDisplay = "none";
		i3GEO.barraDeBotoes.ATIVA = true;
		i3GEO.barraDeBotoes.TIPO = "olhodepeixe";
		//ajusta o deslocamento da barra de botoes
		i3GEO.barraDeBotoes.OFFSET = 11;
		//ajusta a posicao da barra de botoes no IE
		if (navm) {
			i3GEO.barraDeBotoes.OFFSET = 5;
		}
		if (chro) {
			i3GEO.barraDeBotoes.OFFSET = 15;
		}

		i3GEO.configura.oMenuData["submenus"]["janelas"] = [];
		i3GEO.ajuda.ATIVAJANELA = false;
		i3GEO.idioma.IDSELETOR = "seletorIdiomas";

		//i3GEO.arvoreDeTemas.TIPOBOTAO = "radio";
		i3GEO.arvoreDeTemas.OPCOESADICIONAIS.comentarios = true;
		i3GEO.arvoreDeCamadas.VERIFICAABRANGENCIATEMAS = true;
		i3GEO.arvoreDeCamadas.MOSTRALISTAKML = false;
		i3GEO.arvoreDeCamadas.MOSTRATITULO = true;
		i3GEO.mapa.AUTORESIZE = true;
		i3GEO.guias.TIPO = "movel";
		i3GEO.guias.guiaMovel.config.topGuiaMovel = 36;
		i3GEO.janela.ativaAlerta();
		i3GEO.finaliza = function() {
			if ($i("i3GEOlogoMarca")) {
				$i("i3GEOlogoMarca").style.display = "none";
			}
			//i3GEO.mapa.insereDobraPagina("googlemaps", "../imagens/dobragooglemaps.png");
		};
		//indica se a opcao de navegacao nas pastas do servidor sera ativada
		i3GEO.arvoreDeTemas.OPCOESADICIONAIS.navegacaoDir = true;
		i3GEO.janela.TRANSICAOSUAVE = true;
		//desliga a camada com o mapa mundi
		i3GEO.configura.mashuppar = "&desligar=mundo";
		(function() {
			var eng = new ol.layer.Tile({
				title : "ESRI National Geographic",
				visible : true,
				isBaseLayer : true,
				name : "eng",
				source : new ol.source.TileArcGISRest({
					url : "http://server.arcgisonline.com/ArcGIS/rest/services/NatGeo_World_Map/MapServer",
					attributions: [
						new ol.Attribution({
							html: 'Tiles &copy; <a href="http://server.arcgisonline.com/ArcGIS/rest/services/NatGeo_World_Map/MapServer">ArcGIS</a>'
						})
					]
				})
			});
			var oce = new ol.layer.Tile({
				title : "ESRI Ocean Basemap",
				visible : false,
				isBaseLayer : true,
				name : "oce",
				source : new ol.source.TileArcGISRest({
					url : "http://server.arcgisonline.com/ArcGIS/rest/services/Ocean_Basemap/MapServer",
					attributions: [
						new ol.Attribution({
							html: 'Tiles &copy; <a href="http://server.arcgisonline.com/ArcGIS/rest/services/Ocean_Basemap/MapServer">ArcGIS</a>'
						})
					]
				})
			});
			var ims = new ol.layer.Tile({
				title : "ESRI Imagery World 2D",
				visible : false,
				isBaseLayer : true,
				name : "ims",
				source : new ol.source.TileArcGISRest({
					url : "http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_Imagery_World_2D/MapServer",
					attributions: [
						new ol.Attribution({
							html: 'Tiles &copy; <a href="http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_Imagery_World_2D/MapServer">ArcGIS</a>'
						})
					]
				})
			});
			var wsm = new ol.layer.Tile({
				title : "ESRI World Street Map",
				visible : false,
				isBaseLayer : true,
				name : "wsm",
				source : new ol.source.TileArcGISRest({
					url : "http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer",
					attributions: [
						new ol.Attribution({
							html: 'Tiles &copy; <a href="http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer">ArcGIS</a>'
						})
					]
				})
			});
			var bra = new ol.layer.Tile({
				title : "Base carto MMA",
				visible : false,
				isBaseLayer : true,
				name : "bra",
				source : new ol.source.TileWMS({
					url : "http://mapas.mma.gov.br/cgi-bin/mapserv?map=/opt/www/html/webservices/baseraster.map&",
					params : {
						'layers' : "baseraster",
						'srs' : "EPSG:4326",
						'format' : "image/png"
					}
				})
			});
			var tms = new ol.layer.Tile({
				title : "OSGEO",
				visible : false,
				isBaseLayer : true,
				name : "tms",
				source : new ol.source.TileWMS({
					url : "http://tilecache.osgeo.org/wms-c/Basic.py/",
					params : {
						'layers' : "basic",
						'type' : "png",
						'srs' : "EPSG:4326",
						'format' : "image/png",
						'VERSION' : '1.1.1'
					},
					attributions: [
						new ol.Attribution({
							html: '&copy; <a href="http://www.tilecache.org/">2006-2010, TileCache Contributors</a>'
						})
					]
				})
			});
			i3GEO.Interface.openlayers.LAYERSADICIONAIS = [
				eng, oce, ims, wsm, bra, tms
			];
		})();
		i3GEO.inicia();
	</script>
</body>
</html>