×
Namespaces

Variants
Actions
Revision as of 12:46, 23 March 2012 by renlin (Talk | contribs)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

在QML中使用Nokia Maps Image API获取地图

From Nokia Developer Wiki
Jump to: navigation, search

Delete instructional text in italic

This article explains how to ... Replace the abstract text with a short paragraph (or sentence) describing what the topic covers.

Enter article metadata as described below. Note that this template can be placed anywhere in the article. Do not remove parameters that you do not use

Article Metadata
Article
Created: ()
Last edited: renlin (23 Mar 2012)

Introduction

近端时间在研究地图开发相关的资料时,翻到Nokia Location Platform 提供的Maps Image API,它简单、易学,在任意平台上,只要通过网络就可将世界上任意地方的地图数据加载到设备中,实际上它通过用户提供的URL返回一张图片给用户,在URL中用户传入所需地图的经纬度,显示模式,路线,节点浏览,放大倍数等等参数. 通过这个API,用户还可以增强地图的功能,比如得到实时的交通状况图。本文就将在QML中利用这个API来实现地图的放大、缩小、以及实现不同地图浏览模式。
MainPage.jpg Hybrid.jpg Zoomin.jpg

实现

应用简单的实现了一副页面,该页面负责显示地图和实现几个Button来与地图服务器进行交互,在MapTile.qml 中实现一个Item组件中管理地图Image并定义地图所需的一些属性,在main.qml中调用这个组件。
main.qml

Rectangle
{
MapTile{
}
......
}

Maptile.qml
Item的结构为:

Item{
Image{
id:mapImage
}
 
}

在Item中定义一组请求地图信息所需的属性:

...
property real longtitude
property real latitude
property int zoom
property int viewMode
...

在loadMap()方法中设置Image的source为一个URL,URL中包含了我们向服务器请求所需的参数,这里的参数是经纬度,显示模式(普通模式,混合模式,卫星模式,地形模式),以及图片所需的大小。更多参数的定义,以及这个URL的使用请参考这里

function loadMap() {
mapImage.source = 'http://m.nok.it/?c=' + latitude + ',' + longtitude +'&t='+viewMode+
'&z=' + zoom +
'&w=' + mapImage.width + '&h=' + mapImage.height+'&nord';
}

在main.qml中使用MapTile组件

 MapTile{
id: map
x: 0
y:0
width: 600
height: 800
latitude: 30.67 //成都市的经纬度
longtitude: 104.06
zoom: 10
viewMode: 0
anchors.centerIn: parent
}

为了让用户体验更好,地图图片可以取得比屏幕尺寸更大,将MapTile放在Flickable 中使其可以拖动并看到更广范围的地图的信息。 相关源码下载:Media:Testmaps.zip



Add categories below. Remove Category:Draft when the page is complete or near complete

This page was last modified on 23 March 2012, at 12:46.
115 page views in the last 30 days.

Was this page helpful?

Your feedback about this content is important. Let us know what you think.

 

Thank you!

We appreciate your feedback.

×