此处映射具有较高 zIndex 的 javascript 透明对象隐藏其下方的其他对象

如何解决此处映射具有较高 zIndex 的 javascript 透明对象隐藏其下方的其他对象

我正在使用 Here maps for javascript v3.1.24.0。

我的用例是在另一条细的可见多段线上有一条宽的透明多段线，这样我就可以让用户更轻松地执行悬停和点击等事件。

然而，zIndex 较高的透明多段线完全隐藏了它下面的多段线。

是否有解决方案或解决方法？

const path = [
  { lat: 51,lng: 10 },{ lat: 51,lng: 20 }
];
const path2 = [
  { lat: 50,lng: 15 },{ lat: 53,lng: 18 }
];
const linestring = new window.H.geo.Linestring();
path.forEach(function (point) {
  linestring.pushPoint(point);
});

const linestring2 = new window.H.geo.Linestring();
path2.forEach(function (point) {
  linestring2.pushPoint(point);
});
const redpolyline = new window.H.map.polyline(linestring2,{
  style: { strokeColor: "red",linewidth: 5 },zIndex: 0
});
const transparentpolyline = new window.H.map.polyline(linestring,{
  style: { strokeColor: "rgba(255,255,0.1)",linewidth: 10 },zIndex: 1
});

JS fiddle 链接：https://jsfiddle.net/sharmakushagra/nabsxez9/19/