Examples with ViewerPanel org.cesiumjs.cs.widgets.ViewerPanel used on opensource projects

Example 11 with ViewerPanel

use of org.cesiumjs.cs.widgets.ViewerPanel in project gwt-cs by iSergio.

the class SpheresAndEllipsoids method buildPanel.

@Override
public void buildPanel() {
    ViewerPanel csVPanel = new ViewerPanel();
    EllipsoidGraphicsOptions ellipsoidGraphicsOptions = new EllipsoidGraphicsOptions();
    ellipsoidGraphicsOptions.radii = new ConstantProperty<>(new Cartesian3(200000.0, 200000.0, 300000.0));
    ellipsoidGraphicsOptions.material = new ColorMaterialProperty(new ConstantProperty<>(Color.BLUE()));
    EntityOptions entityOptions = new EntityOptions();
    entityOptions.name = "Blue ellipsoid";
    entityOptions.position = new ConstantPositionProperty(Cartesian3.fromDegrees(-114.0, 40.0, 300000.0));
    entityOptions.ellipsoid = new EllipsoidGraphics(ellipsoidGraphicsOptions);
    Entity blueEllpsoid = csVPanel.getViewer().entities().add(entityOptions);
    ellipsoidGraphicsOptions = new EllipsoidGraphicsOptions();
    ellipsoidGraphicsOptions.radii = new ConstantProperty<>(new Cartesian3(300000.0, 300000.0, 300000.0));
    ellipsoidGraphicsOptions.material = new ColorMaterialProperty(new ConstantProperty<>(Color.RED().withAlpha(0.5f)));
    ellipsoidGraphicsOptions.outline = new ConstantProperty<>(true);
    ellipsoidGraphicsOptions.outlineColor = new ConstantProperty<>(Color.BLACK());
    entityOptions = new EntityOptions();
    entityOptions.name = "Red sphere with black outline";
    entityOptions.position = new ConstantPositionProperty(Cartesian3.fromDegrees(-107.0, 40.0, 300000.0));
    entityOptions.ellipsoid = new EllipsoidGraphics(ellipsoidGraphicsOptions);
    Entity redSphere = csVPanel.getViewer().entities().add(entityOptions);
    ellipsoidGraphicsOptions = new EllipsoidGraphicsOptions();
    ellipsoidGraphicsOptions.radii = new ConstantProperty<>(new Cartesian3(200000.0, 200000.0, 300000.0));
    ellipsoidGraphicsOptions.outline = new ConstantProperty<>(true);
    ellipsoidGraphicsOptions.outlineColor = new ConstantProperty<>(Color.YELLOW());
    ellipsoidGraphicsOptions.fill = new ConstantProperty<>(false);
    ellipsoidGraphicsOptions.slicePartitions = new ConstantProperty<>(24);
    ellipsoidGraphicsOptions.stackPartitions = new ConstantProperty<>(36);
    entityOptions = new EntityOptions();
    entityOptions.name = "Yellow ellipsoid outline";
    entityOptions.position = new ConstantPositionProperty(Cartesian3.fromDegrees(-100.0, 40.0, 300000.0));
    entityOptions.ellipsoid = new EllipsoidGraphics(ellipsoidGraphicsOptions);
    Entity outlineOnly = csVPanel.getViewer().entities().add(entityOptions);
    csVPanel.getViewer().zoomTo(csVPanel.getViewer().entities());
    contentPanel.add(new HTML("<p>Draw spheres and ellipsoids.</p>"));
    contentPanel.add(csVPanel);
    initWidget(contentPanel);
}

Example 12 with ViewerPanel

use of org.cesiumjs.cs.widgets.ViewerPanel in project gwt-cs by iSergio.

the class Tiles3DInspector method buildPanel.

@Override
public void buildPanel() {
    final ViewerPanel csVPanel = new ViewerPanel();
    csVPanel.getViewer().extend(viewerCesium3DTilesInspectorMixin.instance());
    Cesium3DTileset tileset = (Cesium3DTileset) csVPanel.getViewer().scene().primitives().add(Cesium3DTileset.create("https://beta.cesium.com/api/assets/1461?access_token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJkYWJmM2MzNS02OWM5LTQ3OWItYjEyYS0xZmNlODM5ZDNkMTYiLCJpZCI6NDQsImFzc2V0cyI6WzE0NjFdLCJpYXQiOjE0OTkyNjQ3NDN9.vuR75SqPDKcggvUrG_vpx0Av02jdiAxnnB1fNf-9f7s"));
    csVPanel.getViewer().cesium3DTilesInspector.viewModel.tileset = tileset;
    tileset.readyPromise().then(new Fulfill<Cesium3DTileset>() {

        @Override
        public void onFulfilled(Cesium3DTileset value) {
            BoundingSphere boundingSphere = value.boundingSphere();
            csVPanel.getViewer().camera.viewBoundingSphere(boundingSphere, new org.cesiumjs.cs.core.HeadingPitchRange(0.0, -0.5, boundingSphere.radius / 4.0));
            csVPanel.getViewer().camera.lookAtTransform(Matrix4.IDENTITY());
        }
    });
    contentPanel.add(new HTML("<p>Use the 3D Tiles inspector as a debugging tool for different tilesets.</p>"));
    contentPanel.add(csVPanel);
    initWidget(contentPanel);
}

Example 13 with ViewerPanel

use of org.cesiumjs.cs.widgets.ViewerPanel in project gwt-cs by iSergio.

the class Cardboard method buildPanel.

@Override
public void buildPanel() {
    ViewerOptions viewerOptions = new ViewerOptions();
    viewerOptions.vrButton = true;
    ViewerPanel csVPanel = new ViewerPanel(viewerOptions);
    csVPanel.getViewer().scene().globe.enableLighting = true;
    CesiumTerrainProviderOptions cesiumTerrainProviderOptions = new CesiumTerrainProviderOptions();
    cesiumTerrainProviderOptions.url = "https://assets.agi.com/stk-terrain/world";
    cesiumTerrainProviderOptions.requestVertexNormals = true;
    csVPanel.getViewer().terrainProvider = new CesiumTerrainProvider(cesiumTerrainProviderOptions);
    csVPanel.getViewer().scene().globe.depthTestAgainstTerrain = true;
    // Follow the path of a plane. See the interpolation Sandcastle example.
    Math.setRandomNumberSeed(3);
    start = JulianDate.fromDate(new JsDate(2015, 2, 25, 16));
    stop = JulianDate.addSeconds(start, 360, new JulianDate());
    csVPanel.getViewer().clock().startTime = start.clone();
    csVPanel.getViewer().clock().stopTime = stop.clone();
    csVPanel.getViewer().clock().currentTime = start.clone();
    csVPanel.getViewer().clock().clockRange = ClockRange.LOOP_STOP();
    csVPanel.getViewer().clock().multiplier = 1.0;
    double lon = -112.110693;
    double lat = 36.0994841;
    double radius = 0.03;
    String modelURI = GWT.getModuleBaseURL() + "SampleData/models/CesiumBalloon/CesiumBalloon.glb";
    EntityOptions entityOptions = new EntityOptions();
    TimeIntervalOptions timeIntervalOptions = new TimeIntervalOptions();
    timeIntervalOptions.start = start;
    timeIntervalOptions.stop = stop;
    entityOptions.availability = new TimeIntervalCollection(new TimeInterval[] { new TimeInterval(timeIntervalOptions) });
    entityOptions.position = computeCirclularFlight(lon, lat, radius);
    ModelGraphicsOptions modelGraphicsOptions = new ModelGraphicsOptions();
    modelGraphicsOptions.uri = new ConstantProperty<>(modelURI);
    modelGraphicsOptions.minimumPixelSize = new ConstantProperty<>(64);
    entityOptions.model = new ModelGraphics(modelGraphicsOptions);
    entity = csVPanel.getViewer().entities().add(entityOptions);
    SampledPropertyInterpolationOptions sampledPropertyInterpolationOptions = new SampledPropertyInterpolationOptions();
    sampledPropertyInterpolationOptions.interpolationDegree = 2;
    sampledPropertyInterpolationOptions.interpolationAlgorithm = HermitePolynomialApproximation.instance();
    ((SampledPositionProperty) entity.position).setInterpolationOptions(sampledPropertyInterpolationOptions);
    // Set initial camera position and orientation to be when in the model's reference frame.
    final org.cesiumjs.cs.scene.Camera camera = csVPanel.getViewer().camera;
    camera.position = new Cartesian3(0.25, 0.0, 0.0);
    camera.direction = new Cartesian3(1.0, 0.0, 0.0);
    camera.up = new Cartesian3(0.0, 0.0, 1.0);
    camera.right = new Cartesian3(0.0, -1.0, 0.0);
    csVPanel.getViewer().scene().preRender().addEventListener(new Scene.Listener() {

        @Override
        public void function(Scene scene, JulianDate time) {
            Cartesian3 position = entity.position.getValue(time);
            if (position == null || !Cesium.defined(position)) {
                return;
            }
            Matrix4 transform;
            if (!Cesium.defined(entity.orientation)) {
                transform = Transforms.eastNorthUpToFixedFrame(position);
            } else {
                Quaternion orientation = (Quaternion) entity.orientation.getValue(time);
                if (!Cesium.defined(orientation)) {
                    return;
                }
                transform = Matrix4.fromRotationTranslation(Matrix3.fromQuaternion(orientation), position);
            }
            // Save camera state
            Cartesian3 offset = camera.position.clone();
            Cartesian3 direction = camera.direction.clone();
            Cartesian3 up = camera.up.clone();
            // Set camera to be in model's reference frame.
            camera.lookAtTransform(transform);
            // Reset the camera state to the saved state so it appears fixed in the model's frame.
            offset.clone(camera.position);
            direction.clone(camera.direction);
            up.clone(camera.up);
            Cartesian3.cross(direction, up, camera.right);
        }
    });
    // Add a few more balloons flying with the one the viewer is in.
    int numBalloons = 12;
    for (int i = 0; i < numBalloons; ++i) {
        double balloonRadius = (Math.nextRandomNumber() * 2.0 - 1.0) * 0.01 + radius;
        entityOptions = new EntityOptions();
        timeIntervalOptions = new TimeIntervalOptions();
        timeIntervalOptions.start = start;
        timeIntervalOptions.stop = stop;
        entityOptions.availability = new TimeIntervalCollection(new TimeInterval[] { new TimeInterval(timeIntervalOptions) });
        entityOptions.position = computeCirclularFlight(lon, lat, balloonRadius);
        modelGraphicsOptions = new ModelGraphicsOptions();
        modelGraphicsOptions.uri = new ConstantProperty<>(modelURI);
        modelGraphicsOptions.minimumPixelSize = new ConstantProperty<>(64);
        entityOptions.model = new ModelGraphics(modelGraphicsOptions);
        Entity balloon = csVPanel.getViewer().entities().add(entityOptions);
        sampledPropertyInterpolationOptions = new SampledPropertyInterpolationOptions();
        sampledPropertyInterpolationOptions.interpolationDegree = 2;
        sampledPropertyInterpolationOptions.interpolationAlgorithm = HermitePolynomialApproximation.instance();
        ((SampledPositionProperty) balloon.position).setInterpolationOptions(sampledPropertyInterpolationOptions);
    }
    contentPanel.add(new HTML("<p>Configure viewer to add a button enabling look at a mobile device with cardboard.</p>"));
    contentPanel.add(csVPanel);
    initWidget(contentPanel);
}

Example 14 with ViewerPanel

use of org.cesiumjs.cs.widgets.ViewerPanel in project gwt-cs by iSergio.

the class CesiumNavigation method buildPanel.

@Override
public void buildPanel() {
    ViewerCesiumNavigationMixinOptions options = new ViewerCesiumNavigationMixinOptions();
    options.defaultResetView = Rectangle.fromDegrees(71, 3, 90, 14);
    options.enableCompass = true;
    options.enableZoomControls = true;
    options.enableDistanceLegend = true;
    options.enableCompassOuterRing = true;
    ViewerPanel csVPanel = new ViewerPanel();
    csVPanel.getViewer().extend(viewerCesiumNavigationMixin.instance(), options);
    contentPanel.add(new HTML("<p>Use CesiumNavigation plugin with GWT wrapper.</p>"));
    contentPanel.add(csVPanel);
    initWidget(contentPanel);
}

Example 15 with ViewerPanel

use of org.cesiumjs.cs.widgets.ViewerPanel in project gwt-cs by iSergio.

the class CustomBaseLayerPicker method buildPanel.

@Override
public void buildPanel() {
    DivElement divElement = RootPanel.get().getElement().getOwnerDocument().createDivElement();
    divElement.setId("baseLayerPickerContainer");
    divElement.setPropertyString("style", "position:absolute;top:50px;right:42px;width:38px;height:38px;");
    List<ProviderViewModel> imageryViewModels = new ArrayList<>();
    ProviderViewModelOptions options = new ProviderViewModelOptions();
    options.name = "Open\u00adStreet\u00adMap";
    options.iconUrl = GWT.getModuleBaseURL() + "cs/CesiumUnminified/Widgets/Images/ImageryProviders/openStreetMap.png";
    options.tooltip = "OpenStreetMap (OSM) is a collaborative project to create a free editable map of the world.\nhttp://www.openstreetmap.org";
    options.imageryProviderCreationFunction = new ProviderViewModel.ImageryProviderCreationFunction() {

        @Override
        public ImageryProvider[] function() {
            return new ImageryProvider[] { Cesium.createOpenStreetMapImageryProvider("https://a.tile.openstreetmap.org/") };
        }
    };
    imageryViewModels.add(new ProviderViewModel(options));
    options = new ProviderViewModelOptions();
    options.name = "Earth at Night";
    options.iconUrl = GWT.getModuleBaseURL() + "cs/CesiumUnminified/Widgets/Images/ImageryProviders/blueMarble.png";
    options.tooltip = "The lights of cities and villages trace the outlines of civilization \n" + "        in this global view of the Earth at night as seen by NASA/NOAA\\'s Suomi NPP satellite.";
    options.imageryProviderCreationFunction = new ProviderViewModel.ImageryProviderCreationFunction() {

        @Override
        public ImageryProvider[] function() {
            return new ImageryProvider[] { new IonImageryProvider(IonImageryProviderOptions.create(3812)) };
        }
    };
    imageryViewModels.add(new ProviderViewModel(options));
    options = new ProviderViewModelOptions();
    options.name = "Natural Earth\u00a0II";
    options.iconUrl = GWT.getModuleBaseURL() + "cs/CesiumUnminified/Widgets/Images/ImageryProviders/naturalEarthII.png";
    options.tooltip = "The lights of cities and villages trace the outlines of civilization \n" + "        in this global view of the Earth at night as seen by NASA/NOAA\\'s Suomi NPP satellite.";
    options.imageryProviderCreationFunction = new ProviderViewModel.ImageryProviderCreationFunction() {

        @Override
        public ImageryProvider[] function() {
            return new ImageryProvider[] { Cesium.createTileMapServiceImageryProvider(GWT.getModuleBaseURL() + "cs/CesiumUnminified/Assets/Textures/NaturalEarthII") };
        }
    };
    imageryViewModels.add(new ProviderViewModel(options));
    ViewerOptions viewerOptions = new ViewerOptions();
    viewerOptions.imageryProvider = (ImageryProvider) JsObject.undefined();
    viewerOptions.baseLayerPicker = false;
    ViewerPanel csVPanel = new ViewerPanel(viewerOptions);
    csVPanel.getViewer().scene().imageryLayers().removeAll(true);
    csVPanel.getViewer().container().getFirstChildElement().appendChild(divElement);
    BaseLayerPickerViewModelOptions baseLayerPickerOptions = BaseLayerPickerViewModelOptions.create(csVPanel.getViewer().scene().globe);
    baseLayerPickerOptions.imageryProviderViewModels = imageryViewModels.toArray(new ProviderViewModel[imageryViewModels.size()]);
    baseLayerPickerOptions.selectedImageryProviderViewModel = imageryViewModels.get(0);
    BaseLayerPicker baseLayerPicker = new BaseLayerPicker(divElement, baseLayerPickerOptions);
    contentPanel.add(new HTML("<p>Configure custom BaseLayerPicker widget.</p>"));
    contentPanel.add(csVPanel);
    initWidget(contentPanel);
}