@antv/g-canvas

English | 简体中文

g-canvas

• A canvas library which providing 2d draw for AntV.

✨ Features

• Powerful and scalable rendering capability with built-in basic Graphics.
• Excellent rendering performance and supports visualization scenarios with large amounts of data.
• Complete simulation of browser DOM events, and no difference from native events.
• Smooth animation implementation and rich configuration interfaces.

📦 Install

$ npm install @antv/g-canvas --save

🔨 Usage

<div id="c1"></div>

import { Canvas } from '@antv/g-canvas';

const canvas = new Canvas({
  container: 'c1',
  width: 500,
  height: 500,
});

const group = canvas.addGroup();
group.addShape('circle', {
  attrs: {
    x: 100,
    y: 100,
    r: 50,
    fill: 'red',
    stroke: 'blue',
    lineWidth: 5,
  },
});

Similar packages

Other packages similar to @antv/g-canvas

fabric

Fabric.js is a powerful and simple JavaScript HTML5 canvas library. It provides an interactive object model on top of the canvas element, making it easy to create complex shapes, animations, and interactions. Compared to @antv/g-canvas, Fabric.js offers a more extensive set of features for object manipulation and interaction.

konva

Konva is a 2D canvas library for creating desktop and mobile applications. It provides a high-level API for working with shapes, layers, and animations. Konva is similar to @antv/g-canvas in terms of performance and ease of use but offers additional features like layer management and pixel-level hit detection.

paper

Paper.js is an open-source vector graphics scripting framework that runs on top of the HTML5 Canvas. It offers a clean Scene Graph/Document Object Model and a well-designed, consistent API. Paper.js is more focused on vector graphics and provides advanced features like boolean operations on paths, which are not available in @antv/g-canvas.