[Bug] 服务端渲染图片，折线图数值未展示

[wcccode]

Version

5.5.1

Link to Minimal Reproduction

no

Steps to Reproduce

var echarts = require('echarts'); const { createCanvas } = require('canvas'); const fs = require('fs');

echarts.setCanvasCreator(() => { return createCanvas(800, 600); });

const canvas = createCanvas(800, 600);

let chart = echarts.init(canvas); const data = { "employees": [ { "name": "John Doe", "age": 30, "occupation": "Engineer" }, { "name": "Jane Smith", "age": 28, "occupation": "Designer" } ] };

var option = { title: { text: '10.01-10.15日活每日增长趋势' }, tooltip: {}, legend: { data: ['活跃数'], bottom: '10' }, xAxis: { data: ['2024-10-1', '2024-10-2', '2024-10-3', '2024-10-4', '2024-10-5', '2024-10-6', '2024-10-7', '2024-10-8', '2024-10-9', '2024-10-10', '2024-10-11', '2024-10-12', '2024-10-13', '2024-10-14', '2024-10-15'] }, yAxis: {}, series: [{ name: '活跃数', type: 'line', data: [86, 38, 45, 37, 37, 37, 60, 589, 545, 653, 891, 838, 225, 708, 597], label: { show: true, // 显示每个数据点的标签 position: 'top', // 标签的位置，可以是 'top', 'left', 'right', 'bottom' formatter: '{c}' // 显示数据的值 } }] };

chart.setOption(option);

const buffer = canvas.toBuffer('image/png'); chart.dispose(); chart = null;

fs.writeFileSync('chart.png', buffer);

Current Behavior

折线图未显示数值

Expected Behavior

折线图显示数值

Environment

- OS:
- Browser:
- Framework:

Any additional comments?

测试结果：

[echarts-bot[bot]]

@wcccode It seems you are not using English, I've helped translate the content automatically. To make your issue understood by more people and get helped, we'd like to suggest using English next time. 🤗

TRANSLATED

**TITLE** [Bug] The server renders the image, but the line chart value is not displayed

[sz-p]

Line chart have default animation in symbol and label.

SSR with canvas render not support animation. disable it, the image will be right.

Try animation: false.

All options are below

{
  title: {
    text: "10.01-10.15日活每日增长趋势",
  },
  animation: false,
  tooltip: {},
  legend: {
    data: ["活跃数"],
    bottom: "10",
  },
  xAxis: {
    data: [
      "2024-10-1",
      "2024-10-2",
      "2024-10-3",
      "2024-10-4",
      "2024-10-5",
      "2024-10-6",
      "2024-10-7",
      "2024-10-8",
      "2024-10-9",
      "2024-10-10",
      "2024-10-11",
      "2024-10-12",
      "2024-10-13",
      "2024-10-14",
      "2024-10-15",
    ],
  },
  yAxis: {},
  series: [
    {
      name: "活跃数",
      type: "line",
      data: [
        86, 38, 45, 37, 37, 37, 60, 589, 545, 653, 891, 838, 225, 708, 597,
      ],
      label: {
        show: true, // 显示每个数据点的标签
        position: "top", // 标签的位置，可以是 'top', 'left', 'right', 'bottom'
        formatter: "{c}", // 显示数据的值
      },
    },
  ],
}

[wcccode]

Thanks, it works.