!!!###!!!title=如何在项目中引用 VRender——VisActor/VRender 教程文档!!!###!!!!!!###!!!description=在[如何获取 VRender](./How_to_Get_VRender)章节中我们介绍了获取 VRender 的方式,本章节会一一介绍这些获取方式下如何引用 VRender。!!!###!!!

如何在项目中引用 VChart

如何获取 VRender章节中我们介绍了获取 VRender 的方式,本章节会一一介绍这些获取方式下如何引用 VRender。

cdn 使用

我们从  cdn  获取到 VChart 文件后,就可以将其添加到 HTML 文件的  <script>  标签中:

npm 使用

我们通过  npm  的方式将  @visactor/vrender  安装到项目之后,就可以通过如下方式进行使用了:

import { createStage, createCircle } from '@visactor/vrender';

const stage = createStage({
  canvas: 'main', // canvasid
  autoRender: true // 开启自动渲染
});
// 创建一个circle图元
const circle = createCircle({
  radius: 60,
  x: 200,
  y: 200,
  fill: 'red'
});
// 添加到stage中
stage.defaultLayer.add(circle);