Highcharts 在高图中如何在条形图内部放置阴影？

如何将阴影放置在条形图内部，如下图所示的高切图中的方框阴影插入（css）。
多谢各位。祝你今天愉快~

---

您可以使用两个重叠序列，其中一个具有默认的

阴影

属性，并在

加载

事件中将它们转换为几个像素：

Highcharts.chart('container', {
    chart: {
        ...,
        events: {
            load: function() {
                this.series[0].points[0].graphic.attr({
                    translateX: -2
                });

                this.series[1].points[0].graphic.attr({
                    translateX: -2
                });
            }
        }
    },
    ...,
    series: [{
        ...,
        data: [100],
        shadow: {
            color: 'gray',
            opacity: 0.8,
            width: 2
        }
    }, {
        data: [50]
    }]
});

现场演示：

---

API参考：

您可以使用两个重叠序列，其中一个具有默认的

阴影属性，并在
加载
事件中将它们转换为几个像素：

Highcharts.chart('container', {
    chart: {
        ...,
        events: {
            load: function() {
                this.series[0].points[0].graphic.attr({
                    translateX: -2
                });

                this.series[1].points[0].graphic.attr({
                    translateX: -2
                });
            }
        }
    },
    ...,
    series: [{
        ...,
        data: [100],
        shadow: {
            color: 'gray',
            opacity: 0.8,
            width: 2
        }
    }, {
        data: [50]
    }]
});

现场演示：

API参考：
不幸的是，Highcharts没有在核心中实现插入阴影。但是，可以通过向
Highcharts.SVGElement.prototype.shadow
方法添加自定义逻辑来实现。检查下面发布的代码和演示，如果您不清楚，请告诉我

此外，要向具有内部阴影的列添加部分填充，必须创建自定义列元素，并将它们插入到阴影和特定点之间的DOM中

代码：


函数insertAfter（newNode，referenceNode）{
referenceNode.parentNode.insertBefore（newNode，referenceNode.nextSibling）；
}
（职能（H）{
H.SVGElement.prototype.shadow=函数（shadowOptions、group、cutOff）{
var shadows=[]，
i、 shadow，element=this.element，
笔划宽度，阴影宽度，阴影元素不透明度，
//补偿倒转的地块面积
使改变
elemBBox=element.getBBox（），
translateX，
translateY；
如果（！阴影选项）{
这个；
}否则如果（！this.shadows）{
shadowWidth=H.pick（shadowOptions.width，3）；
shadowElementOpacity=（shadowOptions.opacity | | 0.15）/
阴影宽度；
transform=这个。是吗？
“（“+H.pick（shadowOptions.offsetY，1）*-1+”，”+
H.pick（shadowOptions.offsetX，1）*-1+'）'：
“（“+H.pick（shadowOptions.offsetX，1）+”，”+
H.pick（shadowOptions.offsetY，1）+'）；
如果（！shadowOptions.inside）{
对于（i=1；i=1；i--）{
阴影=元素克隆节点（0）；
translateX=i/2-shadowOptions.offsetY；
translateY=i/2-shadowOptions.offsetX；
H.attr（阴影{
笔划：（shadowOptions.color）||
'#000000'),
“笔划不透明度”：shadowElementOpacity*（阴影宽度-i+1），
“笔划宽度”：i，
转换：“translate（“+translateX+”，“+translateY+”）”，
填写：“无”
});
H.css（阴影{
宽度：elemBBox.width-i，
高度：elemBBox.height-i，
});
shadow.setAttribute（'class'，（shadow.getAttribute（'class'）| |“”）+'highcharts shadow'）；
如果（截止）{
H.attr（阴影，“高度”，数学最大值（H.attr（阴影，“高度”）-strokeWidth，0）；
shadow.cutHeight=笔划宽度；
}
国际单项体育联合会（小组）{
group.element.appendChild（阴影）；
}else if（element.parentNode）{
插入符（阴影、元素）；
}
阴影。推（阴影）；
}
}
这个阴影=阴影；
}
归还这个；
};
})（高图）
Highcharts.chart（'容器'{
图表：{
键入：“列”，
倒：是的，
活动：{
render:function（）{
var图表=此，
yAxis=chart.yAxis[0]，
部分填充宽度，
埃伦，
bBox；
if（chart.customElements&&chart.customElements.length）{
chart.customElements.forEach（custElem=>{
custElem.parentNode.removeChild（custElem）；
})
chart.customElements.length=0；
}否则{
chart.customElements=[]；
}
chart.series[0]。points.forEach（point=>{
bBox=point.graphic.getBBox（）；
elem=点.图形.元素.克隆节点（0）；
partialFillWidth=yAxis.toPixels（point.partialFill）；
Highcharts.attr（元素{
填充：point.partialFillColor，
转换：“translate（0），+（bBox.height-（point.partialFill/point.y）*bBox.height）+”
});
css（elem{
高度：（点.partialFill/点.y）*bBox.height
});
插入符（元素、点、图形、元素）；
图表.自定义元素.推送（elem）；
});
}
}
},
标题：{
文本：“分行效率优化”
},
xAxis：{
类别：[
“西雅图总部”，
“旧金山”，
“东京”
]
},
亚克斯：[{
分:0,，
标题：{
文字：“雇员”
}
}, {
标题：{
文本：'利润（百万）'
},
相反：对
}],
图例：{
影子：错
},
工具提示：{
分享：真的
},
打印选项：{
专栏：{
分组：false，
影子：错，
边框宽度：0，
点填充：0，
分组填充：0
}
},
系列：[{
颜色：“#efefef”，
id:'主'，
数据：[{
y:120，
第三部分：100，
partialFillColor:“#bbb”
}, {
y:50，
第三部分：10，
partialFillColor:“#bbb”
}, {
y:70，
第二部分：20，
partialFillColor:“#bbb”
}],
点填充：0.4，
影子：{
颜色：“rgba（0,0,0,0.5）”，
不透明度：0.3，
宽度：5，
抵销额：0，
副职：0，
内部：对
}
}]
});
不幸的是，Highcharts没有在内核中实现插入阴影。但是，可以通过向
Highcharts.SVGElement.prototype.shadow
方法添加自定义逻辑来实现。检查下面发布的代码和演示，如果您不清楚，请告诉我

此外，要向具有内部阴影的列添加部分填充，必须创建自定义列元素，并将它们插入到阴影和特定阴影之间的DOM中