sidebarDepth: 2

CRender

这里将介绍CRender类，例如实例化、实例属性以及原型方法。

类

  1. /**
  2.  * @description           CRender类
  3.  * @param {Object} canvas Canvas节点
  4.  * @return {CRender}      CRender实例
  5.  */
  6. class CRender {
  7.     // ...
  8. }

实例化

  1. import CRender from '@jiaminghi/c-render'
  3. const canvas = document.getElementById('canvas')
  5. const render = new CRender(canvas)

实例属性

这里是CRender实例属性的介绍。

ctx

  1. /**
  2.  * @description canvas context
  3.  * @type {Object}
  4.  * @example ctx = canvas.getContext('2d')
  5.  */

area

  1. /**
  2.  * @description canvas宽高
  3.  * @type {Array<Number>}
  4.  * @example area = [300，100]
  5.  */

animationStatus

  1. /**
  2.  * @description render是否处于动画渲染中
  3.  * @type {Boolean}
  4.  * @example animationStatus = true|false
  5.  */

graphs

  1. /**
  2.  * @description 已添加的图形
  3.  * @type {Array<Graph>}
  4.  * @example graphs = [Graph, Graph, ...]
  5.  */

color

  1. /**
  2.  * @description 颜色插件
  3.  * @type {Object}
  4.  */

bezierCurve

  1. /**
  2.  * @description 贝塞尔曲线插件
  3.  * @type {Object}
  4.  */

原型方法

这里是CRender原型方法的介绍。

add

  1. /**
  2.  * @description 向render中添加图形
  3.  * @param {Object} config 图形配置
  4.  * @return {Graph} 图形实例
  5.  */
  6. CRender.prototype.add = function (config = {}) {
  7.     // ...
  8. }

clone

  1. /**
  2.  * @description 克隆一个图形
  3.  * @param {Graph} graph 将要被克隆的图形
  4.  * @return {Graph} 克隆的图形
  5.  */
  6. CRender.prototype.clone = function (graph) {
  7. }

delGraph

  1. /**
  2.  * @description 删除render中的一个图形
  3.  * @param {Graph} graph 将要删除的图形实例
  4.  * @return {Undefined} 无返回值
  5.  */
  6. CRender.prototype.delGraph = function (graph) {
  7.     // ...
  8. }

delAllGraph

  1. /**
  2.  * @description 删除render中所有的图形
  3.  * @return {Undefined} 无返回值
  4.  */
  5. CRender.prototype.delAllGraph = function () {
  6.     // ...
  7. }

drawAllGraph

  1. /**
  2.  * @description 渲染render中所有的图形
  3.  * @return {Undefined} 无返回值
  4.  */
  5. CRender.prototype.drawAllGraph = function () {
  6.     // ...
  7. }

clearArea

  1. /**
  2.  * @description 擦除canvas绘制区域
  3.  * @return {Undefined} 无返回值
  4.  */
  5. CRender.prototype.clearArea = function () {
  6.     // ...
  7. }

launchAnimation

  1. /**
  2.  * @description 使动画队列不为空且animationPause不为false的图形进行动画
  3.  * @return {Promise} Animation Promise
  4.  */
  5. CRender.prototype.launchAnimation = function () {
  6.     // ...
  7. }