echarts legend图例的border-radius

Echarts图例的border-radius可以通过legend.itemStyle.borderRadius属性来设置，例如：

legend: {
    itemStyle: {
        borderRadius: 5
    }
}

这样就可以将图例的边框设置为圆角矩形。

相关问题

echarts自定义legend怎么保留左侧的icon

要保留左侧的icon，需要在自定义legend时，添加一个图标元素。具体操作如下：

1. 在legend.data中添加一个空的图标元素，如下所示：

legend: {
    data: [
        {
            name: '',
            icon: 'circle',
            textStyle: {
                color: '#333',
                fontSize: 14
            }
        },
        {
            name: '图例1',
            icon: 'rect',
            textStyle: {
                color: '#333',
                fontSize: 14
            }
        },
        {
            name: '图例2',
            icon: 'triangle',
            textStyle: {
                color: '#333',
                fontSize: 14
            }
        }
    ]
}

2. 在tooltip.formatter中将空的图标元素替换为实际需要显示的图标，如下所示：

tooltip: {
    formatter: function(params) {
        var content = '';
        if (params.length > 0) {
            content += params[0].name + '<br/>';
            for (var i = 0; i < params.length; i++) {
                var icon = '';
                if (params[i].seriesName === '') {
                    icon = '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:#fff;border:1px solid #ccc;"></span>';
                } else {
                    icon = params[i].marker;
                }
                content += icon + params[i].seriesName + ': ' + params[i].value + '<br/>';
            }
        }
        return content;
    }
}

这样就可以保留左侧的icon，并且在tooltip中也能正确显示每个图例的图标。

echarts的legend 将图形与文字叠在一起

要将图形和文字叠在一起，可以使用 echarts 的 `formatter` 属性。可以在 `legend` 中设置 `formatter` 属性来自定义图例的显示内容。

例如，以下代码可以将图例的文字和相应的图形叠在一起：

legend: {
    data: ['图例1', '图例2', '图例3'],
    formatter: function (name) {
        return '<span style="display:inline-block;width:12px;height:12px;border-radius:50%;background-color:' 
               + colorList[this.indexOfName(name)] + ';margin-right:5px;"></span>' + name;
    }
},

在上面的代码中，`formatter` 属性是一个函数，它返回一个 HTML 字符串。这个字符串包含一个 `<span>` 元素和图例的名称。`<span>` 元素中的样式指定了图例的图形，例如圆形或方块，并将其与图例的名称分隔开。`colorList` 是一个包含图例颜色的数组，可以通过 `indexOfName` 方法获取当前图例的索引。