2

http://openlayers.org/dev/examples/graphic-name.htmlのように...フィーチャジオメトリをフラグとして描画しようとしましたが、OpenLayersは常にジオメトリの重心を使用してフィーチャを指定されたポイント(緯度/経度)ですが、フラグのベースを指定されたポイントに配置したいと思います。Renderer.symbolの値を変更しても、graphicXOffset/graphicYOffsetは効果がありませんでした。

//my flag geometry
OpenLayers.Renderer.symbol.flag = [0, 0, 0, 140, 120, 140, 120, 60, 4, 60, 4, 0, 0, 0];

//create vector layer with default and select styles
myVectorLayer = new OpenLayers.Layer.Vector("Flag Geometry", {
    renderers: renderer,
    isBaseLayer: true,
    graphicName: flag,
    rotation: 180,
    pointRadius: 15,
    projection: new OpenLayers.Projection("EPSG:900913"),
    styleMap: new OpenLayers.StyleMap({
        "default": new OpenLayers.Style(OpenLayers.Util.applyDefaults({
            fillColor: "red",
            strokeColor: "gray",
            label: "${label}",
            fontColor: "${favColor}",
            fontSize: "12px",
            fontFamily: "Courier New, monospace",
            fontWeight: "bold",
            labelYOffset: 2 //for flag
        }, OpenLayers.Feature.Vector.style["default"])),
        "select": new OpenLayers.Style(OpenLayers.Util.applyDefaults({
        }, OpenLayers.Feature.Vector.style["select"]))
    })
});

var flag = new OpenLayers.Geometry.Point(latitude, longitude);
var flagFeature = new OpenLayers.Feature.Vector(flag);
myVectorLayer.addFeatures([flagFeature]);
4

1 に答える 1

2

この基点の問題を克服するために、描画方法を次のように変更しました。

myVectorLayer = new OpenLayers.Layer.Vector("Flag Geometry", {
renderers: renderer,
isBaseLayer: true,
projection: new OpenLayers.Projection("EPSG:900913"),
styleMap: new OpenLayers.StyleMap({
    "default": new OpenLayers.Style(OpenLayers.Util.applyDefaults({
        fillColor: "red",
        strokeColor: "gray",
        label: "${label}",
        fontColor: "${favColor}",
        fontSize: "12px",
        fontFamily: "Courier New, monospace",
        fontWeight: "bold",
        labelYOffset: 2 //for flag
    }, OpenLayers.Feature.Vector.style["default"])),
        "select": new OpenLayers.Style(OpenLayers.Util.applyDefaults({
    }, OpenLayers.Feature.Vector.style["select"]))
})
});

var pointList = [];
var xs = [0, 0, 240, 240, 8, 8, 0];
var ys = [0, 280, 280, 120, 120, 0, 0];

for(var p=0; p<6; ++p) {
    var newPoint = new OpenLayers.Geometry.Point(camera.get('latitude') + xs[p],
        camera.get('longitude') + ys[p]);

    pointList.push(newPoint);
}
pointList.push(pointList[0]);
var linearRing = new OpenLayers.Geometry.LinearRing(pointList);
var flagVector = new OpenLayers.Feature.Vector(
        new OpenLayers.Geometry.Polygon([linearRing]));

flagVector.attributes= {
    label: 'label',
    favColor: 'blue', //favorite color
    align: "cm"
};
myVectorLayer.addFeatures([flagVector]);

ただし、これにより、以前の方法とは異なり、マップズームを使用してジオメトリがズームされます。

于 2012-09-26T08:04:38.553 に答える