×
Namespaces

Variants
Actions
(Difference between revisions)

HERE Maps API - How to check the Date Border Crossing

From Nokia Developer Wiki
Jump to: navigation, search
hamishwillee (Talk | contribs)
m (Hamishwillee - Removed draft category. Added back in metadata)
jasfox (Talk | contribs)
m (Jasfox - update to 2.2.4)
(12 intermediate revisions by 4 users not shown)
Line 1: Line 1:
[[Category:Browser]][[Category:Web]][[Category:Location]]
+
[[Category:Nokia Maps]][[Category:JavaScript]][[Category:Code Snippet]]
{{Abstract|This article explains how to check the Date Border Crossing using the Nokia Maps API.}}  
+
{{Abstract|This article explains how to check the Date Border Crossing using the [http://developer.here.net/javascript_api  Nokia Maps API].}}  
 +
 
 
{{ArticleMetaData
 
{{ArticleMetaData
 
|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=FireFox 7.0.1
+
|devices=FireFox, Internet Explorer, 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= <!-- Any other/external dependencies e.g.: Google Maps Api v1.0 -->
+
|dependencies= Nokia Maps API 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, Date Border
 
|id= <!-- Article Id (Knowledge base articles only) -->
 
|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 -->
Line 24: Line 25:
 
== Introduction ==
 
== Introduction ==
  
The isCDBA flag of the BoundingBox in Nokia Maps API has been added since v2 to indicate that the bounding box is crossing the date border. A bounding box which is spanned from -180° (left) to +180° (right) is NOT crossing the date border. Default value is false.  
+
The {{Icode|isCDB}} flag of the {{Icode|BoundingBox}} in [http://developer.here.net/javascript_api  Nokia Maps API] has been added since v2 to indicate that the bounding box is crossing the date border. A bounding box which is spanned from -180° (left) to +180° (right) is NOT crossing the date border. Default value is {{Icode|false}}.  
  
 
The API reference link:
 
The API reference link:
http://api.maps.nokia.com/2.0.0/apireference/symbols/nokia.maps.geo.BoundingBox.html?s=isCDB#isCDB
+
http://developer.here.net/docs/maps_js/topics_api_pub/nokia.maps.geo.BoundingBox.html#topic-apiref__BoundingBox-isCDB
  
==The International Date Line (IDL) Definition by WikiPedia.org==
+
==The International Date Line (IDL) Definition by Wikipedia.org==
  
IDL is a generally north-south imaginary line on the surface of the Earth, passing through the middle of the Pacific Ocean, that designates the place where each calendar day begins. It is roughly along 180° longitude, opposite the Prime Meridian, but it is drawn with diversions to pass around some territories and island groups.Crossing the IDL travelling east results in a day or 24 hours being subtracted, so that the traveller repeats the date to the west of the line.  
+
IDL is a generally north-south imaginary line on the surface of the Earth, passing through the middle of the Pacific Ocean, that designates the place where each calendar day begins. It is roughly along 180° longitude, opposite the Prime Meridian, but it is drawn with diversions to pass around some territories and island groups.Crossing the IDL traveling east results in a day or 24 hours being subtracted, so that the traveler repeats the date to the west of the line.  
 
Full description here: http://en.wikipedia.org/wiki/International_Date_Line
 
Full description here: http://en.wikipedia.org/wiki/International_Date_Line
  
 
== Example code ==
 
== Example code ==
  
This example first adds two Markers for which the BoundingBox is not crossing the International Date Line. A third Marker is then randomly added to coordinates that will cause the check to produce the BoundingBox to have crossed the IDL.
+
This example first adds two {{Icode|Markers}} for which the {{Icode|BoundingBox}} is not crossing the International Date Line. A third Marker is then randomly added to coordinates that will cause the check to produce the {{Icode|BoundingBox}} to have crossed the IDL. Remember to add in your own [[How to Obtain Your Own Nokia appID and Token| AppId and Token]] to get the example to work.
  
<code java>
+
<code javascript>
<html>
+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
+
<html xmlns="http://www.w3.org/1999/xhtml">
<script type="text/javascript" charset="UTF-8" src="http://api.maps.nokia.com/2.0.0/jsl.js"></script>
+
    <head>
</head>
+
      <title>Check for Date Border Crossing</title>
<body>
+
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<div id="map" style="width:100%; height:100%;"></div>
+
      <script type="text/javascript"
<script type="text/javascript">
+
            src="http://api.maps.nokia.com/2.2.4/jsl.js" charset="utf-8">
 +
        </script>
 +
    </head>
 +
    <body>
  
var map = new nokia.maps.map.Display(document.getElementById("map"),   
+
        <div id="mapContainer" style="z-index: -1; left:0px; top:0px; width: 100%; height: 80%; position: absolute;"></div>
 +
        <script type="text/javascript">
 +
/////////////////////////////////////////////////////////////////////////////////////
 +
// Don't forget to set your API credentials
 +
//
 +
// Replace with your appId and token which you can obtain when you
 +
// register on http://api.developer.nokia.com/
 +
//
 +
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("mapContainer"),   
 
{    components: [ new nokia.maps.map.component.Behavior()],
 
{    components: [ new nokia.maps.map.component.Behavior()],
                {
+
    'zoomLevel': 10,         
                  'zoomLevel': 10,         
+
 
                   'center':[-1.366667, 176.466667]
 
                   'center':[-1.366667, 176.466667]
                }
+
}
 
);
 
);
 
+
 
var markerContainer = new nokia.maps.map.Container()                   
 
var markerContainer = new nokia.maps.map.Container()                   
 
markerContainer.objects.add(     
 
markerContainer.objects.add(     
Line 64: Line 81:
 
                 draggable: false           
 
                 draggable: false           
 
               }));
 
               }));
 
+
 
markerContainer.objects.add(     
 
markerContainer.objects.add(     
 
             new nokia.maps.map.StandardMarker(         
 
             new nokia.maps.map.StandardMarker(         
Line 72: Line 89:
 
                 draggable: false,         
 
                 draggable: false,         
 
               }));     
 
               }));     
 
+
 
map.objects.add(markerContainer);     
 
map.objects.add(markerContainer);     
 
map.zoomTo(markerContainer.getBoundingBox(),false,true);     
 
map.zoomTo(markerContainer.getBoundingBox(),false,true);     
 
+
 
// Check for Date Border Crossing
 
// Check for Date Border Crossing
 
checkDateBorder();
 
checkDateBorder();
 
+
 
// Add new Marker randomly
 
// Add new Marker randomly
 
markerContainer.objects.add(     
 
markerContainer.objects.add(     
Line 86: Line 103:
 
                                 draggable: false,         
 
                                 draggable: false,         
 
                   }));     
 
                   }));     
 
+
 
map.zoomTo(markerContainer.getBoundingBox(),false,true);     
 
map.zoomTo(markerContainer.getBoundingBox(),false,true);     
 
+
 
// Check for Date Border Crossing
 
// Check for Date Border Crossing
 
+
 
checkDateBorder();
 
checkDateBorder();
 
+
 
function checkDateBorder()
 
function checkDateBorder()
 
{     
 
{     
Line 104: Line 121:
 
                     }
 
                     }
 
}
 
}
 
 
</script>
 
</script>
 
</body>
 
</body>
 
</html>
 
</html>
</code>
+
</code>
 +
 
 +
==For more on Nokia Maps API==
  
== Tested with ==
+
Please check out the Nokia Maps API full documentation and API reference here:
 +
* [http://developer.here.net/javascript_api Nokia Maps API]
  
FireFox 7.0.1
+
You may also access the interactive API explorer
 +
* [http://developer.here.net/javascript_api_explorer API explorer]

Revision as of 14:27, 14 March 2013

This article explains how to check the Date Border Crossing using the Nokia Maps API.

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

Contents

Introduction

The isCDB flag of the BoundingBox in Nokia Maps API has been added since v2 to indicate that the bounding box is crossing the date border. A bounding box which is spanned from -180° (left) to +180° (right) is NOT crossing the date border. Default value is false.

The API reference link: http://developer.here.net/docs/maps_js/topics_api_pub/nokia.maps.geo.BoundingBox.html#topic-apiref__BoundingBox-isCDB

The International Date Line (IDL) Definition by Wikipedia.org

IDL is a generally north-south imaginary line on the surface of the Earth, passing through the middle of the Pacific Ocean, that designates the place where each calendar day begins. It is roughly along 180° longitude, opposite the Prime Meridian, but it is drawn with diversions to pass around some territories and island groups.Crossing the IDL traveling east results in a day or 24 hours being subtracted, so that the traveler repeats the date to the west of the line. Full description here: http://en.wikipedia.org/wiki/International_Date_Line

Example code

This example first adds two Markers for which the BoundingBox is not crossing the International Date Line. A third Marker is then randomly added to coordinates that will cause the check to produce the BoundingBox to have crossed the IDL. Remember to add in your own AppId and Token to get the example to work.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Check for Date Border Crossing</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript"
src="http://api.maps.nokia.com/2.2.4/jsl.js" charset="utf-8">
</script>
</head>
<body>
 
<div id="mapContainer" style="z-index: -1; left:0px; top:0px; width: 100%; height: 80%; position: absolute;"></div>
<script type="text/javascript">
/////////////////////////////////////////////////////////////////////////////////////
// Don't forget to set your API credentials
//
// Replace with your appId and token which you can obtain when you
// register on http://api.developer.nokia.com/
//
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("mapContainer"),
{ components: [ new nokia.maps.map.component.Behavior()],
'zoomLevel': 10,
'center':[-1.366667, 176.466667]
}
);
 
var markerContainer = new nokia.maps.map.Container()
markerContainer.objects.add(
new nokia.maps.map.StandardMarker
(
[-1.366667, 176.466667],
{
text: "-1.366667, 176.466667",
draggable: false
}));
 
markerContainer.objects.add(
new nokia.maps.map.StandardMarker(
[-1.366667, 180.000000],
{
text: "-1.366667, 180.000000",
draggable: false,
}));
 
map.objects.add(markerContainer);
map.zoomTo(markerContainer.getBoundingBox(),false,true);
 
// Check for Date Border Crossing
checkDateBorder();
 
// Add new Marker randomly
markerContainer.objects.add(
new nokia.maps.map.StandardMarker(
[Math.random() * 180 - 90, -176.000],
{ text: "-176.000, 179.000",
draggable: false,
}));
 
map.zoomTo(markerContainer.getBoundingBox(),false,true);
 
// Check for Date Border Crossing
 
checkDateBorder();
 
function checkDateBorder()
{
var CDB = markerContainer.getBoundingBox().isCDB;
if (CDB == false)
{
alert("False - The Bounding box is not crossing the date border");
} else if(CDB == true)
{
alert("True - The Bounding box crosses the date border");
}
}
</script>
</body>
</html>

For more on Nokia Maps API

Please check out the Nokia Maps API full documentation and API reference here:

You may also access the interactive API explorer

151 page views in the last 30 days.
×