4
PhoneGapとAndroidでOpenStreetMapを使用する方法の例を探しています。
私はウェブ上の古い例しか見つけられませんでした。 http://mab.edina.ac.uk/geomobile-test/osm.htmlが、最新のPhoneGapで動作しませんでした。私はPhoneGapのチュートリアルに従いました。OpenStreetMap/OpenLayersの使い方は？
た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>
メインクラス：
package de.h3llghost.phonegap.test;
import android.os.Bundle;
import com.phonegap.DroidGap;
public class PhoneGapTestActivity extends DroidGap {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
super.loadUrl("file:///android_asset/www/index.html");
// Doesn't work there is something wrong with the timeout in PhoneGap
//super.loadUrl("file:///android_asset/www/index.html", 50000);
}
}
のindex.html：私はエラーを次しまった
<!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)
ありがとうございました。
ありがとう、私はPhoneGapに報告します。マップコントロールを使用する別のソリューションの上。 – CSchulz