Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug] node服务端渲染时,设置textBaseline为middle不生效 #3353

Open
splier opened this issue Jan 24, 2025 · 0 comments
Open

[Bug] node服务端渲染时,设置textBaseline为middle不生效 #3353

splier opened this issue Jan 24, 2025 · 0 comments
Assignees
Labels
bug Something isn't working

Comments

@splier
Copy link

splier commented Jan 24, 2025

Version

1.15.1

Link to Minimal Reproduction

.

Steps to Reproduce

const VTable = require('@visactor/vtable');
const canvas = require('canvas');
const {Resvg} = require('@resvg/resvg-js');

const records = [
  {
    name: '张三'
  },
]
const columns = [
  {
    field: 'name',
    title: '姓名',
    width: 200,
    style: {
      textBaseline: 'middle',
    },
  }
]
const option = {
  records,
  columns,
  defaultRowHeight: 100,
  defaultHeaderRowHeight: 100,
  // 声明使用的渲染环境以及传染对应的渲染环境参数
  pixelRatio: 2, // dpr
  mode: 'node',
  modeParams: {
    createCanvas: canvas.createCanvas,
    createImageData: canvas.createImageData,
    loadImage: canvas.loadImage,
    Resvg: Resvg // for svg
  },
  canvasWidth: 5000,
  canvasHeight: 5000
};
const tableInstance = new VTable.ListTable(option);


// 导出图片
const buffer = tableInstance.getImageBuffer();
fs.writeFileSync(`导出.png`, buffer);

Current Behavior

Image
文字没有垂直居中

Expected Behavior

Image
应该和浏览器渲染的一致

Environment

- OS: Apple M3 Pro 14.4 (23E214)
- node: v23.6.1
- canvas: ^3.1.0

Any additional comments?

No response

@splier splier added the bug Something isn't working label Jan 24, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants