Examples with CanvasElement com.google.gwt.dom.client.CanvasElement used on opensource projects

Example 1 with CanvasElement

use of com.google.gwt.dom.client.CanvasElement in project playn by threerings.

the class HtmlImage method toSubPattern.

@Override
protected Pattern toSubPattern(AbstractImageGL<?> image, boolean repeatX, boolean repeatY, float x, float y, float width, float height) {
    CanvasElement canvas = Document.get().createElement("canvas").<CanvasElement>cast();
    canvas.setWidth(MathUtil.iceil(width));
    canvas.setHeight(MathUtil.iceil(height));
    canvas.getContext2d().drawImage(img, x, y, width, height, 0, 0, width, height);
    ImageElement subelem = canvas.cast();
    return new HtmlPattern(image, subelem, repeatX, repeatY);
}

Example 2 with CanvasElement

use of com.google.gwt.dom.client.CanvasElement in project lienzo-core by ahome-it.

the class Layer method getElement.

public final DivElement getElement() {
    if (null == m_wrapper) {
        m_wrapper = Document.get().createDivElement();
        m_wrapper.getStyle().setPosition(Position.ABSOLUTE);
        m_wrapper.getStyle().setDisplay(Display.INLINE_BLOCK);
        final CanvasElement element = getCanvasElement();
        if (null != element) {
            if (false == isSelection()) {
                m_wrapper.appendChild(element);
            }
        }
    }
    return m_wrapper;
}

Example 3 with CanvasElement

use of com.google.gwt.dom.client.CanvasElement in project lienzo-core by ahome-it.

the class Layer method setPixelSize.

/**
 * Sets this layer's pixel size.
 *
 * @param wide
 * @param high
 */
void setPixelSize(final int wide, final int high) {
    m_wide = wide;
    m_high = high;
    if (LienzoCore.IS_CANVAS_SUPPORTED) {
        if (false == isSelection()) {
            getElement().getStyle().setWidth(wide, Unit.PX);
            getElement().getStyle().setHeight(high, Unit.PX);
        }
        final CanvasElement element = getCanvasElement();
        element.setWidth(wide);
        element.setHeight(high);
        if (false == isSelection()) {
            getContext().getNativeContext().initDeviceRatio();
        }
        if ((false == isSelection()) && (null != m_select)) {
            m_select.setPixelSize(wide, high);
        }
    }
}

Example 4 with CanvasElement

use of com.google.gwt.dom.client.CanvasElement in project gwt-cs by iSergio.

the class KML method buildPanel.

@Override
public void buildPanel() {
    csVPanel = new ViewerPanel();
    ListBox kmlLBox = new ListBox();
    kmlLBox.addItem("KML - Global Science Facilities", GWT.getModuleBaseURL() + "SampleData/kml/facilities/facilities.kml");
    kmlLBox.addItem("KMZ with embedded data - GDP per capita", GWT.getModuleBaseURL() + "SampleData/kml/gdpPerCapita2008.kmz");
    kmlLBox.addItem("gx KML extensions - Bike Ride", GWT.getModuleBaseURL() + "SampleData/kml/bikeRide.kml");
    kmlLBox.addChangeHandler(new ChangeHandler() {

        @Override
        public void onChange(ChangeEvent changeEvent) {
            reset();
            ListBox source = (ListBox) changeEvent.getSource();
            final Viewer viewer = csVPanel.getViewer();
            org.cesiumjs.cs.scene.Camera camera = viewer.camera;
            CanvasElement canvas = viewer.canvas();
            camera.flyHome(0);
            // camera, canvas);
            KmlDataSourceOptions kmlDataSourceOptions = new KmlDataSourceOptions();
            kmlDataSourceOptions.canvas = canvas;
            kmlDataSourceOptions.camera = camera;
            if (!source.getSelectedValue().contains("bikeRide")) {
                csVPanel.getViewer().dataSources().add(KmlDataSource.load(source.getSelectedValue(), kmlDataSourceOptions));
            } else {
                csVPanel.getViewer().dataSources().add(KmlDataSource.load(source.getSelectedValue(), kmlDataSourceOptions)).then(new Fulfill<KmlDataSource>() {

                    @Override
                    public void onFulfilled(KmlDataSource dataSource) {
                        viewer.clock().shouldAnimate = false;
                        final Entity rider = dataSource.entities.getById("tour");
                        viewer.flyTo(rider).then(new Fulfill<Boolean>() {

                            @Override
                            public void onFulfilled(Boolean value) {
                                viewer.trackedEntity = rider;
                                viewer.selectedEntity = viewer.trackedEntity;
                                viewer.clock().multiplier = 30;
                                viewer.clock().shouldAnimate = true;
                            }
                        });
                    }
                });
            }
        }
    });
    AbsolutePanel aPanel = new AbsolutePanel();
    aPanel.add(csVPanel);
    aPanel.add(kmlLBox, 20, 20);
    contentPanel.add(new HTML("<p>A simple KML example.</p>"));
    contentPanel.add(aPanel);
    initWidget(contentPanel);
}

Example 5 with CanvasElement

use of com.google.gwt.dom.client.CanvasElement 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);
}