GWT Elemental 2 Canvas and 2d Context use. (casting from NativeObject).

Elemental2CanvasCircleExample.java

import elemental2.CanvasRenderingContext2D;
import elemental2.Document;
import elemental2.Global;
import elemental2.HTMLBodyElement;
import elemental2.HTMLCanvasElement;

/**
 * <inherits name="elemental2"/>
 */
public class Elemental2CanvasCircleExample implements EntryPoint {

  @Override
  public void onModuleLoad() {
    // JSNI: $doc
    Document document = Global.document;

    // CanvasElement
    HTMLCanvasElement canvas = (HTMLCanvasElement) document.createElement("canvas");
    canvas.width = 200;
    canvas.height = 200;
    canvas.style.margin = "10px";
    canvas.style.border = "1px dashed coral";
    
    double centerX = canvas.width / 2;
    double centerY = canvas.height / 2;
    double radius = 40;

    // RootPanel.get().add(canvasElement);
    HTMLBodyElement bodyElement = Global.document.body;
    bodyElement.appendChild(canvas);

    // Double cast for now
    CanvasRenderingContext2D context = (CanvasRenderingContext2D) (Object) canvas.getContext("2d");
    context.beginPath();
    context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
    context.fillStyle = "coral";
    context.fill();
    context.lineWidth = 5;
    context.strokeStyle = "#003300";
    context.stroke();
  }

}