在 Titanium 的 Appcelerator 中仅显示网格但没有地图的 Mapview

Question

我正在使用 Titanium 的 Appcelerator 开发基于地图的应用程序。我面临的问题是，当我在 Android 设备上模拟应用程序时，我可以看到地图视图的网格，但没有显示地图。我已将“ti.android.google.map.api.key”放在“tiapp.xml”文件中，并且还设置了所有 android manifest 特定权限。我的源代码是：

tiapp.xml:

<android xmlns:android="http://schemas.android.com/apk/res/android">
<tool-api-level>8</tool-api-level>
<manifest android:installLocation="preferExternal">
  <uses-sdk android:minSdkVersion="7" />
   <uses-library android:name="com.google.android.maps"/>
<uses-permission android:name="android.permission.INTERNET"/>
<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_GPS"/>
<uses-permission android:name="android.permission.ACCESS_LOCATION"/>
<uses-permission android:name="android.permission.ACCESS_ASSISTED_GPS"/>
</manifest>
</android>
<mobileweb>
 <precache/>
  <splash>
        <enabled>true</enabled>
        <inline-css-images>true</inline-css-images>
    </splash>
    <theme>default</theme>
</mobileweb>
<modules>
<module platform="commonjs" version="2.2.0">ti.cloud</module>
</modules>
<property name="ti.android.google.map.api.key">my api key</property>
</ti:app>

下面是用于创建 GUI 的“app.js”

app.js:

var win = Ti.UI.createWindow();
var mapview = Titanium.Map.createView({
mapType: Titanium.Map.STANDARD_TYPE,
region: {latitude:37.389569, longitude:-122.050212,
        latitudeDelta:0.1, longitudeDelta:0.1},
animate:true,
regionFit:true,
userLocation:false
});
win.add(mapview);
win.open();

Answer 1

首先，您检查您的 Android 模拟器/设备是否与 Internet 连接连接。

如果 Internet 工作正常，则它运行正常。

有关更多详细信息和信息或（演示代码），请参阅此。 tiapp.xml

<?xml version="1.0" encoding="UTF-8"?>
<ti:app xmlns:ti="http://ti.appcelerator.org">
    <deployment-targets>
        <target device="mobileweb">false</target>
        <target device="iphone">false</target>
        <target device="ipad">false</target>
        <target device="android">true</target>
        <target device="blackberry">false</target>
    </deployment-targets>
    <id>com.maps</id>
    <name>maps</name>
    <version>1.0</version>
    <publisher>tlukasavage</publisher>
    <url></url>
    <description>not specified</description>
    <copyright>2011 by tlukasavage</copyright>
    <icon>appicon.png</icon>
    <persistent-wifi>false</persistent-wifi>
    <prerendered-icon>false</prerendered-icon>
    <statusbar-style>default</statusbar-style>
    <statusbar-hidden>false</statusbar-hidden>
    <fullscreen>false</fullscreen>
    <navbar-hidden>false</navbar-hidden>
    <analytics>true</analytics>
    <guid>YOUR_GUID</guid>
    <iphone>
        <orientations device="iphone">
            <orientation>Ti.UI.PORTRAIT</orientation>
        </orientations>
        <orientations device="ipad">
            <orientation>Ti.UI.PORTRAIT</orientation>
            <orientation>Ti.UI.UPSIDE_PORTRAIT</orientation>
            <orientation>Ti.UI.LANDSCAPE_LEFT</orientation>
            <orientation>Ti.UI.LANDSCAPE_RIGHT</orientation>
        </orientations>
    </iphone>
    <android xmlns:android="http://schemas.android.com/apk/res/android"/>
    <modules/>

    <!-- Here's where we add the API key -->
    <property name="ti.android.google.map.api.key">YOUR_ANDROID_MAPS_API_KEY</property>
</ti:app>

app.js

var win = Ti.UI.createWindow();

var annotations = [
    Ti.Map.createAnnotation({
        latitude: 37.389569,
        longitude: -122.050212,
        title: 'Appcelerator HQ',
        subtitle: 'Mountain View, CA',
        animate: true,
        pincolor: Ti.Map.ANNOTATION_GREEN,
        leftButton: 'appcelerator.gif'
    }),
    Ti.Map.createAnnotation({
        latitude: 37.331689,
        longitude: -122.030731,
        title: 'Apple HQ',
        subtitle: 'Cupertino, CA',
        animate: true,
        pincolor: Ti.Map.ANNOTATION_RED,
        rightButton: 'apple.png'
    }),
    Ti.Map.createAnnotation({
        latitude: 37.422502,
        longitude: -122.0855498,
        title: 'Google HQ',
        subtitle: 'Mountain View, CA',
        animate: true,
        image: 'google.png',
        leftView: Ti.UI.createButton({
            title: 'leftView',
            height: 32,
            width: 70
        }),
        rightView: Ti.UI.createLabel({
            text: 'rightView',
            height: 'auto',
            width: 'auto',
            color: '#fff'
        })
    })
];
var mapview = Titanium.Map.createView({
    mapType: Titanium.Map.STANDARD_TYPE,
    region: {
        latitude:37.389569,
        longitude:-122.050212,
        latitudeDelta:.05,
        longitudeDelta:.05
    },
    animate:true,
    regionFit:true,
    userLocation:false,
    annotations: annotations
});
mapview.addRoute({
    name: 'myroute',
    width: 4,
    color: '#f00',
    points: [
        {latitude:37.422502, longitude:-122.0855498},
        {latitude:37.389569, longitude:-122.050212},
        {latitude:37.331689, longitude:-122.030731}
    ]
});
win.add(mapview);
win.open();

试试这个，这对你真的很有帮助...干杯..

Answer 2

我也有同样的问题，设备已连接到互联网，可以在设备中浏览

我通过向 Manifest 添加 INTERNET 权限解决了这个问题

<uses-permission android:name="android.permission.INTERNET"/>

我不知道这是不是正确的解决方案，但这解决了我的问题，

还是试试看吧..

Answer 3

我遇到了同样的问题，Android 显示空白地图，而 iOS 很好。我使用的是钛合金框架。

文档说要做：

alloy.js

// Loads the map module, which can be referenced by Alloy.Globals.Map
Alloy.Globals.Map = require('ti.map');

index.xml

<View id="mapview" ns="Alloy.Globals.Map" onClick="report" />

由于某种原因，Android 不喜欢 Alloy.Globals.Map，而是更喜欢直接引用 ti.map。以下对 index.xml 的更改对我有用：

index.xml

<View id="mapview" ns="Ti.Map" platform='android' onClick="report" />
<View id="mapview" ns="Alloy.Globals.Map" platform='ios' onClick="report" />