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>
<style type='text/css'>
.siteWatchEdit-markerCssConfig div {
background-color: #ffffff;
background-color: rgba(255,255,255,0.55);
padding: 1px 3px;
font-family: arial;
font-size: 15px;
border-radius: 3px;
}
</style>
<script type='text/javascript'>
//A map object variable.
var map;
//Create a map object.
function InitMap() {
var zoomLevel = 0;
var centerX = 500000;
var centerY = 500000;
map = SWMap.create('map',
{ panButton: true, zoomButton: true,
defaultZoom: zoomLevel, defaultCenterPoint: { x: centerX, y: centerY }
});
showLoc();
};
function showLoc() {
map.ShowMyLocation({
showOnStart: true,
setView: true,
//error: function errorResult(e) { alert(e); },
accuracy: 1000001, // default is 1000001, in meters.
options: { enableHighAccuracy: true, timeout: 21000, maximumAge: 1000 },
marker: { showMarker: false },
vectorCircle: { config: { fillColor: 'rgba(255, 0, 0, 0.4)', lineColor: 'rgb(255, 0, 0)', lineWidth: 2, minSize: 5 } }
});
};
function showLocTrue() {
showLoc();
};
function showLocFalse() {
map.ShowMyLocation(false);
};
</script>
</head>
<body onload='InitMap();'>
<div id='map' style='height:300px; width:600px;'></div>
<div>
Show location ?
<button onclick='showLocTrue()'>Yes</button>
<button onclick='showLocFalse()'>No</button>
</div>
</body>
</html>
|