2

WebWorks アプリ内から Google マップを表示しようとしています。アプリ内のそのページの完全な HTML を次に示します (ブラウザーでは正常に動作することに注意してください)。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" id="viewport" content="height=device-height,width=device-width,user-scalable=no" />

    <title>Waste Management Service Request</title>

    <style type="text/css">
      body {
        min-height: 500px;
      }
      .center {
        text-align: center;
      }
      #page {
        font-family: Arial, sans-serif;
        font-size: 85%;
        width: 408px;
        margin: 0 auto;
        padding: 0 30px;
      }
      h3 {
        color: #006A3C;
      }
      #map-canvas {
        height: 300px;
      }
    </style>

    <script type="text/javascript" src="jquery.min.js"></script>
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
    <script type="text/javascript">

      if (typeof(blackberry) != "undefined") {
        blackberry.system.event.onHardwareKey(blackberry.system.event.KEY_BACK, function() {
          history.back(); 
        });
      }

      $(document).ready(function(){

        var geocoder, map;
        geocoder = new google.maps.Geocoder();
        var latlng = new google.maps.LatLng(-34.397, 150.644);
        var mapOptions = {
          zoom: 8,
          center: latlng,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);

        address = '100 1st St., New York City, NY'; // Hardcoded for testing.
        geocoder.geocode( {'address': address}, function(results, status) {
          if (status == google.maps.GeocoderStatus.OK) {
            map.setCenter(results[0].geometry.location);
            var marker = new google.maps.Marker({
                map: map, 
                position: results[0].geometry.location
            });
          } else {
            alert("The map failed because: " + status);
          }
        });

      })
    </script>

  </head>
  <body>

    <div id="page">
      <h3>Local Map</h3>
      <div id="map-canvas"></div>
    </div>

  </body>
</html>

アプリケーション内からは、アプリが表示されるグレーのボックスが表示されるだけです。

コードの大部分は、ここからリンクされているこのサンプル ページのソースからヤンクされていることに注意してください。

何か案は?ここで、Google が動的にレンダリングされた静的画像を提供することに頼るのが最善の策ですか (つまり、この手法)、それとも本物を取得するために欠けているものがありますか?

ところで、gmaps の JS コール スタックをクロールして、各ドメインをアプリのアクセス許可のリストに追加しようとしました。gmaptiles.co.kr、google.com、googleapis.com、および gstatic.com のアクセス許可エントリ (http と https の両方) があります。

4

5 に答える 5

1

私はGoogleマップを使用していますが、BBブラウザバージョン6を使用すると正常に動作しますが、5では動作しません(divは灰色のみです)。これはJQuery1.5.1で。

私はテストに使用しますが、グーグルマップは別のドメインも使用します。

于 2011-04-06T22:08:23.297 に答える
1

使用しているシミュレーターのバージョンは何ですか? 0.9.4 より前のバージョンには、パラメータが URL で渡されたとき、およびローカル ファイルにアクセスするときに問題を引き起こす既知の問題がありました。<access>外部の JQuery ライブラリにリンクして、最後のポイントを除外することはできますか (要素を追加することを忘れないでください)。

config.xml で定義した要素を投稿できます<access>か? 私はあなたが必要subdomains="true"か、またはそのようなものかどうか疑問に思っていましたか?

<access subdomains="true" uri="http://maps.google.com/maps/api/js"/>

それ以外は、何かが表示されるまでページからコンテンツを削除し続けることをお勧めします。たとえば、meta name="viewport"行を削除してそこから移動します...

于 2011-03-20T19:24:09.637 に答える
1

コードは問題ありません。適切なドメインへのアクセスを提供するconfig.xmlファイルに注意してください。これは私にとってはうまくいきます:

  <access subdomains="true" uri="http://gstatic.com"/>
  <access subdomains="true" uri="http://google.com"/>
  <access subdomains="true" uri="http://googleapis.com"/>

最後に、これはBB6でのみ機能します...

于 2011-04-07T21:01:14.040 に答える
0

わかりました、私はあなたの問題に対する答えを得たと思います! 1.5.1 の代わりに JQuery 1.5 を使用してみてください。JQuery 1.5.1 は WebWorks で壊れているようで、かなり不自由です!

于 2011-03-21T01:14:13.520 に答える
-1

BB OS 5 のマップ div z-index を 0 に設定します。

于 2011-04-30T10:42:20.407 に答える