Echarts 图表绘制：南丁格尔图和饼图百分比提示功能

要使用Echarts绘制南丁格尔图和设置饼图百分比提示功能，你需要先引入Echarts库，并创建一个包含图表的DOM容器。然后，通过配置项设置图表的样式和数据。\n\n下面是一个简单的示例代码，演示如何使用Echarts绘制南丁格尔图和设置饼图百分比提示功能：\n\nhtml\n<!DOCTYPE html>\n<html>\n<head>\n <meta charset="utf-8">\n <title>Echarts Demo</title>\n <script src="https://cdn.jsdelivr.net/npm/echarts@5.2.2/dist/echarts.min.js"></script>\n</head>\n<body>\n <div id="chart" style="width: 600px; height: 400px;"></div>\n <script>\n // 创建图表的DOM容器\n var chartDom = document.getElementById('chart');\n var myChart = echarts.init(chartDom);\n \n // 设置图表的配置项\n var option = {\n title: {\n text: '南丁格尔图',\n top: 'top',\n left: 'center'\n },\n legend: {\n orient: 'horizontal',\n bottom: 'bottom',\n align: 'center'\n },\n tooltip: {\n trigger: 'item',\n formatter: '{b}: {d}%'\n },\n series: [\n {\n type: 'pie',\n radius: '50%',\n data: [\n {value: 335, name: '数据1'},\n {value: 310, name: '数据2'},\n {value: 234, name: '数据3'},\n {value: 135, name: '数据4'},\n {value: 1548, name: '数据5'}\n ]\n }\n ]\n };\n \n // 使用配置项显示图表\n myChart.setOption(option);\n </script>\n</body>\n</html>\n\n\n在上面的代码中，通过设置title和legend的位置属性，实现了主标题和图例的居中显示。同时，通过设置tooltip的formatter属性，将提示框的显示格式设置为百分比形式。\n\n注意：在使用上述代码之前，你需要将Echarts库的链接替换为最新版本的链接。