5

マップ上にいくつかの大きなポリゴンを描画する必要があります。ポリゴンは日付変更線のすべての側で複製する必要があります。それらはグーグルマップの私の例と同じように描かれるべきです。

1)ポリゴンが日付変更線と交差する場合にポリゴンを描画する方法について、ご意見をお聞かせください。この問題を例と同じように販売しましたが、日付変更線と交差するときにポリゴンを描画するのに問題がありました。経度に360度を追加したのはそのためです-それは正しいですか?

for (var i = 1; i < polygonPoints.length; i++) {
      var dY = polygonPoints[i][1] - polygonPoints[i-1][1];
      if(Math.abs(dY) > 180)
           polygonPoints[i][1] += 360;
}

2)日付変更線の両側にポリゴンを描画する正しい方法は何ですか?

私の変種を確認してください:

    var map;    // openlayers map

    // [[latitude, longitude], ...]
    var polygonPoints = [[10, -100],[30, -70],[38, -30],[40, 0],[38, 50 ],[20, 100],[50, 170],[55, 180],
                        [50, -170], [40, -160],[10, 170],[0, -170],[-10, -160],[-25, -170], [-30, 100 ],
                        [-45, 10 ],[-50, -20],[-55, 30],[-35, -160],[-40, -160],[-60, 30],  [-50, -30 ],
                        [-40, 10 ],[-25, 100], [-20, -175],[-10, -165],[0, -180 ],[10, 165],[50, -180],
                        [45, 170],[15, 100],[33, 50 ],[35, 0 ],[35, -30],[25, -70],[5, -100],[10, -100] ];
    function InitOL(){
        var wgs84Projection = new OpenLayers.Projection("EPSG:4326");
        var epsg900913 = new OpenLayers.Projection('EPSG:900913');

        var options = {
            div: "openLayersMap",
            projection: wgs84Projection,
            displayProjection: epsg900913,
            allOverlays: true,
            zoom: 1
        };

        map = new OpenLayers.Map(options);
        var mapserv = new OpenLayers.Layer.MapServer( "OpenLayers Basic",
                    "http://vmap0.tiles.osgeo.org/wms/vmap0",
                    {layers: 'basic'},
                    {wrapDateLine: true} );

        var polygonsLayer = new OpenLayers.Layer.Vector("PolygonsLayer", null, { wrapDateLine: true });

        map.addLayers([mapserv, polygonsLayer]);
        map.addControl(new OpenLayers.Control.LayerSwitcher());
        map.addControl(new OpenLayers.Control.MousePosition());
        map.zoomToMaxExtent();
        map.setCenter(new OpenLayers.LonLat(-100, 0));

        for (var i = 1; i < polygonPoints.length; i++) {
            var dY = polygonPoints[i][1] - polygonPoints[i-1][1];
            if(Math.abs(dY) > 180)
                polygonPoints[i][1] += 360;
        }

        var olPoints = [];
        for (var j = 0; j < polygonPoints.length; j++) {
            olPoints.push(new OpenLayers.Geometry.Point(polygonPoints[j][1], polygonPoints[j][0]));
        }
        var linearRing = new OpenLayers.Geometry.LinearRing(olPoints);
        var bounds = new OpenLayers.Bounds([-180, -90, 180, 90]);
        linearRing.setBounds(bounds);

        var polygonStyle = {
                strokeColor: "#770077",
                strokeOpacity: 1,
                strokeWidth: 2,
                fillColor: "#770077",
                fillOpacity: 0.5
            };

        var olPolygon = new OpenLayers.Geometry.Polygon(linearRing);
        var polygonFeature = new OpenLayers.Feature.Vector(olPolygon);
        polygonFeature.style = polygonStyle;
        polygonsLayer.addFeatures(polygonFeature);
    }
4

2 に答える 2

1

これは、OpenLayers が現在ポリゴンを描画する方法の制限のようです。おそらくバグ レポートを提出し、パッチが適用されることを期待するか、自分でパッチを適用する必要があります...このケースを検出したら、 2 番目のポリゴンを自分で生成できます。

于 2013-01-31T12:02:10.443 に答える
-1

この問題の解決策を見つけました。これはArc.jsと呼ばれ、大圏ルートを計算するためのものです。それだけでなく、日付変更線で線を分割し、日付変更線で交わる 2 つの折れ線を提供します。これは、OpenLayers が簡単にマッピングできます。

ここに画像の説明を入力 ここに画像の説明を入力

于 2014-01-21T21:01:00.370 に答える