SiteWatch API Examples.
Copyright © 2011 - 2024 Samsýn ehf. All Rights Reserved.

KEYCODE
 
BASIC
Simple map
Simple marker
Simple line
Simple circle
Simple track location
 
ADVANCED
Complex marker
Map coordinate
Project coordinate
Points routing
Address search
Complex track location
Json config
Custom canvas
 
Configuration:
Radius:
Line width:
StrokeColor:
FillColor:
X:
Y:
 
Map (This is how the map looks like based on the configuration on the left):
Code (This is how the code looks like based on the configuration above. It can be copied and pasted directly into your project):
                                    
<html> <head> <title>SiteWatch API Example Viewer</title> <script src='http://kort.samsyn.is/api/SiteWatch.aspx?v=2&key=your_keycode' type='text/javascript'></script> <script type='text/javascript'> //A map object variable. var map; //Create a map object. function InitMap() { map = SWMap.create('map', { panButton: false, zoomButton: false, defaultZoom: 7, defaultCenterPoint: { x: 359583, y: 406481 } }); function Draw(map, context, customCanvas) { //Get coordinates in canvas from ISN93 point. var winX = customCanvas.xToWinX(359583); var winY = customCanvas.yToWinY(406481); context.beginPath(); context.arc(winX, winY, 16, 0, 2 * Math.PI, false); context.fillStyle = 'rgba(255,0,0,0.5)'; context.fill(); context.lineWidth = 4; context.strokeStyle = 'darkgreen'; context.stroke(); }; //Create custom canvas. map.addCustomCanvas('customCanvas', Draw); } </script> </head> <body onload='InitMap()'> <div id='map' style='height:300px; width:600px;'></div> </body> </html>