WebWorldWind可呈現位置更新

Question

我試圖在間隔期間「移動」可在網絡世界風世界各地展示的可呈現對象。爲了說明我遇到的問題，我做了一個小例子。

此作品（但效率不高）：

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(); 
    } 

這是我想要做什麼，但形狀不動：

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(); 
    } 

有一個標誌，我需要設置可渲染以使其更新？

以下是完整的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(); 
     } 
    } 
); 

Answer 1

如果別人在看這個，我找到了一個更好的解決方案，迫使它通過將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(); 
    } 

Answer 2

文件說renderables變量是隻讀的，但我認爲這是可能的。
變化碼

shape.center = new WorldWind.Location(shape.center.latitude+1, shape.center.longitude); 

要

index = ShapesLayer.renderables.indexOf(shape); 
ShapesLayer.renderables[index].center = new WorldWind.Location(shape.center.latitude+1, shape.center.longitude); 

我覺得ShapesLayer.addRenderable創建花葯形狀。

如果你認爲這是不這樣做，你可以用這樣的方式

RenderableLayer.prototype.changeRenderable= function (prevRenderable, nextRenderable) { 

     index = ShapesLayer.renderables.indexOf(prevRenderable); 
     ShapesLayer.renderables[index].center = nextRenderable; 
    }; 

主代碼好辦法

ShapesLayer.changeRenderable(shape, new WorldWind.Location(shape.center.latitude+1, shape.center.longitude)); 

文件：https://nasaworldwind.github.io/WebWorldWind/layer_RenderableLayer.js.html