×
Namespaces

Variants
Actions
(Difference between revisions)

Archived:Update Nokia Online Maps Style for Asha Full Touch

From Nokia Developer Wiki
Jump to: navigation, search
hamishwillee (Talk | contribs)
m (Hamishwillee - Minor subedit)
r60600 (Talk | contribs)
(R60600 -)
Line 26: Line 26:
 
[http://maps.nokia.com/ Nokia 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 website or Series 40 Web App and add new style in it for corresponding devices at the same time.
 
[http://maps.nokia.com/ Nokia 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 website or Series 40 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 [http://www.developer.nokia.com/Devices/Device_specifications/Asha_305/ Asha 305], [http://www.developer.nokia.com/Devices/Device_specifications/Asha_306/ Asha 306], [http://www.developer.nokia.com/Devices/Device_specifications/Asha_311/ Asha 311] ).  
+
Code below will reconstruct a map with basic function for Asha full touch(such as [http://www.developer.nokia.com/Devices/Device_specifications/Asha_305/ Asha 305], [http://www.developer.nokia.com/Devices/Device_specifications/Asha_306/ Asha 306], [http://www.developer.nokia.com/Devices/Device_specifications/Asha_311/ Asha 311] ).  
  
 
<code javascript>
 
<code javascript>
Line 72: Line 72:
 
Of course, the style can also be saved into a css file linked to the homepage.
 
Of course, the style can also be saved into a css file linked to the homepage.
  
Launching the app in simulator
+
Launching the app in simulator.
  
 
[[file: NokiaOnlineMapsforAshaPositioning.JPG]]
 
[[file: NokiaOnlineMapsforAshaPositioning.JPG]]
Line 79: Line 79:
  
 
[[file:NokiaOnlineMapsforAshaPublicTransport.JPG]]
 
[[file:NokiaOnlineMapsforAshaPublicTransport.JPG]]
 +
 +
Nokia Online Maps is ported on handheld system with better effect.

Revision as of 10:16, 28 September 2012

Article Metadata
Article
Created: r60600 (08 Aug 2012)
Last edited: r60600 (28 Sep 2012)

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

Nokia 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 website or Series 40 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 Asha 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

Nokia Online Maps is ported on handheld system with better effect.

159 page views in the last 30 days.
×