Commit 57be8669 authored by wjf's avatar wjf

l

parent 15c5f20c
...@@ -35,6 +35,9 @@ interface INodeData { ...@@ -35,6 +35,9 @@ interface INodeData {
fontWeight?: string,//文本粗细 fontWeight?: string,//文本粗细
wordWrap?: "break-word" | null wordWrap?: "break-word" | null
textAlign?: "center" | "left" | "right" textAlign?: "center" | "left" | "right"
fontStyle?: "normal" | "italic" | "oblique"
} }
export interface RenderOptions { export interface RenderOptions {
...@@ -50,9 +53,9 @@ export interface RenderOptions { ...@@ -50,9 +53,9 @@ export interface RenderOptions {
* @return Promise<HTMLCanvasElement | string> * @return Promise<HTMLCanvasElement | string>
*/ */
export async function toCanvas(data: ICData, options: RenderOptions = {}, callback?: (canvas: HTMLCanvasElement) => void): Promise<HTMLCanvasElement | string> { export async function toCanvas(data: ICData, options: RenderOptions = {}, callback?: (canvas: HTMLCanvasElement) => void): Promise<HTMLCanvasElement | string> {
const {type: exportType = 'png', quality = 0.7} = options; const { type: exportType = 'png', quality = 0.7 } = options;
const {nodes, width, height} = data; const { nodes, width, height } = data;
let canvas = document.createElement("canvas"); let canvas = document.createElement("canvas");
canvas.width = width; canvas.width = width;
canvas.height = height; canvas.height = height;
...@@ -103,7 +106,7 @@ export async function toCanvas(data: ICData, options: RenderOptions = {}, callba ...@@ -103,7 +106,7 @@ export async function toCanvas(data: ICData, options: RenderOptions = {}, callba
* @param ctx * @param ctx
*/ */
function drawImage(data: INodeData, ctx: CanvasRenderingContext2D) { function drawImage(data: INodeData, ctx: CanvasRenderingContext2D) {
const {x, y, img, width, height, borderRadius} = data; const { x, y, img, width, height, borderRadius } = data;
if (borderRadius) {//有圆角,画遮罩,暂时只管一个 if (borderRadius) {//有圆角,画遮罩,暂时只管一个
ctx.save(); ctx.save();
let max = (width < height ? width : height) / 2; let max = (width < height ? width : height) / 2;
...@@ -147,6 +150,7 @@ function drawText(data: INodeData, ctx: CanvasRenderingContext2D) { ...@@ -147,6 +150,7 @@ function drawText(data: INodeData, ctx: CanvasRenderingContext2D) {
color, color,
fontSize, fontSize,
fontWeight, fontWeight,
fontStyle,
wordWrap, wordWrap,
textAlign textAlign
} = data; } = data;
...@@ -154,6 +158,8 @@ function drawText(data: INodeData, ctx: CanvasRenderingContext2D) { ...@@ -154,6 +158,8 @@ function drawText(data: INodeData, ctx: CanvasRenderingContext2D) {
font += " Arial";//字体没有 font += " Arial";//字体没有
//font-weight:bold;font-style:italic; //font-weight:bold;font-style:italic;
if (fontWeight) font = fontWeight + " " + font; if (fontWeight) font = fontWeight + " " + font;
if (fontStyle) font = fontStyle + " " + font;
ctx.font = font; ctx.font = font;
ctx.textBaseline = "top"; ctx.textBaseline = "top";
ctx.fillStyle = color; ctx.fillStyle = color;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment