×

Discussion Board

Results 1 to 4 of 4
  1. #1
    Registered User
    Join Date
    Jun 2013
    Posts
    2

    map marker doesn t show

    I putted this code into my default.html page on the server and I upploaded the .png image to the server, but marker doesn t show on the map. This is the code:

    Code:
    <!doctype html>
    <html>
    <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0,
    maximum-scale=1.0, user-scalable=no">
    <link rel="stylesheet"
    href="http://api.maps.nokia.com/mobile/1.0.2/lib/mh5.css">
    <link rel="stylesheet"
    href="http://api.maps.nokia.com/mobile/1.0.2/lib/colors.css">
    </head>
    <body class="mh5_hwacc_body">
    <script src="http://api.maps.nokia.com/mobile/1.0.2/lib/mh5.js">
    </script>
    <div id="app_location"
    style="width: 320px; height: 480px; position: relative;">
    </div>
    <script>
    nokia.mh5.assetsPath =
    "http://api.maps.nokia.com/mobile/1.0.2/lib/";
    nokia.mh5.app.embed ({
    domNode: "#app_location",
    "appId": " myID",
    "appCode": " myCODE ",
    hideAddressBar: true,
    "configuration": {
            "map": {
                "infobubble": {
                    "content": [
                        "title"
                    ]
                }
            },
            "search": null
        }}); 
     map.createPoi(nokia.mh5.assetsPath +
    "06.icon.mh5.basic.png", {
    longitude: 7.2692,
    latitude: 43.7028,
    name: "france"
    });
    </script>
    </body>
    </html>
    I m new to the html and here maps, what I need to modify to be able to see the marker on the map all the time?
    Last edited by jasfox; 2013-06-07 at 09:46.

  2. #2
    Nokia Developer Moderator
    Join Date
    Aug 2011
    Location
    Berlin
    Posts
    288

    Re: map marker doesn t show

    Quote Originally Posted by agence View Post
    What do I need to modify to be able to see the marker on the map all the time?
    Fundamentally there are two ways to create an MH5 Application. The nokia.mh5.app.embed method as described in the configuration section of the User Guide creates a high-level embedded application (which has the look and feel of HERE Maps on mobile)and allows you to override the search adaptor to display data from your data over a map. The alternative is to access the lower levels of the framework directly and completely customize your layout, pages, handlers and so on. Your initial code is mixing up the two, in that an app has been instantiated using the higher level framework, but there is no link between this and the map.createPoi() line after it - i.e. you are not referring to an instance of nokia.mh5.components.Map. If you run your web-page in Chrome and look at the console then you will get the following error: Uncaught ReferenceError: map is not defined

    Now, the nokia.mh5.app.embed() method returns an instance of nokia.mh5.app.Application, and inspecting this object you can access the instantiated map by referencing nokia.mh5.app.controller.getMap(). You can then add the POI in the usual manner.

    In summary, a clickable POI marker can be added as shown ( with your app_id, token and Image assets of course)
    Code:
    <!doctype html>
    <html>
    <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0,
    	maximum-scale=1.0, user-scalable=no">
    <link rel="stylesheet" 
    	href="http://api.maps.nokia.com/mobile/1.0.2/lib/mh5.css">
    <link rel="stylesheet" 
    	href="http://api.maps.nokia.com/mobile/1.0.2/lib/colors.css">
    </head>
    <body class="mh5_hwacc_body">
    <script src="http://api.maps.nokia.com/mobile/1.0.2/lib/mh5.js">
    	</script>
    
    <div id="app_location"
    	style="width: 320px; height: 480px; position: relative;">
    </div>
    
    <script>
    	nokia.mh5.assetsPath = 
    		"http://api.maps.nokia.com/mobile/1.0.2/lib/";
    		
    	var app =
    	nokia.mh5.app.embed ({
    		domNode: "#app_location",
    		appId: "YOUR APP_ID",
    		appCode: "YOUR_TOKEN",
    		
    		hideAddressBar: true,
    		configuration: {
    			map: {
    				center: {
    					longitude: 13.3896145,
    					latitude: 52.5166648
    				},
    				zoom: 12,
    				schema: "normal.day",
    				
    				
    				
    			}
    		}
    	});
    	var map = nokia.mh5.app.controller.getMap();
    	map.createPoi( "...path_to_the_marker/markerImage.png", {
    					longitude: 13.3896145,
    					latitude: 52.5166648,
    					name: "Nokia Office"
    				});
    </script>
    </body>
    </html>

  3. #3
    Registered User
    Join Date
    Jun 2013
    Posts
    2

    Re: map marker doesn t show

    Thanks it works perfectly!
    How can I put 3 more clickable POI marker?
    Can I see clickable POI marker when I use search bar to navigate, for example I m in Paris and I want to navigate to Berlin, but clickable POI marker longitude: 13.3896145, latitude: 52.5166648, name: "Nokia Office" disapear from the map?
    Last edited by agence; 2013-06-08 at 02:05.

  4. #4
    Nokia Developer Expert
    Join Date
    Mar 2012
    Posts
    65

    Re: map marker doesn t show

    Hi agence,

    using createPoi method you can put as many pois on the map as you want.
    The logic of the default app flow from your example clears the map every time you trigger a new search. If you want more advanced logic in your application I'd recommend to build your app from scratch by using MH5 components and ui controls.


    Leo

Similar Threads

  1. Replies: 1
    Last Post: 2011-09-06, 15:36
  2. Series 60 Emulator doesn't show anything
    By perlfan in forum Symbian Tools & SDKs
    Replies: 5
    Last Post: 2004-01-12, 19:32
  3. menu bar doesn't show up
    By smallfish_ntu in forum Symbian User Interface
    Replies: 1
    Last Post: 2003-05-21, 07:04
  4. Slide show doesn't work
    By gtakeshi in forum General Messaging
    Replies: 1
    Last Post: 2002-06-28, 04:22

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •