Android 如何使用OpenStreetMap/OpenLayers？
我正在搜索如何将OpenStreetMap与PhoneGap和Android结合使用的示例。Android 如何使用OpenStreetMap/OpenLayers？,android,cordova,openlayers,openstreetmap,Android,Cordova,Openlayers,Openstreetmap,我正在搜索如何将OpenStreetMap与PhoneGap和Android结合使用的示例。 我在网络上只找到了旧的例子，f.e.，但它不适用于最新的PhoneGap，我遵循了PhoneGap的教程 Manifest.xml： <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="de.h3l
我在网络上只找到了旧的例子，f.e.，但它不适用于最新的PhoneGap，我遵循了PhoneGap的教程 Manifest.xml：
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="de.h3llghost.phonegap.test"
android:versionCode="1"
android:versionName="1.0" >
<uses-sdk android:minSdkVersion="8" />
<supports-screens
android:anyDensity="true"
android:largeScreens="true"
android:normalScreens="true"
android:resizeable="true"
android:smallScreens="true" />
<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.VIBRATE" />
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" />
<uses-permission android:name="android.permission.READ_PHONE_STATE" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.RECEIVE_SMS" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
<uses-permission android:name="android.permission.READ_CONTACTS" />
<uses-permission android:name="android.permission.WRITE_CONTACTS" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.GET_ACCOUNTS" />
<application
android:icon="@drawable/ic_launcher"
android:label="@string/app_name" >
<activity
android:configChanges="orientation|keyboardHidden"
android:label="@string/app_name"
android:name=".PhoneGapTestActivity" >
<intent-filter >
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity
android:configChanges="orientation|keyboardHidden"
android:label="@string/app_name"
android:name="com.phonegap.DroidGap" >
<intent-filter >
</intent-filter>
</activity>
</application>
</manifest>
<!DOCTYPE html">
<html>
<head>
<title>SimpleIOL Demo: IOL</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<script type="text/javascript" charset="utf-8" src="phonegap-1.2.0.js"></script>
<style>
div.olControlZoomPanel {
height: 108px;
width: 36px;
position: absolute;
top: 20px;
left: 20px;
}
div.olControlZoomPanel div {
width: 36px;
height: 36px;
background-image: url(http://openlayers.org/dev/examples/img/mobile-zoombar.png);
left: 0;
}
div.olControlZoomPanel .olControlZoomInItemInactive {
top: 0;
background-position: 0 0;
}
div.olControlZoomPanel .olControlZoomToMaxExtentItemInactive {
top: 36px;
background-position: 0 -36px;
}
div.olControlZoomPanel .olControlZoomOutItemInactive {
top: 72px;
background-position: 0 -72px;
}
</style>
<script src="http://openlayers.org/dev/OpenLayers.mobile.js"></script>
<script type="text/javascript" charset="utf-8">
var map;
// Get rid of address bar on iphone/ipod
var fixSize = function() {
window.scrollTo(0,0);
document.body.style.height = '100%';
if (!(/(iphone|ipod)/.test(navigator.userAgent.toLowerCase()))) {
if (document.body.parentNode) {
document.body.parentNode.style.height = '100%';
}
}
};
setTimeout(fixSize, 700);
setTimeout(fixSize, 1500);
function onBodyLoad()
{
document.addEventListener("deviceready",onDeviceReady,false);
}
/* When this function is called, PhoneGap has been initialized and is ready to roll */
function onDeviceReady()
{
// create map
map = new OpenLayers.Map({
div: "map",
theme: null,
controls: [
new OpenLayers.Control.Attribution(),
new OpenLayers.Control.TouchNavigation({
dragPanOptions: {
enableKinetic: true
}
}),
new OpenLayers.Control.ZoomPanel()
],
layers: [
new OpenLayers.Layer.OSM("OpenStreetMap", null, {
transitionEffect: 'resize'
})
],
center: new OpenLayers.LonLat(742000, 5861000),
zoom: 3
});
}
</script>
</head>
<body onload="onBodyLoad()">
<div id="map"></div>
</body>
</html>
当我删除50000并只向loadUrl传递一个参数时，崩溃就消失了。1.2中的超时参数似乎有问题。哦，谢谢，我会向PhoneGap报告。上面是另一个带有贴图控件的解决方案。
<!DOCTYPE html">
<html>
<head>
<title>SimpleIOL Demo: IOL</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<script type="text/javascript" charset="utf-8" src="phonegap-1.2.0.js"></script>
<style>
div.olControlZoomPanel {
height: 108px;
width: 36px;
position: absolute;
top: 20px;
left: 20px;
}
div.olControlZoomPanel div {
width: 36px;
height: 36px;
background-image: url(http://openlayers.org/dev/examples/img/mobile-zoombar.png);
left: 0;
}
div.olControlZoomPanel .olControlZoomInItemInactive {
top: 0;
background-position: 0 0;
}
div.olControlZoomPanel .olControlZoomToMaxExtentItemInactive {
top: 36px;
background-position: 0 -36px;
}
div.olControlZoomPanel .olControlZoomOutItemInactive {
top: 72px;
background-position: 0 -72px;
}
</style>
<script src="http://openlayers.org/dev/OpenLayers.mobile.js"></script>
<script type="text/javascript" charset="utf-8">
var map;
// Get rid of address bar on iphone/ipod
var fixSize = function() {
window.scrollTo(0,0);
document.body.style.height = '100%';
if (!(/(iphone|ipod)/.test(navigator.userAgent.toLowerCase()))) {
if (document.body.parentNode) {
document.body.parentNode.style.height = '100%';
}
}
};
setTimeout(fixSize, 700);
setTimeout(fixSize, 1500);
function onBodyLoad()
{
document.addEventListener("deviceready",onDeviceReady,false);
}
/* When this function is called, PhoneGap has been initialized and is ready to roll */
function onDeviceReady()
{
// create map
map = new OpenLayers.Map({
div: "map",
theme: null,
controls: [
new OpenLayers.Control.Attribution(),
new OpenLayers.Control.TouchNavigation({
dragPanOptions: {
enableKinetic: true
}
}),
new OpenLayers.Control.ZoomPanel()
],
layers: [
new OpenLayers.Layer.OSM("OpenStreetMap", null, {
transitionEffect: 'resize'
})
],
center: new OpenLayers.LonLat(742000, 5861000),
zoom: 3
});
}
</script>
</head>
<body onload="onBodyLoad()">
<div id="map"></div>
</body>
</html>
11-11 21:29:46.210: D/DroidGap(871): DroidGap.loadUrl(file:///android_asset/www/index.html, 50000)
11-11 21:30:36.273: D/DroidGap(871): DroidGap.loadUrl(file:///android_asset/www/index.html)
11-11 21:30:36.273: D/DroidGap(871): DroidGap.init()
11-11 21:30:36.273: W/dalvikvm(871): threadid=7: thread exiting with uncaught exception (group=0x4001d800)
11-11 21:30:36.280: E/AndroidRuntime(871): FATAL EXCEPTION: Thread-8
11-11 21:30:36.280: E/AndroidRuntime(871): java.lang.RuntimeException: Can't create handler inside thread that has not called Looper.prepare()
11-11 21:30:36.280: E/AndroidRuntime(871): at android.os.Handler.<init>(Handler.java:121)
11-11 21:30:36.280: E/AndroidRuntime(871): at android.webkit.WebView$PrivateHandler.<init>(WebView.java:6252)
11-11 21:30:36.280: E/AndroidRuntime(871): at android.webkit.WebView.<init>(WebView.java:395)
11-11 21:30:36.280: E/AndroidRuntime(871): at android.webkit.WebView.<init>(WebView.java:920)
11-11 21:30:36.280: E/AndroidRuntime(871): at android.webkit.WebView.<init>(WebView.java:910)
11-11 21:30:36.280: E/AndroidRuntime(871): at android.webkit.WebView.<init>(WebView.java:901)
11-11 21:30:36.280: E/AndroidRuntime(871): at com.phonegap.DroidGap.init(DroidGap.java:268)
11-11 21:30:36.280: E/AndroidRuntime(871): at com.phonegap.DroidGap.loadUrlIntoView(DroidGap.java:381)
11-11 21:30:36.280: E/AndroidRuntime(871): at com.phonegap.DroidGap.access$300(DroidGap.java:159)
11-11 21:30:36.280: E/AndroidRuntime(871): at com.phonegap.DroidGap$3.run(DroidGap.java:537)
11-11 21:30:36.280: E/AndroidRuntime(871): at java.lang.Thread.run(Thread.java:1096)