[英]WebWorldWind Renderable Position Update
I am trying to "move" renderables around the web worldwind globe on an interval. 我试图在一段时间内围绕网络世界风地球“移动”可渲染物。 To illustrate the issue I am having, I made a small example.
为了说明我遇到的问题,我做了一个小例子。
This works (but is inefficient): 这有效(但效率低下):
var myVar = setInterval(myTimer, 5000);
function myTimer() {
shapesLayer.removeRenderable(shape);
shape = new WorldWind.SurfaceCircle(new WorldWind.Location(shape.center.latitude+1, shape.center.longitude), 200e3, attributes);
shapesLayer.addRenderable(shape);
console.log(" new pos "+shape.center.latitude + " "+shape.center.longitude);
wwd.redraw();
}
This is what I'd like to do, but the shape doesn't move: 这是我想做的,但形状不动:
var myVar = setInterval(myTimer, 5000);
function myTimer() {
shape.center = new WorldWind.Location(shape.center.latitude+1, shape.center.longitude);
console.log(" new pos "+shape.center.latitude + " "+shape.center.longitude);
wwd.redraw();
}
Is there a flag I need to set on the renderable to make it refresh? 我需要在渲染上设置一个标志以使其刷新吗?
Here is the full SurfaceShapes.js file I've been playing with (based on this http://worldwindserver.net/webworldwind/examples/SurfaceShapes.html ): 这是我一直在玩的完整SurfaceShapes.js文件(基于这个http://worldwindserver.net/webworldwind/examples/SurfaceShapes.html ):
/*
* Copyright (C) 2014 United States Government as represented by the Administrator of the
* National Aeronautics and Space Administration. All Rights Reserved.
*/
/**
* Illustrates how to display SurfaceShapes.
*
* @version $Id: SurfaceShapes.js 3320 2015-07-15 20:53:05Z dcollins $
*/
requirejs(['../src/WorldWind',
'./LayerManager'],
function (ww,
LayerManager) {
"use strict";
// Tell World Wind to log only warnings.
WorldWind.Logger.setLoggingLevel(WorldWind.Logger.LEVEL_WARNING);
// Create the World Window.
var wwd = new WorldWind.WorldWindow("canvasOne");
/**
* Added imagery layers.
*/
var layers = [
{layer: new WorldWind.BMNGLayer(), enabled: true},
{layer: new WorldWind.BingAerialWithLabelsLayer(null), enabled: true},
{layer: new WorldWind.CompassLayer(), enabled: true},
{layer: new WorldWind.CoordinatesDisplayLayer(wwd), enabled: true},
{layer: new WorldWind.ViewControlsLayer(wwd), enabled: true}
];
for (var l = 0; l < layers.length; l++) {
layers[l].layer.enabled = layers[l].enabled;
wwd.addLayer(layers[l].layer);
}
// Create a layer to hold the surface shapes.
var shapesLayer = new WorldWind.RenderableLayer("Surface Shapes");
wwd.addLayer(shapesLayer);
// Create and set attributes for it. The shapes below except the surface polyline use this same attributes
// object. Real apps typically create new attributes objects for each shape unless they know the attributes
// can be shared among shapes.
var attributes = new WorldWind.ShapeAttributes(null);
attributes.outlineColor = WorldWind.Color.BLUE;
attributes.drawInterior = false;
attributes.outlineWidth = 4;
attributes.outlineStippleFactor = 1;
attributes.outlineStipplePattern = 0xF0F0;
var highlightAttributes = new WorldWind.ShapeAttributes(attributes);
highlightAttributes.interiorColor = new WorldWind.Color(1, 1, 1, 1);
// Create a surface circle with a radius of 200 km.
var shape = new WorldWind.SurfaceCircle(new WorldWind.Location(35, -120), 200e3, attributes);
shape.highlightAttributes = highlightAttributes;
shapesLayer.addRenderable(shape);
// Create a layer manager for controlling layer visibility.
var layerManger = new LayerManager(wwd);
// Now set up to handle highlighting.
var highlightController = new WorldWind.HighlightController(wwd);
var myVar = setInterval(myTimer, 5000);
function myTimer() {
//Shape doesn't move
shape.center = new WorldWind.Location(shape.center.latitude+1, shape.center.longitude);
//Shape "moves" but is inefficient
//shapesLayer.removeRenderable(shape);
//shape = new WorldWind.SurfaceCircle(new WorldWind.Location(shape.center.latitude+1, shape.center.longitude), 200e3, attributes);
//shapesLayer.addRenderable(shape);
console.log(" new pos "+shape.center.latitude + " "+shape.center.longitude);
wwd.redraw();
}
}
);
Document says renderables
variable is readonly but I think it can be possible. 文件说
renderables
变量是readonly但我认为它是可能的。
change code 改变代码
shape.center = new WorldWind.Location(shape.center.latitude+1, shape.center.longitude);
To 至
index = ShapesLayer.renderables.indexOf(shape);
ShapesLayer.renderables[index].center = new WorldWind.Location(shape.center.latitude+1, shape.center.longitude);
I think ShapesLayer.addRenderable create anther shape. 我认为ShapesLayer.addRenderable可以创造出另一种形状。
If you think it's not good way to do you can use this way 如果您认为这不是一个好方法,您可以使用这种方式
RenderableLayer.prototype.changeRenderable= function (prevRenderable, nextRenderable) {
index = ShapesLayer.renderables.indexOf(prevRenderable);
ShapesLayer.renderables[index].center = nextRenderable;
};
main code 主要代码
ShapesLayer.changeRenderable(shape, new WorldWind.Location(shape.center.latitude+1, shape.center.longitude));
Document : https://nasaworldwind.github.io/WebWorldWind/layer_RenderableLayer.js.html 文件: https : //nasaworldwind.github.io/WebWorldWind/layer_RenderableLayer.js.html
If anyone else is looking at this, I found a better solution to force it to recompute the center position by setting isPrepared to false and _boundaries to undefined. 如果其他人正在考虑这个问题,我找到了一个更好的解决方案,通过将isPrepared设置为false并将_boundaries设置为undefined来强制它重新计算中心位置。
var myVar = setInterval(myTimer, 5000);
function myTimer() {
shape.isPrepared = false;
shape._boundaries = undefined;
shape.center = new WorldWind.Location(shape.center.latitude+1, shape.center.longitude);
console.log(" new pos "+shape.center.latitude + " "+shape.center.longitude);
wwd.redraw();
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.