Search in sources :

Example 1 with JsImage

use of org.cesiumjs.cs.js.JsImage in project gwt-cs by iSergio.

the class LoadImages method buildPanel.

@Override
public void buildPanel() {
    csVPanel = new ViewerPanel();
    AbsolutePanel aPanel = new AbsolutePanel();
    aPanel.add(csVPanel);
    org.cesiumjs.cs.core.PinBuilder pinBuilder = new org.cesiumjs.cs.core.PinBuilder();
    pinBuilder.fromUrlPromise(GWT.getModuleBaseURL() + "images/Cesium_Logo_Color_Overlay.png", Color.WHITE().withAlpha(0.0f), 256).then(new Fulfill<CanvasElement>() {

        @Override
        public void onFulfilled(CanvasElement value) {
            BillboardGraphicsOptions billboardOptions = new BillboardGraphicsOptions();
            billboardOptions.image = new ConstantProperty<>(value.toDataUrl());
            EntityOptions entityOptions = new EntityOptions();
            entityOptions.name = "Pin billboard through fromUrl";
            entityOptions.billboard = new BillboardGraphics(billboardOptions);
            entityOptions.position = new ConstantPositionProperty(Cartesian3.fromDegrees(35, 35));
            csVPanel.getViewer().entities().add(new Entity(entityOptions));
        }
    });
    Resource.fetchImage((ResourceImageOptions) ResourceImageOptions.create(GWT.getModuleBaseURL() + "images/Cesium_Logo_Color_Overlay.png")).then(new Fulfill<JsImage>() {

        @Override
        public void onFulfilled(JsImage value) {
            Canvas canvas = Canvas.createIfSupported();
            canvas.setWidth(value.width + "px");
            canvas.setHeight(value.height + "px");
            Context2d context = canvas.getContext2d();
            context.scale(0.1, 0.1);
            context.drawImage((ImageElement) (Object) value, 0, 0);
            BillboardGraphicsOptions billboardOptions = new BillboardGraphicsOptions();
            billboardOptions.image = new ConstantProperty<>(canvas.toDataUrl());
            EntityOptions entityOptions = new EntityOptions();
            entityOptions.name = "Pin billboard through canvas";
            entityOptions.billboard = new BillboardGraphics(billboardOptions);
            entityOptions.position = new ConstantPositionProperty(Cartesian3.fromDegrees(45, 45));
            csVPanel.getViewer().entities().add(new Entity(entityOptions));
        }
    });
    // CORS not loaded
    Resource.fetchImage((ResourceImageOptions) ResourceImageOptions.create("https://www.linux.org.ru/tango/img/games-logo.png")).then(new Fulfill<JsImage>() {

        @Override
        public void onFulfilled(JsImage value) {
            Canvas canvas = Canvas.createIfSupported();
            canvas.setWidth(value.width + "px");
            canvas.setHeight(value.height + "px");
            Context2d context = canvas.getContext2d();
            context.scale(0.1, 0.1);
            context.drawImage((ImageElement) (Object) value, 0, 0);
            BillboardGraphicsOptions billboardOptions = new BillboardGraphicsOptions();
            billboardOptions.image = new ConstantProperty<>(canvas.toDataUrl());
            EntityOptions entityOptions = new EntityOptions();
            entityOptions.name = "Pin billboard CORS";
            entityOptions.billboard = new BillboardGraphics(billboardOptions);
            entityOptions.position = new ConstantPositionProperty(Cartesian3.fromDegrees(55, 55));
            csVPanel.getViewer().entities().add(new Entity(entityOptions));
        }
    });
    // Cors not loaded!
    final JsImage imageAmz = new JsImage();
    imageAmz.crossOrigin = "*";
    imageAmz.onload = new JsImage.Listener() {

        @Override
        public void function() {
            Cesium.log(imageAmz);
            /*Canvas canvas = Canvas.createIfSupported();
                canvas.setWidth(imageAmz.width + "px");
                canvas.setHeight(imageAmz.height + "px");
                Context2d context = canvas.getContext2d();
                context.scale(0.1, 0.1);
                context.drawImage((ImageElement) (Object) imageAmz, 0, 0);*/
            BillboardGraphicsOptions billboardOptions = new BillboardGraphicsOptions();
            billboardOptions.image = new ConstantProperty<>(imageAmz);
            // billboardOptions.image = new ConstantProperty<>(canvas.toDataUrl("image/png"));
            EntityOptions entityOptions = new EntityOptions();
            entityOptions.name = "Pin billboard CORS";
            entityOptions.billboard = new BillboardGraphics(billboardOptions);
            entityOptions.position = new ConstantPositionProperty(Cartesian3.fromDegrees(65, 65));
            csVPanel.getViewer().entities().add(new Entity(entityOptions));
        }
    };
    imageAmz.src = "https://d1.awsstatic.com/products/cloudfront/cloudfront-100_PoP_600x400.4a1edd6022833c54c41370ad9f615ae818350a23.png";
    // Worked, have Access-Control-Allow-Origin: *
    final JsImage imageWiki = new JsImage();
    imageWiki.crossOrigin = "*";
    imageWiki.onload = new JsImage.Listener() {

        @Override
        public void function() {
            Cesium.log(imageWiki);
            Canvas canvas = Canvas.createIfSupported();
            canvas.setWidth(imageWiki.width + "px");
            canvas.setHeight(imageWiki.height + "px");
            Context2d context = canvas.getContext2d();
            context.drawImage((ImageElement) (Object) imageWiki, 0, 0);
            BillboardGraphicsOptions billboardOptions = new BillboardGraphicsOptions();
            billboardOptions.image = new ConstantProperty<>(canvas.toDataUrl("image/png"));
            EntityOptions entityOptions = new EntityOptions();
            entityOptions.name = "Pin billboard CORS";
            entityOptions.billboard = new BillboardGraphics(billboardOptions);
            entityOptions.position = new ConstantPositionProperty(Cartesian3.fromDegrees(75, 75));
            csVPanel.getViewer().entities().add(new Entity(entityOptions));
        }
    };
    imageWiki.src = "https://ru.wikipedia.org/static/images/project-logos/ruwiki-2x.png";
    contentPanel.add(new HTML("<p>Cluster labels, billboards and points.</p>"));
    contentPanel.add(aPanel);
    initWidget(contentPanel);
}
Also used : Entity(org.cesiumjs.cs.datasources.Entity) AbsolutePanel(com.google.gwt.user.client.ui.AbsolutePanel) HTML(com.google.gwt.user.client.ui.HTML) CanvasElement(com.google.gwt.dom.client.CanvasElement) EntityOptions(org.cesiumjs.cs.datasources.options.EntityOptions) ImageElement(com.google.gwt.dom.client.ImageElement) ResourceImageOptions(org.cesiumjs.cs.core.options.ResourceImageOptions) ViewerPanel(org.cesiumjs.cs.widgets.ViewerPanel) ConstantProperty(org.cesiumjs.cs.datasources.properties.ConstantProperty) Canvas(com.google.gwt.canvas.client.Canvas) BillboardGraphics(org.cesiumjs.cs.datasources.graphics.BillboardGraphics) ConstantPositionProperty(org.cesiumjs.cs.datasources.properties.ConstantPositionProperty) BillboardGraphics(org.cesiumjs.cs.datasources.graphics.BillboardGraphics) JsImage(org.cesiumjs.cs.js.JsImage) Context2d(com.google.gwt.canvas.dom.client.Context2d) BillboardGraphicsOptions(org.cesiumjs.cs.datasources.graphics.options.BillboardGraphicsOptions)

Example 2 with JsImage

use of org.cesiumjs.cs.js.JsImage in project gwt-cs by iSergio.

the class Billboards method offsetByDistance.

private void offsetByDistance() {
    Resource.fetchImage(GWT.getModuleBaseURL() + "images/Cesium_Logo_overlay.png").then(new Fulfill<JsImage>() {

        @Override
        public void onFulfilled(JsImage logoImg) {
            Resource.fetchImage(GWT.getModuleBaseURL() + "images/facility.gif").then(new Fulfill<JsImage>() {

                @Override
                public void onFulfilled(JsImage facilityImg) {
                    int facilityHeight = facilityImg.height;
                    BillboardGraphicsOptions billboardGraphicsOptions = new BillboardGraphicsOptions();
                    billboardGraphicsOptions.image = new ConstantProperty<>(facilityImg);
                    billboardGraphicsOptions.horizontalOrigin = new ConstantProperty<>(HorizontalOrigin.CENTER());
                    billboardGraphicsOptions.verticalOrigin = new ConstantProperty<>(VerticalOrigin.BOTTOM());
                    BillboardGraphics billboardGraphics = new BillboardGraphics(billboardGraphicsOptions);
                    EntityOptions entityOptions = new EntityOptions();
                    entityOptions.billboard = billboardGraphics;
                    entityOptions.position = new ConstantPositionProperty(Cartesian3.fromDegrees(-75.59777, 40.03883));
                    csVPanel.getViewer().entities().add(new Entity(entityOptions));
                    billboardGraphicsOptions = new BillboardGraphicsOptions();
                    billboardGraphicsOptions.image = new ConstantProperty<>(logoImg);
                    billboardGraphicsOptions.horizontalOrigin = new ConstantProperty<>(HorizontalOrigin.CENTER());
                    billboardGraphicsOptions.verticalOrigin = new ConstantProperty<>(VerticalOrigin.BOTTOM());
                    billboardGraphicsOptions.pixelOffset = new ConstantProperty<>(new Cartesian2(0.0, -facilityHeight));
                    billboardGraphicsOptions.pixelOffsetScaleByDistance = new ConstantProperty<>(new NearFarScalar(1.0e3, 1.0, 1.5e6, 0.0));
                    billboardGraphicsOptions.translucencyByDistance = new ConstantProperty<>(new NearFarScalar(1.0e3, 1.0, 1.5e6, 0.1));
                    billboardGraphics = new BillboardGraphics(billboardGraphicsOptions);
                    entityOptions = new EntityOptions();
                    entityOptions.billboard = billboardGraphics;
                    entityOptions.position = new ConstantPositionProperty(Cartesian3.fromDegrees(-75.59777, 40.03883));
                    csVPanel.getViewer().entities().add(new Entity(entityOptions));
                }
            }, new Reject<Void>() {

                @Override
                public void onRejected(Void value) {
                    LOGGER.info("facility imagery not loaded");
                }
            });
        }
    }, new Reject<Void>() {

        @Override
        public void onRejected(Void value) {
            LOGGER.info("Cesium_Logo_overlay imagery not loaded");
        }
    });
}
Also used : Entity(org.cesiumjs.cs.datasources.Entity) BillboardGraphics(org.cesiumjs.cs.datasources.graphics.BillboardGraphics) ConstantPositionProperty(org.cesiumjs.cs.datasources.properties.ConstantPositionProperty) EntityOptions(org.cesiumjs.cs.datasources.options.EntityOptions) JsImage(org.cesiumjs.cs.js.JsImage) Reject(org.cesiumjs.cs.promise.Reject) BillboardGraphicsOptions(org.cesiumjs.cs.datasources.graphics.options.BillboardGraphicsOptions) Fulfill(org.cesiumjs.cs.promise.Fulfill)

Example 3 with JsImage

use of org.cesiumjs.cs.js.JsImage in project gwt-cs by iSergio.

the class Labels method offsetByDistance.

private void offsetByDistance() {
    final JsImage image = new JsImage();
    image.onload = new JsImage.Listener() {

        @Override
        public void function() {
            BillboardGraphicsOptions billboardGraphicsOptions = new BillboardGraphicsOptions();
            billboardGraphicsOptions.scaleByDistance = new ConstantProperty<>(new NearFarScalar(1.5e2, 5.0, 1.5e7, 0.5));
            billboardGraphicsOptions.image = new ConstantProperty<>(image);
            LabelGraphicsOptions labelGraphicsOptions = new LabelGraphicsOptions();
            labelGraphicsOptions.text = new ConstantProperty<>("Label on top of scaling billboard");
            labelGraphicsOptions.font = new ConstantProperty<>("20px sans-serif");
            labelGraphicsOptions.showBackground = new ConstantProperty<>(true);
            labelGraphicsOptions.horizontalOrigin = new ConstantProperty<>(HorizontalOrigin.CENTER());
            labelGraphicsOptions.pixelOffset = new ConstantProperty<>(new Cartesian2(0.0, -image.height));
            labelGraphicsOptions.pixelOffsetScaleByDistance = new ConstantProperty<>(new NearFarScalar(1.5e2, 3.0, 1.5e7, 0.5));
            EntityOptions entityOptions = new EntityOptions();
            entityOptions.position = new ConstantPositionProperty(Cartesian3.fromDegrees(-75.1641667, 39.9522222));
            entityOptions.billboard = new BillboardGraphics(billboardGraphicsOptions);
            entityOptions.label = new LabelGraphics(labelGraphicsOptions);
            csVPanel.getViewer().entities().add(entityOptions);
        }
    };
    image.src = GWT.getModuleBaseURL() + "images/facility.gif";
}
Also used : JsImage(org.cesiumjs.cs.js.JsImage) ConstantProperty(org.cesiumjs.cs.datasources.properties.ConstantProperty) Cartesian2(org.cesiumjs.cs.core.Cartesian2) BillboardGraphicsOptions(org.cesiumjs.cs.datasources.graphics.options.BillboardGraphicsOptions) BillboardGraphics(org.cesiumjs.cs.datasources.graphics.BillboardGraphics) LabelGraphics(org.cesiumjs.cs.datasources.graphics.LabelGraphics) NearFarScalar(org.cesiumjs.cs.core.NearFarScalar) ConstantPositionProperty(org.cesiumjs.cs.datasources.properties.ConstantPositionProperty) LabelGraphicsOptions(org.cesiumjs.cs.datasources.graphics.options.LabelGraphicsOptions) EntityOptions(org.cesiumjs.cs.datasources.options.EntityOptions)

Aggregations

BillboardGraphics (org.cesiumjs.cs.datasources.graphics.BillboardGraphics)3 BillboardGraphicsOptions (org.cesiumjs.cs.datasources.graphics.options.BillboardGraphicsOptions)3 EntityOptions (org.cesiumjs.cs.datasources.options.EntityOptions)3 ConstantPositionProperty (org.cesiumjs.cs.datasources.properties.ConstantPositionProperty)3 JsImage (org.cesiumjs.cs.js.JsImage)3 Entity (org.cesiumjs.cs.datasources.Entity)2 ConstantProperty (org.cesiumjs.cs.datasources.properties.ConstantProperty)2 Canvas (com.google.gwt.canvas.client.Canvas)1 Context2d (com.google.gwt.canvas.dom.client.Context2d)1 CanvasElement (com.google.gwt.dom.client.CanvasElement)1 ImageElement (com.google.gwt.dom.client.ImageElement)1 AbsolutePanel (com.google.gwt.user.client.ui.AbsolutePanel)1 HTML (com.google.gwt.user.client.ui.HTML)1 Cartesian2 (org.cesiumjs.cs.core.Cartesian2)1 NearFarScalar (org.cesiumjs.cs.core.NearFarScalar)1 ResourceImageOptions (org.cesiumjs.cs.core.options.ResourceImageOptions)1 LabelGraphics (org.cesiumjs.cs.datasources.graphics.LabelGraphics)1 LabelGraphicsOptions (org.cesiumjs.cs.datasources.graphics.options.LabelGraphicsOptions)1 Fulfill (org.cesiumjs.cs.promise.Fulfill)1 Reject (org.cesiumjs.cs.promise.Reject)1