« 「LOCATION VIEW」というサービスが凄過ぎる | メイン | スター・ウォーズ/クローン・ウォーズ »

2008/08/04

PlaceEngine JavaScript API を使おうとしたところ、IEで「操作は中断されました」エラー

Posted in Web, モバイルマップ at 14:15:27 by ジュンヤ

「モバイルマップ」に PlaceEngine の現在地取得機能を追加するにあたり、はまったところを共有しておきます。

PlaceEngine のページに用意されている以下のチュートリアル（Sample2: PlaceEngine + Google Maps の部分）にならって実装したところ難なくできたような気がしました。

» PlaceEngine JavaScript API

ところが、Mac の Safari と Firefox で確認したあと、PC の IE で見ようとしたら、「操作は中断されました」というエラーが出て撃沈。

untitled.png

この謎のエラーメッセージのほかには何の手がかりもありません。

ググってみると見覚えのあるエントリーが。。

» GOGA - doodle開発記: インターネットサイトは開けません。操作は中断されました。

けもの会議仲間の ishimaru さんがちょうどそのままずばりのエントリーを書かれていました。

結局レンダリングのタイミングでIEの気に障る部分がでるとこのエラーが出るようで、iframeで呼び出すかbody onloadで呼び出すと出なくなるというのが解決策の模様。

ということで、結局 PlaceEngine + Google Maps のサンプルを以下のように書き換えたところうまく表示されるようになりました。

PEngine オブジェクト生成部分を onload で呼び出す形に変更しています。書き換えた部分は赤字にしてあります。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>PlaceEngine + Google Maps</title>
<script src="http://maps.google.com/maps?file=api&v=2&key=...."  *1
      type="text/javascript"></script>
<script src="http://www.placeengine.com/javascripts/pengine.js" type="text/javascript"></script>
<script type="text/javascript">  *2
    //<![CDATA[
    var map = null;
    function load() {
      if (GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("map"));
        map.addControl(new GLargeMapControl());
        map.addControl(new GScaleControl());
        map.setCenter(new GLatLng(35.67134, 139.76516), 17);
      }
    }
    function loadPe() {
      pe = new PEngine({
        onGetLocation: function(x, y, r, info) {   *4
          if (map != null) map.panTo(new GLatLng(y, x));
          if (document.getElementById(”pestatus”)!=null) {
            document.getElementById(”pestatus”).innerHTML = info.addr;
          }
        },
        idstatus:”pestatus”,
        appkey:”…..”  *5
      });
    }
    //]]>
</script>
<style type=”text/css”>
.peui input {margin:0 0 -4px 0;}
</style>
</head>

<body onload=”load();loadPe();” onunload=”GUnload()”>

<h1>PlaceEngine + Google Maps</h1>

<div id=”map” style=”width: 500px; height: 300px”></div>

<div class=”peui”>
<input alt=”位置を教える” src=”http://www.placeengine.com/images/wide_bt2.png” type=”image”
        onclick=’pe.registerLocation(map)’ />  *3
<input alt=”現在地を取得” src=”http://www.placeengine.com/images/wide_bt1.png” type=”image”
        onclick=’pe.getLocation()’ />
<span id=”pestatus”></span>
</div>

<script type=”text/javascript”>
var pe;
</script>

</body>
</html>
Webカテゴリの最近の記事 　　　　　　　　　　　　

コメント・トラックバック(4) »

この記事のトラックバックURL

  1. 投稿者:榊祐介

    2008/08/04 at 14:52:29

    私もお客様からGoogle Analyticsで出るという指摘があって悩んだことがあります。
    自社サイトならJS実行順を変えることで回避できるらしいですがAnalyticsはこちらでいじれないですからねー。

  2. 投稿者:ジュンヤ

    2008/08/04 at 14:57:06

    なるほど google analytics でもでるときあるんですか。

    回避策としては、

    <script type=”text/javascript”>
    _uacct = “UA-xxxxxx-xx”;
    urchinTracker();
    </script>

    の urchinTracker(); の部分を onload で呼び出すようにするんですか？

  3. 投稿者:けひん

    2008/08/04 at 16:41:16

    アナリティクスも＜/body＞の後ろに置くという手もありなん。。
    参照感謝です。あとで新たに得られた知見も含め、ブログしますね。

  4. 投稿者:links for 2008-08-04 [delicious.com] « 個人的な雑記

    2008/08/05 at 7:32:07

    […] PlaceEngine JavaScript API を使おうとしたところ、IEで「操作は中断されました」エラー : 僕は発展途上技術者 (tags: ie) […]

コメント・トラックバック

この記事のトラックバックURL

コメントを残す