• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Gis SAPO Hands On
 

Gis SAPO Hands On

on

  • 1,896 views

 

Statistics

Views

Total Views
1,896
Views on SlideShare
1,896
Embed Views
0

Actions

Likes
0
Downloads
14
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Gis SAPO Hands On Gis SAPO Hands On Document Transcript

    • SAPO GIS Hands-On Guião Includes: <script type=quot;text/javascriptquot; src=quot;http://mapas.sapo.pt/codebits/api_bundle.phpquot;></script> <link rel=quot;Stylesheetquot; href=quot;http://mapas.sapo.pt/codebits/DraggableWindow.cssquot; /> 1. Adicionar o mapa a um site map = new SAPO.Widget.Maps({divid:quot;mapquot;, width: 1600, height: 750}); 2. Adicionar um marcador map.addMarker(38.70216, -9.17848, 'Codebits@LX Factory'); 2.1. Personalizar o marcador adicionado var opts = { icon: { image: quot;http://mapas.sapo.pt/imgs/feed.pngquot;, iconSize: { width: 20, height: 20 }, infoWindowAnchor: { x: 0, y: 0 }, iconAnchor: { x: 10, y: 10 }, display_titles: false }, opened: false, selected: false, permanent: true, click_callback: function(marker){ alert(quot;clickedquot;); } }; map.addMarker(38.70216,-9.17848,'Codebits@LX Factory','codebitsLayer', opts); 3. Adicionar feeds GeoRSS map.getGeoRSSMarkers(quot;http://services.sapo.pt/Traffic/GeoRSSquot;, function (markers){map.addGeoRSSMarkers(markers, {layer: quot;trafficLayerquot;, iconURL: quot;images/traffic.pngquot;, iconWidth: 10, iconHeight: 19});});
    • 4. Usar o serviço GIS para obter conteúdos georreferenciados 4.1. Obter lista de categorias function fillCategories(){ var syndicationObj = new SAPO.Communication.Syndication(); syndicationObj.push(quot;http://services.sapo.pt/GIS/GetCategoriesJSONquot;, {timeout: 4,onComplete: function(obj, args){categoriesCompleted(obj,args);}}); syndicationObj.runAll(); } function categoriesCompleted(obj, args){ var result = obj.GetCategoriesResponse.GetCategoriesResult; var select = document.getElementById(quot;categoriesquot;); for(var idx = 0; idx < result.Category.length; ++idx){ select.options[idx] = new Option(result.Category[idx].CategoryName, result.Category[idx].CategoryId); } } 4.2. Pedir POIs por categoria e adicionar marcadores dinamicamente function addFromSelectedCategory(){ var bounds = map.getBoundsLatLng(); var select = document.getElementById(quot;categoriesquot;); var categoryId = select.options[select.selectedIndex].value; var url = quot;http://services.sapo.pt/GIS/GetPOIByBoundingBoxJSON?latitude1=quot;+bounds.maxY+quot;&longitude1=quot;+bound s.maxX+quot;&latitude2=quot;+bounds.minY+quot;&longitude2=quot;+bounds.minX+quot;&categoryId=quot;+categoryId+ quot;&matchlevelId=0&trustlevelId=0&recordsPerPage=100quot;; var syndicationObj = new SAPO.Communication.Syndication(); syndicationObj.push(url,{timeout: 4, onComplete: function(obj, args){selectedCategoryCompleted(obj,args);}}); syndicationObj.runAll(); } function selectedCategoryCompleted(obj, args){ var result = obj.GetPOIByBoundingBoxResponse.GetPOIByBoundingBoxResult; for(var idx = 0; idx < result.POI.length; ++idx) { map.addMarker(result.POI[idx].Latitude, result.POI[idx].Longitude, result.POI[idx].Name); } }
    • 5. Divisões administrativas 5.1. Consultar os dados dos municípios através das operações do serviço GIS (ver em services.sapo.pt) e guardar num elemento select. function fillMunicipalities(){ var syndicationObj = new SAPO.Communication.Syndication(); syndicationObj.push( quot;http://services.sapo.pt/GIS/GetMunicipalitiesSortedByNameJSONquot;,{timeout: 4, onComplete: function(obj, args){municipalitiesCompleted(obj,args);}}); syndicationObj.runAll(); } function municipalitiesCompleted(obj, args){ var result = obj.GetMunicipalitiesSortedByNameResponse.GetMunicipalitiesSortedByNameResult; var select = document.getElementById(quot;municipalitiesquot;); for(var idx = 0; idx < result.Municipality.length; ++idx) { select.options[idx] = new Option(result.Municipality[idx].MunicipalityName, result.Municipality[idx].MunicipalityId); } select.selectedIndex = 0; } 5.2. Utilizar uma operação do serviço GIS que permita fazer um pedido através do código de um município (ex.: GetPOIByMunicipalityIdAndCategoryId) function search(){ var syndicationObj = new SAPO.Communication.Syndication(); var municipalities = document.getElementById(quot;municipalitiesquot;); var municipalityId = municipalities.options[municipalities.selectedIndex].value; var categories = document.getElementById(quot;categoriesquot;); var categoryId = categories.options[categories.selectedIndex].value; syndicationObj.push( quot;http://services.sapo.pt/GIS/GetPOIByMunicipalityIdAndCategoryIdJSON?municipalityId=quot;+municipalit yId+quot;&categoryId=quot;+categoryId+quot;&matchlevelId=0&trustlevelId=0&recordsPerPage=10quot;,{timeout: 4, onComplete: function(obj, args){searchCompleted(obj,args);}, onTimeout: function(){alert(quot;timeoutquot;);}}); syndicationObj.runAll(); } function searchCompleted(obj, args){ var result = obj.GetPOIByMunicipalityIdAndCategoryIdResponse.GetPOIByMunicipalityIdAndCategoryIdResult; for(var idx = 0; idx < result.POI.length; ++idx) { map.addMarker(result.POI[idx].Latitude, result.POI[idx].Longitude, result.POI[idx].Name); } }
    • 6. Estatísticas 6.1. Utilizar um feed que devolve estatísticas para a área visível e actualizar os marcadores de cada vez que houver uma actualização no mapa Feed: http://services.sapo.pt/GISStatistics/GetStatisticsForCategoriesInGeoRSS?minLatitude=37.23608& minLongitude=-13.04962&maxLatitude=38.09214&maxLongitude=-7.70803 Evento: addMapStateChangeListener function statisticsByCategory(enable){ if(enable){ refreshStatisticsByCategory(); statisticsListener = map.addMapStateChangeListener(refreshStatisticsByCategory); } else{ map.removeMapStateChangeListener(statisticsListener); map.removeLayer(quot;statisticsLayerquot;); } } function refreshStatisticsByCategory(){ map.removeLayer(quot;statisticsLayerquot;); var bounds = map.getBoundsLatLng(); map.getGeoRSSMarkers( quot;http://services.sapo.pt/GISStatistics/GetStatisticsForCategoriesInGeoRSS?minLatitu de=quot;+bounds.minY+quot;&minLongitude=quot;+bounds.minX+quot;&maxLatitude=quot;+bounds.maxY+quot;&maxLongitude=quot; +bounds.maxX, function(markers){map.addGeoRSSMarkers(markers, {layer: statisticsLayerquot;});}); } 6.2. Mostrar no mapa os últimos POIs georreferenciados, com actualização periódica Ver operação GetLastPOIs Utilizar o serviço Transformer para transformar o XML dos POIs em GeoRSS: http://services.sapo.pt/Transformer/GisPoiToGeoRSS?url={url url-encoded} Função Javascript setInterval function lastGeoReferencedPOIs(enable){ if(enable){ statisticsInterval = setInterval(function(){ map.getGeoRSSMarkers(quot;http://services.sapo.pt/Transformer/GisPoiToGeoRSS?url=http%3A%2F%2F services.sapo.pt%2FGIS%2FGetLastPOIs%3FrecordsPerPage%3D10quot;, function(markers){ map.removeLayer(quot;statisticsLayerquot;); map.addGeoRSSMarkers(markers, {layer: quot;statisticsLayerquot;, displayTitle: true});});}, 2000); } else{ clearInterval(statisticsInterval); map.removeLayer(quot;statisticsLayerquot;); } }