Archived:Optimize HERE Map Type Selector for Asha 305, Asha 306 and Asha 311
hamishwillee
(Talk | contribs) m (Hamishwillee - Minor subedit - still needs a lot of work) |
(R60600 -) |
||
| Line 112: | Line 112: | ||
[[File:TypeSelectorDragRight.JPG]] | [[File:TypeSelectorDragRight.JPG]] | ||
| + | |||
| + | Please read [http://www.developer.nokia.com/Community/Wiki/Update_Nokia_Online_Maps_Style_for_Asha_Full_Touch Update Nokia Online Maps Style for Asha Full Touch] for better map services on Asha full touch. | ||
Revision as of 10:00, 28 September 2012
Article Metadata
Article
Asha 305, Asha 306, Asha 311 are Series 40 devices with new full touch UI which will provide a better user experience for map operation. And developers may not construct ScaleBar and ZoomBar for user. But these devices only support HTML 4.0, Developers can only use Nokia Map API for Web to display map in Browser or Widget.
This is a simple Nokia map example with TypeSelector.
<html>
<head>
<script type="text/javascript" charset=UTF-8"
src="http://api.maps.nokia.com/2.0.0/jsl.js?"></script>
<style type="text/css">
html {
overflow:hidden;
}
body {
margin: 0;
padding: 0;
overflow: hidden;
}
#mapContainer {
width: 100%;
height: 100%;
left: 0;
top: 0;
position: absolute;
}
</style>
</head>
<body >
<div id="mapContainer"></div>
<script type="text/javascript">
var mapContainer = document.getElementById("mapContainer");
var map = new nokia.maps.map.Display(mapContainer, {
components: [
new nokia.maps.map.component.Behavior(),
new nokia.maps.map.component.TypeSelector()
]
});
</script>
</body>
</html>
After run,the TypeSelector may extend un-completely.
Because these 3 Asha devices's portrait screen width is less than width of horizontal extending TypeSelector. Maybe many developers don't think it's a question because user can rotate to landscape screen which has full width and is fit for 2 hands hold. But I think developers had better provide users another convenience way which let them operate map when only can use single hand.
So the newer version of Nokia Map API for Web is introduced to settle this question, only alter another Javascript file.
...
<script type="text/javascript" charset=UTF-8"
src="http://api.maps.nokia.com/2.1.0/jsl.js?"></script>
...
And the TypeSecector will extend vertical,
which is not only fit for 3 Nokia Asha devices but also for many other limited screen devices.
Way above is good but I prefer next which via increasing the width of the map container.
...
<script type="text/javascript" charset=UTF-8"
src="http://api.maps.nokia.com/2.0.0/jsl.js?"></script>
...
#mapContainer {
width: 150%;
...
The TypeSelector doesn't appear first
before user drag mapcontainer from right to left.
The TypeSelector can extend horizontal completely,
and be dragged,selected or closed.
Please read Update Nokia Online Maps Style for Asha Full Touch for better map services on Asha full touch.
