[英]Openlayers - LayerRedraw() / Feature rotation / Linestring coords
TLDR :我有一个 Openlayers 地图,其中有一个名为“轨道”的图层,我想删除轨道并重新添加轨道。或者弄清楚如何根据一组坐标和标题绘制三角形(见下文)。
我在一个图层上有一个图像“imageFeature” ,它在加载时旋转到设置的方向。 我希望它更新在名为'tracking'的图层上的'styleMap' 中设置的旋转。
由于“styleMap”适用于图层,我认为我必须删除图层并再次添加它而不仅仅是“imageFeature”
层:
var tracking = new OpenLayers.Layer.GML("Tracking", "coordinates.json", {
format: OpenLayers.Format.GeoJSON,
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 秒运行一次样式映射,但是如果我在萤火虫中放置手表,则不会更新旋转,并且标题的变量正在正确更新。
如果我要绘制一个带有点和线串数组的三角形。 我将如何面对三角形朝向标题。 我有一点的经纬度和航向。
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);
寻找任何方法来解决这个问题 Image 或 Line 任何人都知道该怎么做,要么添加了100rep 的赏金,我真的很坚持这个。
//From getJSON request//
var heading = data.RawHeading;
添加和删除 imageFeature
问题解决如下:
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;
})();
问题解决了。 完美运行。
您还可以尝试将标题作为属性放在对象上:
{"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进行调试,我一直都是这样做的。 有一件棘手的事情; 解析geojson时; 在最终的 javascript 对象上,“属性”被翻译成“属性”。
第一个猜测:
我假设您的图层有一个单点对象,可以像跟随带有 GPS 的汽车一样移动和旋转?
如果您简单地销毁图层上的所有要素(假设它只有一个要素)并使用新的标题集重绘该要素,则可能会更好。
第二个猜测:也许您需要使用函数而不是变量来维护与旋转的实时连接。
请在此处查看文档: http : //trac.openlayers.org/wiki/Styles关于样式。
希望这个对你有帮助。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.