Namespaces

Variants
Actions

Please note that as of October 24, 2014, the Nokia Developer Wiki will no longer be accepting user contributions, including new entries, edits and comments, as we begin transitioning to our new home, in the Windows Phone Development Wiki. We plan to move over the majority of the existing entries over the next few weeks. Thanks for all your past and future contributions.

(Difference between revisions)

Archived:Update Nokia Online Maps Style for Asha Full Touch

From Wiki
Jump to: navigation, search
r60600 (Talk | contribs)
(R60600 -)
 
hamishwillee (Talk | contribs)
m (Hamishwillee - Bot update - Fix metadata)
Line 1: Line 1:
 +
{{ArticleMetaData <!-- v1.2 -->
 +
|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]]) -->
 +
|devices= <!-- Devices tested against - e.g. ''devices=Nokia 6131 NFC, Nokia C7-00'') -->
 +
|sdk= <!-- SDK(s) built and tested against (e.g. [http://linktosdkdownload/ Qt SDK 1.1.4]) -->
 +
|platform= <!-- Compatible platforms - e.g. Symbian^1 and later, Qt 4.6 and later -->
 +
|devicecompatability= <!-- Compatible devices e.g.: All* (must have internal GPS) -->
 +
|dependencies= <!-- Any other/external dependencies e.g.: Google Maps Api v1.0 -->
 +
|signing= <!-- Signing requirements - empty or one of: Self-Signed, DevCert, Manufacturer -->
 +
|capabilities= <!-- Capabilities required by the article/code example (e.g. Location, NetworkServices. -->
 +
|keywords= <!-- APIs, classes and methods (e.g. QSystemScreenSaver, QList, CBase -->
 +
|language= <!-- Language category code for non-English topics - e.g. Lang-Chinese -->
 +
|translated-by= <!-- [[User:XXXX]] -->
 +
|translated-from-title= <!-- Title only -->
 +
|translated-from-id= <!-- Id of translated revision -->
 +
|review-by= <!-- After re-review: [[User:username]] -->
 +
|review-timestamp= <!-- After re-review: YYYYMMDD -->
 +
|update-by= <!-- After significant update: [[User:username]]-->
 +
|update-timestamp= <!-- After significant update: YYYYMMDD -->
 +
|creationdate= 20120808
 +
|author= [[User:R60600]]
 +
}}
 
[[Category:Series 40 Web Apps]][[Category:Nokia Maps]]
 
[[Category:Series 40 Web Apps]][[Category:Nokia Maps]]
 
  [[Category:Series 40 Web Apps]][[Category:Nokia Maps]]  
 
  [[Category:Series 40 Web Apps]][[Category:Nokia Maps]]  

Revision as of 00:26, 9 August 2012

Article Metadata
Article
Created: r60600 (08 Aug 2012)
Last edited: hamishwillee (09 Aug 2012)

Note.pngNote: This is an entry in the Asha Touch Competition 2012Q3

Nokia Online Maps is designed for desktop or laptop system,which can be saved as a single HTML file via IE or other browsers.Developers can also make the file as the homepage of their WWW site or S40 Web App and add new style in it for corresponding devices at the same time. Code below will reconstruct a map with basic function for full touch(such as Asha 305, Asha 306, Asha 311 ).

...
<link type="text/css" rel="stylesheet"
href="http://static2.maps.nokia.com.cn/37115/resources/core/css/screen.c.css"/>
<style>
/*Hide top and app bar for large display area.*/
#topbar, #nokiamaps #appbar{height:0px;visibility:hidden}
#nokiamaps #appbar div div form input{height:0;padding:0;border:0}
 
/*Adjust the map's size and location.*/
#map{width:auto}
#nokiamaps.maps #application{top:0}
 
/*Reduce width of the control bar.*/
.MCControlbar{top:0px;left:0px;right:auto}
.MCCBTab1 .MCTLinner,.MCCBTab2 .MCTLinner{padding-right:0}
.MCTriangle, .MCTLTabDisabled .MCTLinner .MCTriangle{visibility:hidden}
.MCTDelimiter, .MCHorizontalDelimiter{visibility:hidden}
.MCCBTabsContainer .MCTLempty{width:8px}
 
/*Most mobiles don't support 3D map.*/
#trackingLink3D{height:0px;visibility:hidden}
 
/*Set the better location for mobiles.*/
.MCNavContainer{left:auto;top:auto;right:170%;bottom:auto;width:auto;Height:17%}
 
/*No use in most mobiles.*/
.MCMinimapBtn{visibility:hidden}
 
/*Full touch may not have these components.*/
.MCPan, .MCZoom{visibility:hidden}
 
/*Too long to display.*/
.MCCopyright{visibility:hidden}
</style>
<!--[if lt IE 9]>
<link type="text/css" rel="stylesheet"
href="http://static2.maps.nokia.com.cn/37115/resources/core/css/screen.ie.c.css"/>
<![endif]-->
...

Of course,the style can also be saved into a css file linked to the homepage.

Launching the app in simulator

NokiaOnlineMapsforAshaPositioning.JPG

NokiaOnlineMapsforAshaChooseView.JPG

NokiaOnlineMapsforAshaPublicTransport.JPG

439 page views in the last 30 days.

Was this page helpful?

Your feedback about this content is important. Let us know what you think.

 

Thank you!

We appreciate your feedback.

×