echarts漏斗图实例以及参数分析，详细数据注释

最新推荐文章于 2026-03-27 09:55:19 发布

原创

最新推荐文章于 2026-03-27 09:55:19 发布 · 4.6k 阅读

标签

#js #echarts

收录于

本文通过一个具体的Echarts漏斗图实例，详细解析了如何通过设置minSize和maxSize参数来控制漏斗形状，避免形成倒三角形。通过调整这两个参数的值，可以实现漏斗图样式的个性化定制。

// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
var option;
option = {
   
   
    // title: {
   
   
    // 	text: '漏斗图',
    // 	subtext: '纯属虚构'
    // },
    color: [ '#f79f6f','#f25e49','#16dcb7','#4098ff'],
    tooltip: {
   
    //弹窗信息
        trigger: 'item',
        formatter: "{a} <br/>{b} : {d}%"
    },
    legend: {
   
     //图例组件。
        data: [
            {
   
   
                name: '项目推广期',
                icon: 'image://../../images/crmAnalysis/icon1.png' //图例组件的icon图片
            },