1.0.1-0 • Published 4 years ago
zk-draw v1.0.1-0
项目描述
提供一个绘制各种AI数据的一个工具函数
特性
- 使用UMD规范node React Vue 原生js都可以使用这个包 只是在node中无法生成canvas图表
- 图表的绘制抛弃Table+canvas的方式 全部采用canvas进行绘制
- 针对不同设备(移动端)可以根据deviceWidth Ratio等进行transform: scale(Number)进行缩放适配(canvas最小缩放不能低于0.3)
使用方法
npm install zk-draw --save
或者使用script引入
<srcipt type="text/javascript" src="canvas_tool.js"></script>
<srcipt type="text/javascript" >
console.log(window); //window上会暴露有canvas_tool的方法
</script>
import zkDraw from 'zk-draw';
// 或者直接使用功能函数
import { drawReact } from 'zk-draw'
// 默认导出的是一个对象内置有
/**
* version: String, // 版本号
* fnList: Array, // 支持的功能函数名称 可以直接 import { fnName } from 'zk-draw'使用
* fnName: Function // 功能函数 fnName只是代指
* /
已经提供的功能
// 绘制矩形框体 已测试
// ctx为Canvas画笔对象 points为框体数据[1, 2, 3,4]左上右下四个点 option为画笔配置Canvas的参数
zkDraw.drawReact(ctx, points, option);
// 或者
drawReact(ctx, points, option);
// 绘制圆
drawArc(ctx, start, radius, option)
// 绘制图片
drawImage(ctx, imgsrc, option)
// 绘制直线
drawLine(ctx, start, end, option)
// 绘制骨架
drawStone(ctx, pose, option)
// 绘制文本
drawText(ctx, text, x, y, option)
Example
计划新增内容
- ST的图表生成 (已经支持)
- 人脸特征点
- 面部朝向
- 计划增加动态图表 配合lengend动态切换图表
- 图表增加水印功能和单独的图片导出功能