是否可以在诺基亚地图中放置网格? [英] Is it possible to place a grid in Nokia maps?
本文介绍了是否可以在诺基亚地图中放置网格?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在使用诺基亚地图javascript API,可以在地图上放置网格吗?
Im using nokia maps javascript api, is posible place a grid in the map?
推荐答案
最简单的方法是使用透明网格PNG作为覆盖.
The easiest way to do this would be to use a transparent grid PNG as an overlay.
首先创建一个256x256 PNG文件,如下所示.
First create a 256x256 PNG file as shown below.
然后将其用作您的getTileUrl()
函数,因此它会在地图上的所有地图"图块上返回.
Then use that as your getTileUrl()
function, so it is returned over all of the Map tiles on the map.
var getTileUrl = function (zoom, row, column) {
return "http://i.stack.imgur.com/M1ncK.png";
};
结果是这样的:
下面可以看到一个示例,其中包含您自己的PNG文件应用程序ID和令牌当然.
An example can be seen below, with your own PNG file, app id and token of course .
/* Set authentication token and appid
*
* please register on http://api.developer.nokia.com/
* and obtain your own developer's API key
*/
nokia.Settings.set("appId", "MY APP ID");
nokia.Settings.set("authenticationToken", "MY TOKEN");
// Get the DOM node to which we will append the map
var mapContainer = document.getElementById("mapContainer");
// Create a map inside the map container DOM node
var map = new nokia.maps.map.Display(mapContainer, {
// initial center and zoom level of the map
center: [52.515, 13.405],
zoomLevel: 14,
components: [
// ZoomBar provides a UI to zoom the map in & out
new nokia.maps.map.component.ZoomBar(),
// We add the behavior component to allow panning / zooming of the map
new nokia.maps.map.component.Behavior()
]
});
var getTileUrl = function (zoom, row, column) {
return "http://i.stack.imgur.com/M1ncK.png";
};
tileProviderOptions = {
getUrl: getTileUrl, // Obligatory function
max:20, // The highest zoom level for the overlay.
min:1, // The lowest zoom level for the overlay.
opacity: 0.5, // Overlay opacity.0 is fully transparent, 1 is fully opaque.
alpha:true // This value tells the renderer to read the alpha channel; required if opacity is used.
},
// Create an overlay by calling the constructor for ImgTileProvider
gridOverlay = new nokia.maps.map.provider.ImgTileProvider(tileProviderOptions);
// Add the overlay to the map
map.overlays.add(gridOverlay);
html {
overflow:hidden;
}
body {
margin: 0;
padding: 0;
overflow: hidden;
width: 100%;
height: 100%;
position: absolute;
}
#mapContainer {
width: 100%;
height: 100%;
left: 0;
top: 0;
position: absolute;
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=7; IE=EmulateIE9; IE=EmulateIE10;"/>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Nokia Maps Example: Adding an overlay to the map</title>
<script type="text/javascript" charset="UTF-8" src="http://api.maps.nokia.com/2.2.4/jsl.js?with=all"></script>
<style type="text/css">
</style>
</head>
<body>
<div id="mapContainer"></div>
<div id="uiContainer"></div>
</body>
</html>
这篇关于是否可以在诺基亚地图中放置网格?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文