新建文本文档

59 阅读1分钟

import * as echarts from 'echarts';

export const funnelrData = (datas, savePieImg) => {

console.log(datas, 'datasdatasdatas9999999');
let domId = datas.domID
let contentData = datas.contentData
let xAxisData = datas.xAxisData

let chartDom = document.getElementById(`${domId}`);

var option;

option = {
    // title: {
    //     text: 'Funnel'
    // },
    tooltip: {
        trigger: 'item',
        // formatter: '{a} <br/>{b} : {c}%'
        formatter: '{b} : {c}%',
        show:false
    },

    legend: {
        data: xAxisData,
        show:false
    },
    series: [
        {
            name: 'Expected',
            type: 'funnel',
            left: '0%',
            width: '100%',
            // left: '10%',
            bottom: 0,
            top:0,
            labelLine: {
                show: false
            },
            itemStyle: {
                opacity: 0.1,
                color: '#0F66FA'
            },
            // 这个地方不动
            data: [
                { value: 60, },
                { value: 40, },
                { value: 20, },
                { value: 80, },
                { value: 100, }
            ]
        },
        {
            name: 'Actual',
            type: 'funnel',
            left: '10%',
            width: '80%',
            height:'80%',
            maxSize: '80%',
            top:0,
            label: {
                position: 'inside',
                formatter: '{c}%',
                color: '#fff'
            },
            itemStyle: {
                // opacity: 0.5,
                // borderColor: '#fff',
                borderWidth: 2
            },
            emphasis: {
                label: {
                    position: 'inside',
                    formatter: '{c}%'
                    // formatter: '{b}: {c}%'
                }
            },
            data: contentData,
            // Ensure outer shape will not be over inner shape when hover.
            // z: 100
        }
    ]
};
var myChart = echarts.init(chartDom);
// console.log(savePieImg,'savePieImgsavePieImg');
if (savePieImg == 'savePieImg') {
    savePieImgs(myChart)


}
option && myChart.setOption(option, true);

return option

}

// 是否下载echarts柱形图 var savePieImgs = (countPieDwlx) => { var picInfo = countPieDwlx.getDataURL({ type: 'png', pixelRatio: 1.5, //放大两倍下载,之后压缩到同等大小展示。解决生成图片在移动端模糊问题 backgroundColor: '#fff' });//获取到的是一串base64信息 const elink = document.createElement('a'); elink.download = "统计分析"; elink.style.display = 'none'; elink.href = picInfo; document.body.appendChild(elink); elink.click(); URL.revokeObjectURL(elink.href); // 释放URL 对象 document.body.removeChild(elink) }