UEFA3
Prøv den også på mobiltelefonen.
Illustrasjonene nedenfor er øyeblikksbilder fra februar 2015.
JSON
Data om klubber og arenaer er samlet sammen fra klubbenes og arenaenes hjemmesider og fra Wikipedia. Det er en overkommelig jobb å samle/skrape dette i XML-filer og så produsere JSON-filer.
Utdrag fra en JSON-fil som viser klubber i SpanskPrimera division:
Alle data som beskriver lag og arenaer lastes opp når websiden lastes. JSON-dataene inkluderes som i <script> - tagger. Det er altså ikke behov for serves-access når websiden første er lastet. I øyeblikket er de to øverste nivåene i Norge, Sverige, Danmark, England, Nederland, Frankrike, Tyskland, Spania og Portugal tatt med.
Kart
Kartet er basert på Googles Map API. Javascript kode som viser kart (utdrag):
// make markers for arenas function makeMarker(arena,map){ var lat=parseFloat(arena.Lat); var lng=parseFloat(arena.Lng); latmin=Math.min(latmin,lat); latmax=Math.max(latmax,lat); lngmin=Math.min(lngmin,lng); lngmax=Math.max(lngmax,lng); var latlng=new google.maps.LatLng(lat,lng); mrk=new google.maps.Marker({ position: latlng, map: map, visible:true, title:arena.Name, }); google.maps.event.addListener(mrk, 'click', function(event) { curArena=arena; hiliteArena(); hiliteTeamsFromArenaSelection(); }); return mrk; } // Viser fram et kart avgrenset av arenaene function visKart() { Markerlist=[]; resetBounds(); // plasser kartet i elementet med ID: map_canvas map = new google.maps.Map(document.getElementById("map_canvas"),{ mapTypeId: google.maps.MapTypeId.HYBRID }); for(ix=0;ix<arenaData.length;ix++){ Markerlist.push(makeMarker(arenaData[ix],map)); } mbounds=new google.maps.LatLngBounds(new google.maps.LatLng(latmin,lngmin), new google.maps.LatLng(latmax,lngmax)); map.fitBounds(mbounds); }
Widgets
Siden inneholder også den oppdaterte tabellen for den valgte ligaen. Denne komponenten leveres av SoccerWay [2] som har en masse data om fotball i hele verden. De tilbyr widgets som viser oppdaterte tabeller. En slik inkluderes på siden med en enkel iframe.
<iframe src="https://widgets.soccerway.com/widget/free...." width="350" height="500" scrolling="no" frameborder="0" marginwidth="0" marginheight="0"> </iframe>
En rekke spesifikasjoner er erstattet med ..... Soccerway har et verktøy der du kan spesifisere en rekke ting når du setter opp importformatet, vilken liga du vil ha, farger etc.