Nokia Developer Community - Discussions - MH5: Nokia Maps Framework for mobile HTML5

HTML5 + KML ?

studentproject — Wed, 22 May 2013 16:34:02 GMT

HI

I would like to display our POI base in KML format on HERE Maps HTML5 for mobile. Is it possible and what is the code that I should add to this one above? Thanks

href="http://api.maps.nokia.com/mobile/1.0.2/lib/mh5.css">
href="http://api.maps.nokia.com/mobile/1.0.2/lib/colors.css">

style="width: 320px; height: 480px; position: relative;">

mh5 and jquery mobile: problem creating a second map on a second page.

lweber — Fri, 17 May 2013 19:51:24 GMT

Hi again,
I'm having a second problem:

I'm using jQuery mobile, I have two pages, both of which contain an mh5 Map Widget.

First, I enter page A.
On the 'pagecreate' event, I create a map object and display it:

Code:

        var settings = {

            settingsButton: null,

            infoBubble: {

                content: ["title", "description"],

                right: "/mobile/css/images/okbtn.png",

                rightDelimiter: true,

                listeners: {

                    click: function(e) {

                        console.log(e);

                    },

                    rightclick: function() {

                        console.log('rightclick');

                    }

                }

            }

        };

        var map = new nokia.mh5.components.Map(settings);



        $('#mapContainerA').empty().append(map.root);

then I create some POI:

Code:

var poi = map.createPoi(options.poiImage, {

                    longitude: loc.longitude,

                    latitude: loc.latitude,

                    content: ["title", "description"],

                    name: place.street + " " + place.houseNo,

                    description: place.postcode + " " + place.place

                });

This works like a charm. Clicking on a POI opens the infoBubble, and clicking on the infoBubble triggers the events.

However, if I change to page B, I run into problems.
The code for this page is exactly the same except the ID for the map object - it's 'mapContainerB' instead of 'mapContainerA'.

Unfortunately, on this page, clicking on the Map does not open infoBubbles. And after opening the infoBubbles with

Code:

map.showInfoBubble(poi);

neither the click event nor the rightclick event do trigger.

Same scenario other way round:
Refresh the page, start with page B: page B works like a charm. Go to page A: click events broken. I can move around the map without problems, but infoBubbles have the same problems as described above.

As you might know, jQuery mobile does not reload the web page upon changing. It keeps the old page in the DOM and loads a new page additionally.
This might lead to all funny kinds of global variable collisions or object ID collisions.
For my own pages, I've made sure, this doesn't happen, but of course I can't do that for mh5.

Is there any function to completely eradicate all mh5-associated divs, canvas elements, javascript global variables, whatever else you might think of, to prevent that?

Or is the solution even much more easier and I just don't see it?

setting map.box zooms all the way out

lweber — Fri, 17 May 2013 15:27:39 GMT

Hi,
I have a problem using nokia.mh5.components.Map.

I have a map object, it is already attached to my DOM and I'm trying the following call:

Code:

map.box = [{latitude: 52.48418475521959, longitude: 13.247291576673867}, {latitude: 51.568805705543554, longitude: 13.737773218142548}];

This centers the box correctly, but also it zooms out to zoom level 3 (which is not of much use).

Calling now

Code:

map.covers([{latitude: 52.48418475521959, longitude: 13.247291576673867}, {latitude: 51.568805705543554, longitude: 13.737773218142548}])

returns true - which is obviously correct, but after I call

Code:

map.zoom = 5;

which zooms in a bit but still shows the whole of europe, the same call to map.covers already returns false - even though both of these coordinates are in eastern germany, so the call should obviously return true!

Can anybody tell me if this is a bug or if I'm just calling the wrong methods to zoom into a box?

Why is not working Nokia Here HTML5?

FANMixco — Sun, 12 May 2013 16:59:44 GMT

I have followed all the example from: Nokia Here HTML5 This is the code from the example that I read:

Code:

I don't know why is not working only shows a white screen. And I have another question with Nokia Here HTML5 is able to add markers and clustering as JS option?