VChart icon indicating copy to clipboard operation
VChart copied to clipboard

[Bug] Node环境下,形状词云未按预期渲染展示

Open nangge opened this issue 7 months ago • 0 comments

Version

1.11.6

Link to Minimal Reproduction

1

Steps to Reproduce

const spec = { type: 'wordCloud', maskShape: https://lf9-dp-fe-cms-tos.byteorg.com/obj/bit-cloud/log.jpeg`,

nameField: 'challenge_name',
valueField: 'sum_count',
seriesField: 'challenge_name',
wordCloudConfig: {
 layoutMode: 'grid'
},
data: [
  {
    name: 'data',
    values: []
  }
]

}; const cs = new VChart.default(spec, { // 声明使用的渲染环境以及传染对应的渲染环境参数 mode: 'node', modeParams: Canvas, animation: false // 关闭动画 });

cs.renderSync();

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

Current Behavior

1, maskShape 使用内置形状时,未按预期渲染;生成的词云是不规则形状 2,maskShape使用图片链接时,生成的图片为空白

Expected Behavior

官方人员协助下部分得到解决: 问题1:VChart在非浏览器环境下,layoutMode固定位fast,造成词云形状渲染失败 问题2:图片为异步获取,因此,获取图片时需要加个定时器 setTimeout(() => { const buffer = cs.getImageBuffer(); fs.writeFileSync(chart062803.png, buffer); },10000)

Environment

Node环境

Any additional comments?

希望优化相关代码

nangge avatar Jul 04 '24 05:07 nangge