老板要我做一个这样的
试过echarts,但是echarts有漏斗图但是没有3d的或者做不出来相对应的效果
有没有同僚们有做过类似的前端3D漏斗图?麻烦推荐一下可以做到的技术,或者给我一个技术帖子的地址,可以运行的代码或者dome都行
具体思路就是用EChart的 type: 'pictorialBar', 然后设置了一些参数实现的
那四个圆台状的东东我是用PPT作出来的,改了下颜色然后生成的图片,图片要是png格式的,然后代码里记得改图片路径
option = {
grid: {
// containLabel: true,
left: '10%',
top: "19%",
bottom: "15%",
},
xAxis: {
show: false,
data: [
'1',
'2',
'3',
'4'
],
},
yAxis: {
show: false,
},
series: [{
type: 'pictorialBar',
data: [{
z: 100,
value: 100,
symbolSize: ['335%', '33%'],
symbolPosition: 'center',
symbolOffset: ['70%', '-70%'],
symbol: "第一张图片路径"
}, {
z: 90,
value: 80,
symbolSize: ['240%', '33%'],
symbolPosition: 'center',
symbolOffset: ['36%', '-30%'],
symbol: "第二张图片路径"
}, {
z: 80,
value: 60,
symbolSize: ['175%', '33%'],
symbolPosition: 'center',
symbolOffset: ['-34%', '10%'],
symbol: "第三张图片路径"
}, {
z: 70,
value: 40,
symbolSize: ['125%', '33%'],
symbolPosition: 'center',
symbolOffset: ['-164%', '45%'],
symbol: "第四张图片路径"
}]
}]
}
https://github.com/jakezatecky/d3-funnel
d3-funnel
heightecharts 有个3d的 应该也可以 设置分开吧 echarts 可以设置分开 它应该也可以
https://www.isqqw.com/echartsdetail?id=16588