2024年6月1日发(作者：)

echarts formatter rich中position的使用

在 ECharts 中，`formatter` 用于格式化 tooltip、axis label、

series label 等内容，而 `rich` 属性是 formatter 中的一个选

项，用于设置文本样式。`position` 属性在 `rich` 中用于设置文

本的位置。

以下是 `rich` 中 `position` 的使用示例：

tooltip: {

trigger: 'axis',

axisPointer: {

type: 'shadow'

},

formatter: function (params) {

return (function (param) {

return `

center;">

10px; border-radius: 50%; background-color: ${};

margin-right: 5px;">

${Name}:

${}

`;

1 / 2

}).join('');

},

// 使用 rich 属性设置文本样式

textStyle: {

rich: {

// 使用 position 属性设置文本位置

value: {

fontSize: 14,

padding: [0, 0, 0, 5], // 上右下左

position: 'inside' // 可选的值包括

'inside'（默认值）、'left'、'right'、'top'、'bottom' 等

}

}

}

}

在上述示例中，`position` 属性被用于 `rich` 中的 `value`

对象，用于设置显示文本的位置。在这个例子中，`position` 被设

置为 `'inside'`，表示文本将显示在容器的内部。

根据需要，可以调整 `position` 的值以更改文本在容器中的位

置。其他可选值还包括 `'left'`、`'right'`、`'top'`、`'bottom'`

等，根据需求选择最适合的位置。

2 / 2