Javascript 如何通过元素不透明度超过组不透明度？_Javascript_Html_Svg_Dom

Javascript 如何通过元素不透明度超过组不透明度？

javascript html svg dom

Javascript 如何通过元素不透明度超过组不透明度？,javascript,html,svg,dom,Javascript,Html,Svg,Dom,您知道如何在元素级别覆盖组级别的不透明度吗？例如，我希望下面的代码将矩形不透明度设置为1，但它仍然为0.5 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> </head> <body> <script src="https://d3js.org/d3.v6.min.js&qu

您知道如何在元素级别覆盖组级别的不透明度吗？例如，我希望下面的代码将矩形不透明度设置为1，但它仍然为0.5

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
</head>
<body>

    <script src="https://d3js.org/d3.v6.min.js"></script>

    <script>
        let svg = d3.select("body").append("svg")
        let group= svg.append("g").attr("opacity", 0.5) // group level
        group.append("rect")
            .attr("height", 50)
            .attr("width", 50)
            .attr("opacity", 1) // element level
    </script>

</body>
</html>


让svg=d3.选择（“body”）.追加（“svg”）
让group=svg.append（“g”）.attr（“不透明度”，0.5）//组级别
组。追加（“rect”）
.attr（“高度”，50）
.attr（“宽度”，50）
.attr（“不透明度”，1）//元素级别

但是如果我交换0.5和1，它工作得很好

如果父对象的不透明度为.5，则子对象的不透明度将相对于父对象的不透明度。例如，如果孩子的不透明度是.5，结果将是.25（家长不透明度的一半）。好的，明白了。你能告诉我如何在子级将绝对不透明度恢复为1吗？好的，我想没有办法。我可以确认没有办法做你想做的事。