×
Namespaces

Variants
Actions
(Difference between revisions)

HERE Maps API - Managing map Features

From Nokia Developer Wiki
Jump to: navigation, search
hamishwillee (Talk | contribs)
m (Hamishwillee - Remove redundant categories)
jasfox (Talk | contribs)
m (Jasfox - update to 2.2.4)
(9 intermediate revisions by 3 users not shown)
Line 1: Line 1:
[[Category:Nokia Maps]][[Category:JavaScript]][[Category:Code Snippet]]
+
[[Category:Nokia Maps]][[Category:JavaScript]][[Category:Code Snippet]][[Category:Nokia Maps]]
 
{{Abstract|This article explains how to use Nokia Maps API class {{Icode|Nokia.Features}}.}}  
 
{{Abstract|This article explains how to use Nokia Maps API class {{Icode|Nokia.Features}}.}}  
  
{{ArticleMetaData
+
{{ArticleMetaData <!-- v1.2 -->
 
|sourcecode= <!-- Link to example source code e.g. [[Media:The Code Example ZIP.zip]] -->
 
|sourcecode= <!-- Link to example source code e.g. [[Media:The Code Example ZIP.zip]] -->
 
|installfile= <!-- Link to installation file (e.g. [[Media:The Installation File.sis]]) -->
 
|installfile= <!-- Link to installation file (e.g. [[Media:The Installation File.sis]]) -->
|devices= <!-- Devices tested against - e.g. ''devices=Nokia 6131 NFC, Nokia C7-00'') -->
+
|devices= Internet Explorer, Firefox, Google Chrome, Opera
 
|sdk= <!-- SDK(s) built and tested against (e.g. [http://linktosdkdownload/ Nokia Qt SDK 1.1]) -->
 
|sdk= <!-- SDK(s) built and tested against (e.g. [http://linktosdkdownload/ Nokia Qt SDK 1.1]) -->
|platform= <!-- Compatible platforms - e.g. Symbian^1 and later, Qt 4.6 and later -->
+
|platform= Web
 
|devicecompatability= <!-- Compatible devices e.g.: All* (must have internal GPS) -->
 
|devicecompatability= <!-- Compatible devices e.g.: All* (must have internal GPS) -->
|dependencies=Nokia Maps 2.1.0
+
|dependencies= Nokia Maps 2.2.4
|signing=<!-- Signing requirements - empty or one of: Self-Signed, DevCert, Manufacturer -->
+
|signing= <!-- Signing requirements - empty or one of: Self-Signed, DevCert, Manufacturer -->
|capabilities=<!-- Capabilities required by the article/code example (e.g. Location, NetworkServices. -->
+
|capabilities= <!-- Capabilities required by the article/code example (e.g. Location, NetworkServices. -->
|keywords= <!-- APIs, classes and methods (e.g. QSystemScreenSaver, QList, CBase -->
+
|keywords= Nokia Maps, JavaScript, Features
|id= <!-- Article Id (Knowledge base articles only) -->
+
|language= <!-- Language category code for non-English topics - e.g. Lang-Chinese -->
|language=<!-- Language category code for non-English topics - e.g. Lang-Chinese -->
+
|translated-by= <!-- [[User:XXXX]] -->
|review-by=<!-- After re-review: [[User:username]] -->
+
|translated-from-title= <!-- Title only -->
|review-timestamp=<!-- After re-review: YYYYMMDD -->
+
|translated-from-id= <!-- Id of translated revision -->
|update-by=<!-- After significant update: [[User:username]]-->
+
|review-by= <!-- After re-review: [[User:username]] -->
|update-timestamp=<!-- After significant update: YYYYMMDD -->
+
|review-timestamp= <!-- After re-review: YYYYMMDD -->
|creationdate=20111114
+
|update-by= <!-- After significant update: [[User:username]]-->
|author=[[User:Maveric]]
+
|update-timestamp= <!-- After significant update: YYYYMMDD -->
 +
|creationdate= 20111114
 +
|author= [[User:Maveric]]
 +
}}
 +
{{SeeAlso|
 +
*  [http://developer.here.net/javascript_api Nokia Maps API] 
 +
* [[Nokia Maps API - Asynchronous Loading|Asynchronous Map Loading]]
 
}}
 
}}
  
Line 31: Line 37:
 
By default the API loads all possible features in the optimal implementation for the environment in which it runs. However, the loading of certain features may also be deferred by explicitly disallowing certain or all features at page load time. This may reduce the initial page load time as not all of the API's code is transferred and executed during the page's start up.
 
By default the API loads all possible features in the optimal implementation for the environment in which it runs. However, the loading of certain features may also be deferred by explicitly disallowing certain or all features at page load time. This may reduce the initial page load time as not all of the API's code is transferred and executed during the page's start up.
  
The Features object makes possible to load individual features of the API manually. It automatically resolves dependencies between different features and provides mechanisms to detect the best feature implementation for the current environment.
+
The {{Icode|Features}} object makes it possible to load individual features of the API manually. It automatically resolves dependencies between different features and provides mechanisms to detect the best feature implementation for the current environment.
  
The Features object is a static object that is not to be instantiated, it is intented to be used directly instead.
+
The {{Icode|Features}} object is a static object that is not to be instantiated, it is intended to be used directly instead.
  
 
== Example use ==
 
== Example use ==
  
In the example below we first need to have the Nokia Maps instantiated. Please use the following code to get the Nokia Maps visible first. You can use either Firefox with Firebug, or Chrome's tools or what debug tool you prefer.
+
In the example below we first need to have the Nokia Maps instantiated. Please use the following code to get the Nokia Maps visible first. You can use either Firefox with Firebug, or Chrome's tools or whichever debugging tool you prefer.
  
<code java>
+
<code javascript>
 
<html>
 
<html>
 
<head>
 
<head>
<script type="text/javascript" charset="UTF-8" src="http://api.maps.nokia.com/2.0.0/jsl.js?">
+
<script type="text/javascript" src="http://api.maps.nokia.com/2.2.4/jsl.js" charset="utf-8">
 
</script>
 
</script>
 
</head>
 
</head>
Line 48: Line 54:
 
<div id="map" style="width:100%; height:100%;"></div>
 
<div id="map" style="width:100%; height:100%;"></div>
 
<script type="text/javascript">
 
<script type="text/javascript">
 +
// Don't forget to set your API credentials
 +
nokia.Settings.set( "appId", "YOUR APP ID GOES HERE");
 +
nokia.Settings.set( "authenticationToken", "YOUR AUTHENTICATION TOKEN GOES HERE");
 +
 
var map = new nokia.maps.map.Display(document.getElementById("map"),   
 
var map = new nokia.maps.map.Display(document.getElementById("map"),   
 
{    components: [ new nokia.maps.map.component.Behavior(),],                               
 
{    components: [ new nokia.maps.map.component.Behavior(),],                               
Line 73: Line 83:
 
Based on this information, we can find out that all the components that are listed are currently loaded, and we will also be able to see how many instances there are of them, so "[1]" means there is one loaded.
 
Based on this information, we can find out that all the components that are listed are currently loaded, and we will also be able to see how many instances there are of them, so "[1]" means there is one loaded.
 
    
 
    
You can reveal the rest with “more…”. Please note that it depends on your map implementation ofcourse, how many features there are, this is just given as an example. After clicking "more..." you could see e.g.:
+
You can reveal the rest with “more…”. Please note that it depends on your map implementation of course, how many features there are, this is just given as an example. After clicking "more..." you could see e.g.:
  
 
<code java>  
 
<code java>  
Line 94: Line 104:
 
</code>
 
</code>
  
The method getLoadedMap() will return a map of all registered feature implementations per feature.  
+
The method {{Icode|getLoadedMap()}} will return a map of all registered feature implementations per feature.  
  
 
To use this information in our own code, we could do e.g. like this:
 
To use this information in our own code, we could do e.g. like this:
Line 103: Line 113:
 
</code>
 
</code>
  
Alert window could display now : "You have the current UI feature loaded: nokia_generic"
+
An {{Icode|Alert}} window could display now : "You have the current UI feature loaded: nokia_generic"
  
 
Please note:  
 
Please note:  
 
In the version 2.0 of the API the old UI package "ovi_web" is still accessible, but will be deprecated in an oncoming release.
 
In the version 2.0 of the API the old UI package "ovi_web" is still accessible, but will be deprecated in an oncoming release.
  
With the method isLoaded we can find out if certain feature implementation has been successfully loaded. The method returns a Boolean value of "true / false". The quuery will result in "true" only if the queried implementation was fully loaded, meaning it was both transmitted and evaluated. Method will throw an exception if either feature or implementation are unknown.
+
With the method {{Icode|isLoaded()}} we can find out if certain feature implementation has been successfully loaded. The method returns a Boolean value of "{{Icode|true}} / {{Icode|false}}". The query will result in {{Icode|true}} only if the queried implementation was '''fully''' loaded, meaning it was both transmitted and evaluated. The method will throw an exception if either feature or implementation are unknown.
  
 
The following code line would issue a query to check if the UI feature's ovi_web implementation is loaded.
 
The following code line would issue a query to check if the UI feature's ovi_web implementation is loaded.
Line 117: Line 127:
 
</code>
 
</code>
  
In our case the query returned a value of "false".
+
In our case the query returned a value of {{Icode|false}}.
  
Loading a new set of specified features is done with the "load" method. Optionally you can set an onSuccess and an onError callback, plus define the target document into which the respective script tags should be appended. The feature request is expected to be specified as an object where the keys represent the features and their values represent the implementation name.
+
Loading a new set of specified features is done with the "load" method. Optionally you can set an {{Icode|onSuccess}} and an {{Icode|onError}} callback, plus define the target document into which the respective script tags should be appended. The feature request is expected to be specified as an object where the keys represent the features and their values represent the implementation name.
  
As in the previous code we had checked for the existence of the "ovi_web" UI component, and got back the result that it is not loaded ("false") then we could attempt to load it as follows:
+
As in the previous code we had checked for the existence of the "ovi_web" UI component, and got back the result that it is not loaded ({{Icode|false}}) then we could attempt to load it as follows:
  
 
Loading e.g. both "ovi_web" UI and "search":
 
Loading e.g. both "ovi_web" UI and "search":
  
<code java>
+
<code javascript>
 
>>> nokia.Features.load({"ui":"ovi_web", "search":"auto"});
 
>>> nokia.Features.load({"ui":"ovi_web", "search":"auto"});
 
</code>
 
</code>
Line 131: Line 141:
 
Check if the load was successful. Please note that in an online app you should use the callbacks to check for success.
 
Check if the load was successful. Please note that in an online app you should use the callbacks to check for success.
  
<code java>
+
<code javascript>
 
>>> ovi_web_feature_loaded = nokia.maps.Features.isLoaded("ui","ovi_web");   
 
>>> ovi_web_feature_loaded = nokia.maps.Features.isLoaded("ui","ovi_web");   
 
     alert("UI feature ovi_web load status : "+ovi_web_feature_loaded);
 
     alert("UI feature ovi_web load status : "+ovi_web_feature_loaded);
 
</code>
 
</code>
  
In this case we had a result "true" for our query.
+
In this case we had a result {{Icode|true}} for our query.
 +
 
  
 
== Tested with ==
 
== Tested with ==
  
Firefox 7.0.1
+
Firefox 12.0
Firebug 1.8.4
+
Firebug 1.9.2
+
  
 
== Summary ==
 
== Summary ==
  
For more on the Features, please see the Nokia Maps API v2 reference at :  
+
For more on {{Icode|Features}}, please see the Nokia Maps API reference at :  
  
http://api.maps.nokia.com/2.0.0/apireference/symbols/nokia.Features.html?s=Features
+
http://developer.here.net/docs/maps_js/topics_api_pub/nokia.Features.html

Revision as of 14:32, 14 March 2013

This article explains how to use Nokia Maps API class Nokia.Features.

Article Metadata
Tested with
Devices(s): Internet Explorer, Firefox, Google Chrome, Opera
Compatibility
Platform(s): Web
Dependencies: Nokia Maps 2.2.4
Article
Keywords: Nokia Maps, JavaScript, Features
Created: Maveric (14 Nov 2011)
Last edited: jasfox (14 Mar 2013)

Contents

Introduction

Since the version 2.0.0 of the Nokia Maps API, it will offer the possibility to display, load and manage Maps features including e.g. “routing” and “search”.

Each of the features may exist in different implementations for different target environments. A feature implementation is a set of classes that enable certain functionality and which can be loaded to enrich the functionality.

By default the API loads all possible features in the optimal implementation for the environment in which it runs. However, the loading of certain features may also be deferred by explicitly disallowing certain or all features at page load time. This may reduce the initial page load time as not all of the API's code is transferred and executed during the page's start up.

The Features object makes it possible to load individual features of the API manually. It automatically resolves dependencies between different features and provides mechanisms to detect the best feature implementation for the current environment.

The Features object is a static object that is not to be instantiated, it is intended to be used directly instead.

Example use

In the example below we first need to have the Nokia Maps instantiated. Please use the following code to get the Nokia Maps visible first. You can use either Firefox with Firebug, or Chrome's tools or whichever debugging tool you prefer.

<html>
<head>
<script type="text/javascript" src="http://api.maps.nokia.com/2.2.4/jsl.js" charset="utf-8">
</script>
</head>
<body>
<div id="map" style="width:100%; height:100%;"></div>
<script type="text/javascript">
// Don't forget to set your API credentials
nokia.Settings.set( "appId", "YOUR APP ID GOES HERE");
nokia.Settings.set( "authenticationToken", "YOUR AUTHENTICATION TOKEN GOES HERE");
 
var map = new nokia.maps.map.Display(document.getElementById("map"),
{ components: [ new nokia.maps.map.component.Behavior(),],
'zoomLevel': 4,
'center':[53.1, 13.1]});
</script>
</body>
</html>

After this you can just use the web development console for testing as follows:

For example, if we would like to see what is currently loaded, we could issue the following:

>>> nokia.maps.Features.getFeatureMap();

Firebug Object Display shows:

Object { search=[1], routing=[1], positioning=[1], more...}

Based on this information, we can find out that all the components that are listed are currently loaded, and we will also be able to see how many instances there are of them, so "[1]" means there is one loaded.

You can reveal the rest with “more…”. Please note that it depends on your map implementation of course, how many features there are, this is just given as an example. After clicking "more..." you could see e.g.:

gfx
["canvas", "svg", "vml"]
kml
["kml"]
language
["en-GB", "en-US", "de-DE", 5 more...]
map
["js-p2d-canvas", "js-p2d-dom"]
positioning
["w3c"]
routing
["nokia"]
search
["nokia"]
ui
["nokia_generic", "ovi_web"]

The method getLoadedMap() will return a map of all registered feature implementations per feature.

To use this information in our own code, we could do e.g. like this:

myFeatureMap = new nokia.maps.Features.getLoadedMap();
alert("You have the current UI feature loaded: "+myFeatureMap.ui);

An Alert window could display now : "You have the current UI feature loaded: nokia_generic"

Please note: In the version 2.0 of the API the old UI package "ovi_web" is still accessible, but will be deprecated in an oncoming release.

With the method isLoaded() we can find out if certain feature implementation has been successfully loaded. The method returns a Boolean value of "true / false". The query will result in true only if the queried implementation was fully loaded, meaning it was both transmitted and evaluated. The method will throw an exception if either feature or implementation are unknown.

The following code line would issue a query to check if the UI feature's ovi_web implementation is loaded.

ovi_web_feature_loaded = nokia.maps.Features.isLoaded("ui","ovi_web"); 
alert("UI feature ovi_web load status : "+ovi_web_feature_loaded);

In our case the query returned a value of false.

Loading a new set of specified features is done with the "load" method. Optionally you can set an onSuccess and an onError callback, plus define the target document into which the respective script tags should be appended. The feature request is expected to be specified as an object where the keys represent the features and their values represent the implementation name.

As in the previous code we had checked for the existence of the "ovi_web" UI component, and got back the result that it is not loaded (false) then we could attempt to load it as follows:

Loading e.g. both "ovi_web" UI and "search":

>>> nokia.Features.load({"ui":"ovi_web", "search":"auto"});

Check if the load was successful. Please note that in an online app you should use the callbacks to check for success.

>>> ovi_web_feature_loaded = nokia.maps.Features.isLoaded("ui","ovi_web");  
alert("UI feature ovi_web load status : "+ovi_web_feature_loaded);

In this case we had a result true for our query.


Tested with

Firefox 12.0 Firebug 1.9.2

Summary

For more on Features, please see the Nokia Maps API reference at :

http://developer.here.net/docs/maps_js/topics_api_pub/nokia.Features.html

248 page views in the last 30 days.
×