Archived:Static GoogleMaps API in JavaScript
The links to the API provided no longer work, and have been disabled. This may be fixed in future, but for the moment, this article should be considered of little or no use
Article Metadata
31 Jan
2010
Contents |
Overview
Archived: In this article, we create an API to retrieve static maps using the GoogleMaps® system. So, in this way, your work can be so much easier using this API made for JavaScript.
To get this API click: http://embedded.ufcg.edu.br/~artur/Maps/Map.zip and to see the API documentation click http://embedded.ufcg.edu.br/~artur/Maps/docs/index.html.
Examples
Now, we'll see some examples illustrating the use of the Map API.
Showing Maps Automatically
One way to retrieve the map is using the <div> tag. Put all the values you want to your map and use the showMap() tag. It's really necessary that you set the map id with the same value of the div.
/**
* Embedded Systems and Pervasive Computing Lab
* WRT Effort - http://efforts.embedded.ufcg.edu.br/wrt/
*
* @author Artur
*/
function init() {
map = new Map(40.702147, -74.015794);
map.id = "map";
map.color = "green";
map.name = "y";
map.width = 400;
map.height = 200;
map.showMap();
}
Retrieving the map's source
Other way to retrieve the map is using the <img> tag. You set the parameters and using the method getSource() you can define the src value.
/**
* Embedded Systems and Pervasive Computing Lab
* WRT Effort - http://efforts.embedded.ufcg.edu.br/wrt/
*
* @author Artur
*/
function init() {
map = new Map(40.702147, -74.015794);
map.color = "blue";
map.name = "x";
map.width = 300;
map.height = 300;
document.getElementById("map").src = map.getSource();
}
So,
Using external data source, like GPS
First, getting the GPS information. You define the device operations:
/**
* Embedded Systems and Pervasive Computing Lab
* WRT Effort - http://efforts.embedded.ufcg.edu.br/wrt/
*
* @author Artur
*/
function setup()
{
try {
so = device.getServiceObject("Service.Location", "ILocation");
getLocation();
}
catch (e) {
alert('(006) Error ::setup ' + e);
}
}
After that, the get location method:
function getLocation() {
try {
var updateoptions = new Object();
updateoptions.PartialUpdates = false;
var criteria = new Object();
criteria.LocationInformationClass = "GenericLocationInfo";
criteria.Updateoptions = updateoptions;
var result = so.ILocation.GetLocation(criteria, result);
var errCode = result.ErrorCode;
if (errCode) {
alert("(005) GPS Error: " + errCode + " " + result.ErrorMessage);
}
} catch (e) {
alert("(004) ::getLocation error: " + e);
}
}
Finally, the call back function:
function result(transId, eventCode, result)
{
var errCode = result.ErrorCode;
if (errCode) {
alert("(003) GPS Error: " + errCode + " " + result.ErrorMessage);
}
else {
map = new Map(result.ReturnValue.Latitude,
result.ReturnValue.Longitude);
map.id = "map";
map.color = "yellow";
map.name = "Artur";
map.width = 500;
map.height = 250;
map.showMap();
}
}
If you like it and want to see these examples, click http://embedded.ufcg.edu.br/~artur/Maps/Maps-Examples.zip to get the first two examples and http://embedded.ufcg.edu.br/~artur/Maps/MapsGPS.wgz to get the GPS example.
Footnote
- This article is authored by Artur Farias (artur [at] embedded [dot] ufcg [dot] edu [br])
- More information at http://efforts.embedded.ufcg.edu.br/wrt/
