applyToCanvas(ctx: CanvasRenderingContext2D);
ctx. Rendering context.
The applyToCanvas method applied the solid fill brush to the specified canvas.
To execute the example, the HTML page must contain links to the PP.js scenario file and the PP.css styles file. Place a block with the "canvas" identifier in the <body> tag:
<div id="canvas" style="border: #CCCCCC 1px solid; padding: 5px; margin: 5px; height: 100px; width: 100px;"> </div>
Create a canvas and apply a brush with the specified color to it, render a circle on the created canvas:
// Create a canvas
var settings = {
Width: 100,
Height: 100
}
var canvas = new PP.Ui.Canvas(settings);
canvas.setLeft(18);
canvas.setTop(12);
// Create a brush
var brush = new PP.SolidColorBrush();
brush.setColor("#c8c8fa");
// Apply brush settings for canvas
brush.applyToCanvas(canvas.getContext());
// Place the canvas in the <div> block
var container = document.getElementById("canvas");
canvas.addToNode(container)
// Render a circle on the canvas
canvas.drawCircle(50, 50, 40, true, true);
canvas.flush();
As a result a circle with specified color fill is rendered: