要直接在页面中给每个饼图设置标题并显示，你可以使用Echarts的graphic组件来实现。graphic组件允许你在图表上添加自定义的图形元素，包括文本元素。以下是一个示例：
option = {
graphic: [
{
type: 'text',
left: '25%',
top: '50%',
z: 100,
style: {
text: '饼图1',
textAlign: 'center',
fill: '#000',
fontSize: 14
}
},
{
type: 'text',
left: '75%',
top: '50%',
z: 100,
style: {
text: '饼图2',
textAlign: 'center',
fill: '#000',
fontSize: 14
}
}
],
series: [
{
type: 'pie',
radius: '50%',
center: ['25%', '50%'],
data: [
{ value: 335, name: '数据1' },
{ value: 310, name: '数据2' }
]
},
{
type: 'pie',
radius: '50%',
center: ['75%', '50%'],
data: [
{ value: 135, name: '数据3' },
{ value: 110, name: '数据4' }
]
}
]
};
在上述示例中，我们通过graphic组件添加了两个文本元素，分别表示饼图1和饼图2的标题。通过type属性设置元素类型为text，通过left和top属性控制文本元素的位置。style属性用于设置文本元素的样式，包括文本内容、对齐方式、颜色和字体大小。
你可以根据需要设置饼图的数量和对应的标题，并在graphic组件中添加相应的文本元素。确保根据每个饼图的位置和布局来设置left和top属性，以及调整字体大小和对齐方式。
通过如上所示的设置，每个饼图的标题将直接显示在页面中，并与对应的饼图位置相匹配。