2 lines
1.3 KiB
JavaScript
2 lines
1.3 KiB
JavaScript
import{d as e,r as t,o as i,bw as a,bm as n,c as l,e as d,a0 as r,n as s}from"./index.IG9Kr4U_.js";import{i as o}from"./index.CIO3ELIp.js";const u=["id"],h=e({__name:"FunnelChart",props:{id:{type:String,default:"funnelChart"},className:{type:String,default:""},width:{type:String,default:"200px",required:!0},height:{type:String,default:"200px",required:!0}},setup(e){const h=e,m={title:{show:!0,text:"订单线索转化漏斗图",x:"center",padding:15,textStyle:{fontSize:18,fontStyle:"normal",fontWeight:"bold",color:"#337ecc"}},grid:{left:"2%",right:"2%",bottom:"10%",containLabel:!0},legend:{x:"center",y:"bottom",data:["Show","Click","Visit","Inquiry","Order"]},series:[{name:"Funnel",type:"funnel",left:"20%",top:60,bottom:60,width:"60%",sort:"descending",gap:2,label:{show:!0,position:"inside"},labelLine:{length:10,lineStyle:{width:1,type:"solid"}},itemStyle:{borderColor:"#fff",borderWidth:1},emphasis:{label:{fontSize:20}},data:[{value:60,name:"Visit"},{value:40,name:"Inquiry"},{value:20,name:"Order"},{value:80,name:"Click"},{value:100,name:"Show"}]}]},p=t("");return i(()=>{p.value=a(o(document.getElementById(h.id))),p.value.setOption(m),window.addEventListener("resize",()=>{p.value.resize()})}),n(()=>{p.value&&p.value.resize()}),(t,i)=>(d(),l("div",{id:e.id,class:s(e.className),style:r({height:e.height,width:e.width})},null,14,u))}});export{h as default};
|