5

TLDR:「track」というレイヤーを持つOpenlayersマップがあり、トラックを削除してトラックを追加し直したいと思います。または、1セットの座標と見出しに基づいて三角形をプロットする方法を理解します(以下を参照)。


設定されている方向に負荷がかかると回転するレイヤーに画像「imageFeature」があります。'tracking'というレイヤーの'styleMap'に設定されているこの回転を更新したいと思います。

  1. var'stylemap'を設定して、外部画像と回転を適用します。
  2. 'imageFeature'は、指定された座標でレイヤーに追加されます。
  3. 'imageFeature'が削除されました。
  4. 'imageFeature'が新しい場所に再び追加されます。回転は適用されません。

「styleMap」はレイヤーに適用されるため、「imageFeature」だけでなく、レイヤーを削除して再度追加する必要があると思います。

レイヤー

var tracking = new OpenLayers.Layer.GML("Tracking", "coordinates.json", {
  format: OpenLayers.Format.GeoJSON,
  styleMap: styleMap
});

styleMap

var styleMap = new OpenLayers.StyleMap({
  fillOpacity: 1,
  pointRadius: 10,
  rotation: heading,
});

これで、時限関数にラップされましたimageFeature

map.layers[3].addFeatures(new OpenLayers.Feature.Vector(
  new OpenLayers.Geometry.Point(longitude, latitude), {
    rotation: heading,
    type: parseInt(Math.random() * 3)
  }
));

タイプは、3つの画像のうちの1つを検索することを指します。

styleMap.addUniqueValueRules("default", "type", lookup);

var lookup = {
  0: {
    externalGraphic: "Image1.png",
    rotation: heading
  },
  1: {
    externalGraphic: "Image2.png",
    rotation: heading
  },
  2: {
    externalGraphic: "Image3.png",
    rotation: heading
  }
}

'redraw()'関数を試しましたが、 「追跡が未定義」または「map.layers[2]」が未定義であることが返されます。

tracking.redraw(true);
map.layers[2].redraw(true);

見出しは変数です: JSONフィードから。

var heading = 13.542;

しかし、これまでのところ何も機能させることができず、ロード時に画像を回転させるだけです。ただし、画像は座標で移動します。

では、再描画機能で何が間違っているのでしょうか、またはこの画像をライブで回転させるにはどうすればよいですか?

前もって感謝します

-尾崎

追加:私はなんとか得ることができました

 map.layers[2].redraw(true);

レイヤー2を正常に再描画します。ただし、回転は更新されません。スタイルマップが更新されているので考えています。しかし、それはn秒ごとにスタイルマップを実行しますが、回転の更新はなく、firebugに時計を置くと、見出しの変数が正しく更新されます。


ポイントとラインストリングの配列で三角形を描く場合。三角形を見出しに向けてどのように向きますか。私は1ポイントのLon/latと見出しを持っています。

var points = new Array(
  new OpenLayers.Geometry.Point(lon1, lat1),
  new OpenLayers.Geometry.Point(lon2, lat2),
  new OpenLayers.Geometry.Point(lon3, lat3)
);

var line = new OpenLayers.Geometry.LineString(points);

この問題を解決する方法を探しています画像または線誰もが100repの報奨金を追加する方法を知っています私は本当にこれで立ち往生しています。


//From getJSON request//
var heading = data.RawHeading;

imageFeatureの追加と削除

4

3 に答える 3

3

次のように問題を解決しました。

            var styleMap = new OpenLayers.StyleMap({
                fillOpacity: 1,
                pointRadius: 10,
                rotation: "${angle}",
            });

           var lookup = {
                0: { externalGraphic: "Image1.png", rotation: "${angle}" },
                1: { externalGraphic: "Image2.png", rotation: "${angle}" },
                2: { externalGraphic: "Image3.png", rotation: "${angle}" }
            }
 styleMap.addUniqueValueRules("default", "type", lookup);

 map.layers[3].addFeatures(new OpenLayers.Feature.Vector(
        new OpenLayers.Geometry.Point(lon, lat), {"angle": dir, type: parseInt(Math.random() * 3)}
        ), {"angle": dir});

次にリクエスト:

var dir = (function () {
                $.ajax({
                    'async': false,
                    'global': true,
                    'url': urldefault,
                    'dataType': "json",
                    'success': function (data) {
                        dir = data.Heading
                    }
                });
                return dir;
            })();

問題が解決しました。完璧に動作します。

于 2010-05-26T02:16:50.927 に答える
2

オブジェクトに属性として見出しを付けることもできます。

{"mapFeatures": {
        "type": "FeatureCollection",
        "features": [
            {
                "type": "Feature",
                "id": "1579001",
                "x": 51.0,
                "y": 1.2,
                "geometry": {
                    "type": "Point",
                    "coordinates": [
                        51.0,
                        1.2
                    ],
                    "crs": {
                        "type": "OGC",
                        "properties": {
                            "urn": "urn:ogc:def:crs:OGC:1.3:CRS84"
                        }
                    }
                },
                "properties": {
                    "heading": 45,
                    "label": "some_label_goes_here"
                }
            }
        ]
    }
}

次に、ルックアップ関数を次のように書き直す必要があります。

var lookup = {
      0: {externalGraphic: "Image1.png", rotation: ${heading}},
      1: {externalGraphic: "Image2.png", rotation: ${heading}},
      2: {externalGraphic: "Image3.png", rotation: ${heading}}
}

それを試して、それが機能するかどうかを確認できますか?属性が正しく設定されているかどうかわからない場合は、いつでもfirebugでデバッグできます。これは、私がいつも行っていることです。トリッキーなことが1つあります。geojsonを解析するとき; 「プロパティ」は、最終的なjavascriptオブジェクトの「属性」に変換されます。

于 2010-05-21T12:06:29.387 に答える
1

最初の推測:

あなたのレイヤーには、GPSで車を追跡するときのように移動および回転する単一のポイントオブジェクトがあると思いますか?

レイヤー上のすべてのフィーチャを単純に破棄し (1 つのフィーチャのみであると仮定)、新しいヘディング セットでフィーチャを再描画する方がよい場合があります。

2 番目の推測: おそらく、変数の代わりに関数を使用して、回転へのライブ接続を維持する必要があります。

スタイルに関するhttp://trac.openlayers.org/wiki/Stylesのドキュメントを確認してください。

これが少し役立つことを願っています。

于 2010-05-18T14:49:15.393 に答える