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. Thanks for all your past and future contributions.

Implementing Streetview functionality with HERE Maps

From Wiki
Jump to: navigation, search
Featured Article
16 Mar

This article shows how to implement HERE maps street-view functionality in your Nokia X applications.

Article Metadata
Created: (13 Mar 2014)
Last edited: BuildNokia (21 Apr 2014)


Note.pngNote: This is an entry in the Nokia X Wiki Challenge 2014Q1


HERE Maps for Nokia X implements the StreetLevelFragment class. You can use this to easily implement Streetview functionality in your own application.

Streetview nokiax2.jpg Streetview nokiax1.jpg

Note that there is also a StreetLevelCompatibilityFragment class which can be used if you need to work with API Level 10, or use v4 support fragments.

To use the Streetview, you simply define it in your XML layout. Once the layout is loaded, you initialize it. At that point you can start using the functionality provided by the API.

Adding the Streetview in your app

<fragment	class=""

Simply add the above lines into your layout. Then, in the class in which you are loading the layout, add the code to find the StreetLevelFragment instance, and then initialize it.

streetLevelFragment = (StreetLevelFragment) getFragmentManager().findFragmentById(;
streetLevelFragment.init(new FragmentInitListener() {
public void onFragmentInitializationCompleted(InitError error) {
if (error == InitError.NONE) {

After a successful initialization you can start using the functions of the class. If your application contains a Map view, and you want to show the area in which the Streetview is available, you should call the setStreetLevelCoverageVisible with a true value. Then all areas of Streetview coverage will be shown in blue.


Next, you can use the following code to align the Streetview with the center point of the map:

public void MoveStreetLevelImage() {
if(streetLevelFragment != null && map != null){
StreetLevel level =streetLevelFragment.getStreetLevelModel().getStreetLevel(map.getCenter(), 100);
if (level != null) {
// Render street level imagery
streetLevelFragment.getStreetLevelModel().moveTo( level, false, map.getOrientation(), 0, 1.0f);

Then, if you would need to set the map to show the area of which the streetview is located, you could do it as follows:

map.setCenter(streetLevelFragment.getStreetLevelModel().getPosition(), MapAnimation.LINEAR, map.getZoomLevel(), streetLevelFragment.getStreetLevelModel().getHeading(), 0);

Example application

You can find the source code for an example from Streetview project at Github.

This example is also available in Nokia Store. To find it, search for the application named "streetview" published by Dr.Jukka.

This page was last modified on 21 April 2014, at 20:17.
391 page views in the last 30 days.