drawTextShape 列头怎么画两个不同样式的文字呢，大家有什么思路么

[Chasen-Zhang]

drawTextShape 列头怎么画两个不同样式的文字呢，大家有什么思路么， 比如说前面的字体小一号，颜色红色。后一个字体大一号，颜色蓝色

[lijinke666]

把文字拆分成两个 shape, 分别绘制, 测量前一个文字 String 的文字宽度, 得到 name 的起始 X 坐标

参考

S2/packages/s2-core/src/cell/base-cell.ts

Line 183 in 2bf686c

protected drawTextShape() {

伪代码如下:

  drawTextShape() {
    // 得到原始文字的坐标样式信息
    const textStyle = this.getTextStyle();
    const position = this.getTextPosition();

    const textA = 'String';
    const textB = 'name';

    const textAStyle = {
      ...textStyle,
      fontSize: 10,
      fill: 'red',
    };

    const textBStyle = {
      ...textStyle,
      fontSize: 20,
      fill: 'blue',
    };
    const textAWidth = measureTextWidth(textA, textAStyle);

    // 绘制 String
    renderText(position.x, position.y, textA);
    // 绘制 name
    renderText(position.x + textAWidth, position.y, textB);
}