InfiniteCanvasGetting started
Installation
Simply run
cmd
npm install ef-infinite-canvasAfter this, simply import like this:
js
import InfiniteCanvas from 'ef-infinite-canvas'Alternatively, add a <script> tag to your web page:
html
<script src="https://cdn.jsdelivr.net/npm/ef-infinite-canvas@0.6.5/dist/infinite-canvas.umd.cjs" />That script will make a variable named InfiniteCanvas globally available.
Using InfiniteCanvas
Once you have a reference to InfiniteCanvas and a reference to an existing <canvas> element on the page, you can start drawing like this:
js
// assuming there is a <canvas> element that has id 'canvas'
const infCanvas = new InfiniteCanvas(document.getElementById('canvas'))
// get the CanvasRenderingContext2D
const ctx = infCanvas.getContext('2d');
ctx.fillStyle = '#f00';
ctx.lineWidth = 4;
ctx.beginPath();
ctx.rect(30, 30, Infinity, 30);
ctx.fill();
ctx.stroke();Result: