VisActor / VisActor/VTable

[Feature] 希望在customRender中可以直接通过table.canvas的上下文直接绘制单元格内容,这样可实现一些复杂逻辑

Open
#3,611 5 comments 0 reactions 1 assignee View on GitHub

@fangsmile is already working on this.

Since Mar 25, 2025.

feature
Dominant language
TypeScript
Stars
3.7k
Forks
486
Avg merge
1d 19h
Merged PRs (30d)
16

Description

What problem does this feature solve?

希望在customRender中可以直接通过table.canvas的上下文直接绘制单元格内容,这样可实现一些复杂逻辑

What does the proposed API look like?
  customRender(args: any) {
    // 希望在customRender中可以直接通过table.canvas的上下文直接绘制单元格内容,这样可实现一些复杂逻辑
    const { table, rect, value } = args;
    const ctx = table.canvas.getContext('2d');

    // 绘制一些东西
    ctx.font = '14px Arial';
    ctx.fillStyle = '#333';
    ctx.textBaseline = 'middle';
    const textWidth = ctx.measureText(value).width;
    const x = rect.left + (rect.width - textWidth) / 2;
    const y = rect.top + rect.height / 2;
    ctx.fillText(value, x, y);
    // 绘制结束
    return true; // 返回 true 表示已自定义渲染,阻止默认渲染
  },

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.