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

Example 31 with ViewerPanel

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

the class Billboards method buildPanel.

@Override
public void buildPanel() {
    csVPanel = new ViewerPanel();
    addBillboard();
    ListBox billboardsLBox = new ListBox();
    billboardsLBox.addItem("Add billboard", "0");
    billboardsLBox.addItem("Set billboard properties at creation", "1");
    billboardsLBox.addItem("Change billboard properties", "2");
    billboardsLBox.addItem("Size billboard in meters", "3");
    billboardsLBox.addItem("Add multiple billboards", "4");
    billboardsLBox.addItem("Scale by viewer distance", "5");
    billboardsLBox.addItem("Fade by viewer distance", "6");
    billboardsLBox.addItem("Offset by viewer distance", "7");
    billboardsLBox.addItem("Add marker billboards", "8");
    billboardsLBox.addChangeHandler(new ChangeHandler() {

        @Override
        public void onChange(ChangeEvent changeEvent) {
            ListBox source = (ListBox) changeEvent.getSource();
            reset();
            switch(source.getSelectedValue()) {
                case "0":
                    addBillboard();
                    break;
                case "1":
                    setBillboardProperties();
                    break;
                case "2":
                    changeBillboardProperties();
                    break;
                case "3":
                    sizeBillboardInMeters();
                    break;
                case "4":
                    addMultipleBillboards();
                    break;
                case "5":
                    scaleByDistance();
                    break;
                case "6":
                    fadeByDistance();
                    break;
                case "7":
                    offsetByDistance();
                    break;
                case "8":
                    addMarkerBillboards();
                default:
                    break;
            }
        }
    });
    AbsolutePanel aPanel = new AbsolutePanel();
    aPanel.add(csVPanel);
    aPanel.add(billboardsLBox, 20, 20);
    contentPanel.add(new HTML("<p>Add billboard images and markers to the scene.</p>"));
    contentPanel.add(aPanel);
    initWidget(contentPanel);
}

Example 32 with ViewerPanel

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

the class CZMLPolygonIntervalsAvailability method buildPanel.

@Override
public void buildPanel() {
    ViewerPanel csVPanel = new ViewerPanel();
    contentPanel.add(new HTML("<p>CZML Dynamic Polygon - Intervals and Availability.</p>"));
    contentPanel.add(csVPanel);
    initWidget(contentPanel);
}

Example 33 with ViewerPanel

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

the class CameraTutorial method buildPanel.

@Override
public void buildPanel() {
    csVPanel = new ViewerPanel();
    csVPanel.addHandler(new ClickHandler() {

        @Override
        public void onClick(ClickEvent clickEvent) {
            csVPanel.getViewer().canvas().focus();
        }
    }, ClickEvent.getType());
    csVPanel.getViewer().canvas().setAttribute("tabindex", "0");
    csVPanel.getViewer().scene().screenSpaceCameraController().enableRotate = false;
    csVPanel.getViewer().scene().screenSpaceCameraController().enableTranslate = false;
    csVPanel.getViewer().scene().screenSpaceCameraController().enableZoom = false;
    csVPanel.getViewer().scene().screenSpaceCameraController().enableTilt = false;
    csVPanel.getViewer().scene().screenSpaceCameraController().enableLook = false;
    handler = new ScreenSpaceEventHandler(csVPanel.getViewer().canvas());
    handler.setInputAction(new ScreenSpaceEventHandler.Listener<org.cesiumjs.cs.core.events.MouseDownEvent>() {

        @Override
        public void function(org.cesiumjs.cs.core.events.MouseDownEvent event) {
            flags.looking = true;
            mousePosition = startMousePosition = new Cartesian3(event.position.x, event.position.y, 0);
        }
    }, ScreenSpaceEventType.LEFT_DOWN());
    handler.setInputAction(new ScreenSpaceEventHandler.Listener<org.cesiumjs.cs.core.events.MouseMoveEvent>() {

        @Override
        public void function(org.cesiumjs.cs.core.events.MouseMoveEvent event) {
            mousePosition = new Cartesian3(event.endPosition.x, event.endPosition.y, 0);
        }
    }, ScreenSpaceEventType.MOUSE_MOVE());
    handler.setInputAction(new ScreenSpaceEventHandler.Listener<org.cesiumjs.cs.core.events.MouseUpEvent>() {

        @Override
        public void function(org.cesiumjs.cs.core.events.MouseUpEvent event) {
            flags.looking = false;
        }
    }, ScreenSpaceEventType.LEFT_UP());
    RootPanel.get().addDomHandler(new KeyDownHandler() {

        @Override
        public void onKeyDown(KeyDownEvent keyDownEvent) {
            setFlag(keyDownEvent.getNativeKeyCode(), true);
        }
    }, KeyDownEvent.getType());
    RootPanel.get().addDomHandler(new KeyUpHandler() {

        @Override
        public void onKeyUp(KeyUpEvent keyUpEvent) {
            setFlag(keyUpEvent.getNativeKeyCode(), false);
        }
    }, KeyUpEvent.getType());
    csVPanel.getViewer().clock().onTick.addEventListener(new Event.Listener() {

        @Override
        public void function(Object... o) {
            org.cesiumjs.cs.scene.Camera camera = csVPanel.getViewer().camera;
            // First element in array is Clock. Check this.
            if (o[0] instanceof Clock) {
                if (flags.looking) {
                    int width = csVPanel.getViewer().canvas().getClientWidth();
                    int height = csVPanel.getViewer().canvas().getClientHeight();
                    // Coordinate (0.0, 0.0) will be where the mouse was clicked.
                    double x = (mousePosition.x - startMousePosition.x) / width;
                    double y = -(mousePosition.y - startMousePosition.y) / height;
                    double lookFactor = 0.05;
                    camera.lookRight(x * lookFactor);
                    camera.lookUp(y * lookFactor);
                }
                // Change movement speed based on the distance of the camera to the surface of the ellipsoid.
                double cameraHeight = csVPanel.getViewer().scene().globe.ellipsoid.cartesianToCartographic(camera.position).height;
                double moveRate = cameraHeight / 100.0;
                if (flags.moveForward) {
                    camera.moveForward(moveRate);
                }
                if (flags.moveBackward) {
                    camera.moveBackward(moveRate);
                }
                if (flags.moveUp) {
                    camera.moveUp(moveRate);
                }
                if (flags.moveDown) {
                    camera.moveDown(moveRate);
                }
                if (flags.moveLeft) {
                    camera.moveLeft(moveRate);
                }
                if (flags.moveRight) {
                    camera.moveRight(moveRate);
                }
            }
        }
    });
    HTML html = new HTML();
    html.setHTML("<div id=\"toolbar\">\n" + "<div>Click on the Cesium display to start.</div>\n" + "<div>w/s - move forward/backward</div>\n" + "<div>a/d - move left/right</div>\n" + "<div>q/e - move up/down</div>\n" + "<div>left mouse button down plus mouse move changes the look direction</div>\n" + "</div>");
    html.getElement().getStyle().setColor("white");
    AbsolutePanel aPanel = new AbsolutePanel();
    aPanel.add(csVPanel);
    aPanel.add(html, 20, 20);
    contentPanel.add(new HTML("<p>Use the camera to control the view, and create custom event handlers for input.</p>"));
    contentPanel.add(aPanel);
    initWidget(contentPanel);
}

Example 34 with ViewerPanel

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

the class CesiumInspector method buildPanel.

@Override
public void buildPanel() {
    ViewerPanel csVPanel = new ViewerPanel();
    Scene scene = csVPanel.getViewer().scene();
    Globe globe = csVPanel.getViewer().scene().globe;
    globe.depthTestAgainstTerrain = true;
    CesiumTerrainProviderOptions cesiumTerrainProviderOptions = new CesiumTerrainProviderOptions();
    cesiumTerrainProviderOptions.url = "https://assets.agi.com/stk-terrain/world";
    cesiumTerrainProviderOptions.requestVertexNormals = true;
    cesiumTerrainProviderOptions.requestWaterMask = true;
    csVPanel.getViewer().terrainProvider = new CesiumTerrainProvider(cesiumTerrainProviderOptions);
    // Add Cesium Inspector
    csVPanel.getViewer().extend(viewerCesiumInspectorMixin.instance());
    // Add Primitives
    PrimitiveOptions primitiveOptions = new PrimitiveOptions();
    primitiveOptions.asynchronous = false;
    GeometryInstanceOptions geometryInstanceOptions = new GeometryInstanceOptions();
    BoxGeometryOptions boxGeometryOptions = new BoxGeometryOptions();
    boxGeometryOptions.vertexFormat = PerInstanceColorAppearance.VERTEX_FORMAT();
    boxGeometryOptions.dimensions = new Cartesian3(400000.0, 300000.0, 500000.0);
    geometryInstanceOptions.geometry = BoxGeometry.createGeometry(BoxGeometry.fromDimensions(boxGeometryOptions));
    geometryInstanceOptions.modelMatrix = Matrix4.multiplyByTranslation(Transforms.eastNorthUpToFixedFrame(Cartesian3.fromDegrees(-105.0, 45.0)), new Cartesian3(0.0, 0.0, 250000), new Matrix4());
    geometryInstanceOptions.attributes = JsObject.createObject().cast();
    JsObject.$(geometryInstanceOptions.attributes, "color", ColorGeometryInstanceAttribute.fromColor(Color.RED().withAlpha(0.5f)));
    primitiveOptions.geometryInstances = new GeometryInstance[] { new GeometryInstance(geometryInstanceOptions) };
    PerInstanceColorAppearanceOptions perInstanceColorAppearanceOptions = new PerInstanceColorAppearanceOptions();
    perInstanceColorAppearanceOptions.closed = true;
    primitiveOptions.appearance = new PerInstanceColorAppearance(perInstanceColorAppearanceOptions);
    scene.primitives().add(new Primitive(primitiveOptions));
    primitiveOptions = new PrimitiveOptions();
    primitiveOptions.asynchronous = false;
    geometryInstanceOptions = new GeometryInstanceOptions();
    RectangleGeometryOptions rectangleGeometryOptions = new RectangleGeometryOptions();
    rectangleGeometryOptions.rectangle = Rectangle.fromDegrees(-100.0, 30.0, -93.0, 37.0);
    rectangleGeometryOptions.height = 100000;
    rectangleGeometryOptions.vertexFormat = PerInstanceColorAppearance.VERTEX_FORMAT();
    geometryInstanceOptions.geometry = RectangleGeometry.createGeometry(new RectangleGeometry(rectangleGeometryOptions));
    geometryInstanceOptions.attributes = JsObject.createObject().cast();
    JsObject.$(geometryInstanceOptions.attributes, "color", ColorGeometryInstanceAttribute.fromColor(Color.BLUE()));
    primitiveOptions.geometryInstances = new GeometryInstance[] { new GeometryInstance(geometryInstanceOptions) };
    primitiveOptions.appearance = new PerInstanceColorAppearance();
    scene.primitives().add(new Primitive(primitiveOptions));
    BillboardCollection billboards = (BillboardCollection) scene.primitives().add(new BillboardCollection());
    BillboardOptions billboardOptions = new BillboardOptions();
    billboardOptions.position = Cartesian3.fromDegrees(-75.59777, 40.03883, 150000);
    billboardOptions.image = GWT.getModuleBaseURL() + "images/Cesium_Logo_overlay.png";
    billboards.add(billboardOptions);
    contentPanel.add(new HTML("<p>Use the cesium inspector as a debugging tool for different primitives</p>"));
    contentPanel.add(csVPanel);
    initWidget(contentPanel);
}

Example 35 with ViewerPanel

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

the class Clustering method buildPanel.

@Override
public void buildPanel() {
    csVPanel = new ViewerPanel();
    KmlDataSourceOptions kmlDataSourceOptions = new KmlDataSourceOptions();
    kmlDataSourceOptions.camera = csVPanel.getViewer().camera;
    kmlDataSourceOptions.canvas = csVPanel.getViewer().canvas();
    Promise<KmlDataSource, Void> dataSourcePromise = csVPanel.getViewer().dataSources().add(KmlDataSource.load(GWT.getModuleBaseURL() + "SampleData/kml/facilities/facilities.kml", kmlDataSourceOptions));
    dataSourcePromise.then(new Fulfill<KmlDataSource>() {

        @Override
        public void onFulfilled(KmlDataSource dataSource) {
            int pixelRange = 25;
            int minimumClusterSize = 3;
            boolean enabled = true;
            dataSource.clustering.enabled = enabled;
            dataSource.clustering.pixelRange = pixelRange;
            dataSource.clustering.minimumClusterSize = minimumClusterSize;
            PinBuilder pinBuilder = new PinBuilder();
            pin50 = pinBuilder.fromText("50+", Color.RED(), 48).toDataUrl();
            pin40 = pinBuilder.fromText("40+", Color.ORANGE(), 48).toDataUrl();
            pin30 = pinBuilder.fromText("30+", Color.YELLOW(), 48).toDataUrl();
            pin20 = pinBuilder.fromText("20+", Color.GREEN(), 48).toDataUrl();
            pin10 = pinBuilder.fromText("10+", Color.BLUE(), 48).toDataUrl();
            singleDigitPins = new String[8];
            for (int i = 0; i < singleDigitPins.length; ++i) {
                singleDigitPins[i] = pinBuilder.fromText("" + (i + 2), Color.VIOLET(), 48).toDataUrl();
            }
            // start with custom style
            customStyle(dataSource);
            _dataSource = dataSource;
        }
    });
    pixelRangeSlider = new Slider("pixelRange", 1, 200, 15);
    pixelRangeSlider.setStep(1);
    pixelRangeSlider.setWidth("150px");
    pixelRangeSlider.addListener(new MSliderListener());
    pixelRangeTBox = new TextBox();
    pixelRangeTBox.addChangeHandler(new MChangeHandler());
    pixelRangeTBox.setText("" + 15);
    pixelRangeTBox.setSize("30px", "12px");
    HorizontalPanel pixelRangeHPanel = new HorizontalPanel();
    pixelRangeHPanel.setHorizontalAlignment(HasHorizontalAlignment.ALIGN_CENTER);
    pixelRangeHPanel.setVerticalAlignment(HasVerticalAlignment.ALIGN_MIDDLE);
    pixelRangeHPanel.setSpacing(10);
    pixelRangeHPanel.add(pixelRangeSlider);
    pixelRangeHPanel.add(pixelRangeTBox);
    minimumClusterSizeSlider = new Slider("minimumClusterSize", 1, 20, 3);
    minimumClusterSizeSlider.setStep(1);
    minimumClusterSizeSlider.setWidth("150px");
    minimumClusterSizeSlider.addListener(new MSliderListener());
    minimumClusterSizeTBox = new TextBox();
    pixelRangeTBox.addChangeHandler(new MChangeHandler());
    minimumClusterSizeTBox.setText("" + 3);
    minimumClusterSizeTBox.setSize("30px", "12px");
    HorizontalPanel minimumClusterSizeHPanel = new HorizontalPanel();
    minimumClusterSizeHPanel.setHorizontalAlignment(HasHorizontalAlignment.ALIGN_CENTER);
    minimumClusterSizeHPanel.setVerticalAlignment(HasVerticalAlignment.ALIGN_MIDDLE);
    minimumClusterSizeHPanel.setSpacing(10);
    minimumClusterSizeHPanel.add(minimumClusterSizeSlider);
    minimumClusterSizeHPanel.add(minimumClusterSizeTBox);
    CheckBox enabledCBox = new CheckBox();
    enabledCBox.setValue(true);
    enabledCBox.addValueChangeHandler(new ValueChangeHandler<Boolean>() {

        @Override
        public void onValueChange(ValueChangeEvent<Boolean> valueChangeEvent) {
            _dataSource.clustering.enabled = valueChangeEvent.getValue();
        }
    });
    CheckBox customStyleCBox = new CheckBox();
    customStyleCBox.setValue(true);
    customStyleCBox.addValueChangeHandler(new ValueChangeHandler<Boolean>() {

        @Override
        public void onValueChange(ValueChangeEvent<Boolean> valueChangeEvent) {
            customStyle(_dataSource);
        }
    });
    FlexTable flexTable = new FlexTable();
    flexTable.setHTML(1, 0, "<font color=\"white\">Pixel Range</font>");
    flexTable.setWidget(1, 1, pixelRangeHPanel);
    flexTable.setHTML(2, 0, "<font color=\"white\">Minimum Cluster Size</font>");
    flexTable.setWidget(2, 1, minimumClusterSizeHPanel);
    flexTable.setHTML(3, 0, "<font color=\"white\">Enabled</font>");
    flexTable.setWidget(3, 1, enabledCBox);
    flexTable.setHTML(4, 0, "<font color=\"white\">Custom Style</font>");
    flexTable.setWidget(4, 1, customStyleCBox);
    AbsolutePanel aPanel = new AbsolutePanel();
    aPanel.add(csVPanel);
    aPanel.add(flexTable, 20, 20);
    contentPanel.add(new HTML("<p>Cluster labels, billboards and points.</p>"));
    contentPanel.add(aPanel);
    initWidget(contentPanel);
}