1. 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});});

2. 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);
}
}

3. 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);
}
}

4. 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;);
}
}