javascript - 15 を超える KML レイヤが Google Maps API ベースのページに表示されない

Question

この奇妙な問題があります。個別の KML ファイルから単一のマップウィンドウに多数の KML レイヤーを生成する必要があります。金額は、カップルから50未満の間で異なります。現時点では、1、4、または 15 個の KML ファイル (URI として) を配列として指定すると、コードは正しい動作を生成します。基本的に、コードが機能し、KML ファイルが十分に有効であることはわかっています。

23 個の KML URI の配列を使用してマップの初期化を呼び出す方法の例を次に示します。

ただし、コードに 16 個以上の KML URI を含む配列を指定すると、問題が発生します。その後、これらの KML ファイルはマップキャンバスにレンダリングされません。ただし、どこにもエラーは発生しません。また、KML ファイルがマップ上に「存在する」こともわかっています。どうすればこれを知ることができますか? ご覧のとおり、私のコードは KML ファイルごとに InfoWindow を生成します。一部の KML ファイルの場所がわかっているので、それらが非表示またはレンダリングされず、InfoWindow が表示されます。意図したとおりです。

そして、呼び出された関数 initmap() を含む、map_display.js の完全な内容を次に示します。

function initmap(urls){
    // Creating an option object for the map
    var myLatlng = new google.maps.LatLng(63.349501, 26.817627);
    var options = {
        zoom: 6,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    // Initializing the map
    var map = new google.maps.Map(document.getElementById('map_canvas'), options);

    if(urls != null) {
        for(var i=0;i<urls.length;i++) {
            var url = urls[i];
            url = url+"?dummy="+(new Date()).getTime();
            var ctaLayer = createKML(url);
            ctaLayer.setMap(map);
        }
    }

    function createKML(url){

        var ctaLayer = new google.maps.KmlLayer(url, {suppressInfoWindows: true, preserveViewport: true});

        // Creating a correct reference for project edit URL
        var editUrl = urls[i];
        var s1 = editUrl.indexOf("project");
        s1 = s1+7;
        var s2 = editUrl.indexOf(".kml");
        editUrl = editUrl.substring(s1, s2);

        var baseUrl = getbaseUrl();

        var infoItems = new Array();
        infoItems = getInfo(editUrl);

        editUrl = '<b>' + infoItems[1] + '</b><br />' + infoItems[0] + '<br /><br /><a href="' + baseUrl + '/frontend/viewproject/' + editUrl + '">Katso projektin tiedot</a>';
        // Creating an InfoWindow object
        var infowindow = new google.maps.InfoWindow({ content: editUrl });

        google.maps.event.addListener(ctaLayer, 'click', function(kmlEvent) {
            var clickPos = kmlEvent.latLng;
            var posX = new google.maps.LatLng(clickPos.lat(), clickPos.lng());

            infowindow.close();
            infowindow.setPosition(posX);
            infowindow.open(map);

        });

        return ctaLayer;
    }

    function getbaseUrl(){

        var baseUrl = "https://" + window.location.hostname;
        var firstpath = window.location.pathname;
        var first_slash = firstpath.indexOf("/", 1);
        firstpath = firstpath.substring(0, first_slash);
        baseUrl = baseUrl + firstpath;

        return baseUrl;
    }

    function getInfo(pid){

        var jsoninfo = new Array();

        var xmlhttp;
        if (window.XMLHttpRequest)
        {
            xmlhttp=new XMLHttpRequest();
        }
        else
        {// code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }

        var json_location = getbaseUrl() + '/frontend/project_json/' + pid;

        xmlhttp.open("GET",json_location,false);
        xmlhttp.send();

        var json_answer = eval('(' + xmlhttp.responseText + ')');

        jsoninfo[0] = json_answer["projectName"];
        jsoninfo[1] = json_answer["builder"];

        return jsoninfo;
    }

}

誰か助けてくれませんか？申し訳ありませんが、パスワードで保護されている大きなページの一部であるため、ライブシステムを参考にすることはできません。

score 3 · Accepted Answer

Google が提供するデフォルトの KML レイヤーを使用した場合、あまりうまくいきませんでした。GeoXML3またはgeoxml-v3 (同じプロジェクトではありません)を試すことをお勧めします。私はキャンパスマップに GeoXML3 を使用し、自分の教育のために Github で Hello World GeoXML3 マップを作成しました。

score 1 · Accepted Answer

kml レイヤーの仕組みは、kml の URL が各タイルの URL に含まれていることです。非常に多くの kml レイヤーを追加すると、タイル URL が URL の制限である 2048 文字より長くなります。kml レイヤーの URL を短くしてみてください。

score 1 · Accepted Answer

Googleドキュメントから：

1 つの Google マップに表示できる KML レイヤーの数には制限があります。この制限を超えると、どのレイヤーも表示されなくなります。この制限は、KMLLayer クラスに渡されるすべての URL の合計の長さに基づいているため、アプリケーションによって異なります。平均して、制限に達することなく 10 から 20 のレイヤーをロードできるはずです。

javascript - 15 を超える KML レイヤが Google Maps API ベースのページに表示されない

3 に答える 3

Related

Reference