web数据可视化（ECharts版）第四章实训漏斗图

Web数据可视化（ECharts版本）的第四章实训通常会涉及如何创建和定制漏斗图。漏斗图是一种图表类型，常用于展示各个步骤之间的转化率，比如销售流程中顾客从浏览到购买的环节分布。在ECharts中，你可以按照以下步骤制作漏斗图：

1. **引入ECharts库**：首先需要在HTML文件中引入ECharts的JavaScript库。

<script src="https://cdn.jsdelivr.net/npm/echarts@5.2.2/dist/echarts.min.js"></script>

2. **初始化图表**：创建一个`<div>`元素，并设置其宽度和高度，然后通过ECharts实例化一个图表对象。

var myChart = echarts.init(document.getElementById('main'));

3. **配置数据**：准备包含各个步骤及其对应值的数据，例如：

var data = [
    { name: '浏览', value: 1000 },
    { name: '咨询', value: 800 },
    { name: '下单', value: 600 },
    { name: '支付', value: 400 }
];

4. **创建漏斗图**：使用`setOption`方法，传入配置项，包括图形类型、数据、标题等。

myChart.setOption({
    type: 'funnel',
    data: data,
    label: {
        normal: {
            position: 'top'
        }
    },
    title: {
        text: '用户购物流程漏斗图'
    }
});

5. **显示图表**：最后调用`render`方法将图表绘制到指定的容器中。

myChart.render();