写一个通过echarts渲染svg图形当鼠标悬浮在图形上时显示1在无vue渲染时只会显示出svg图形。给出完整代码并附上注释。

以下是一个简单的示例代码，实现了通过echarts渲染svg图形，并在鼠标悬浮在图形上时显示1，同时在无vue渲染时仅显示svg图形。

<!-- html代码 -->
<div id="chart" style="width: 400px; height: 400px;"></div>

// js代码
// 引入echarts库
import echarts from 'echarts';

// 创建echarts实例
const chart = echarts.init(document.getElementById('chart'));

// 定义图形数据
let data = [
  { name: 'A', value: 10 },
  { name: 'B', value: 20 },
  { name: 'C', value: 30 },
];

// 定义鼠标悬浮时的提示框
let tooltip = {
  show: true,
  formatter: () => '1', // 鼠标悬浮时显示1
};

// 定义图形配置项
let option = {
  tooltip: tooltip, // 使用自定义的提示框
  series: [
    {
      type: 'pie',
      data: data,
      itemStyle: {
        normal: {
          // 定义图形样式
          color: '#c23531',
          borderWidth: 1,
          borderColor: '#fff',
        },
      },
    },
  ],
};

// 渲染图形
chart.setOption(option);

以上代码实现了通过echarts渲染svg图形，并在鼠标悬浮时显示1的效果。在无vue渲染时，只会显示出svg图形。需要注意的是，在实际应用中，需要根据具体需求进行更详细的配置和样式调整