改变 <svg> 对象路径的笔画不透明度答案

【问题标题】：changing stroke-opacity of <svg> object's path改变 <svg> 对象路径的笔画不透明度
【发布时间】：2013-12-08 03:39:40
【问题描述】：

简而言之 - 我试图通过将鼠标悬停在左侧的一个标题上来更改路径的笔画不透明度（您会看到“presidio”标题有一个链接）到目前为止，我看到的所有 JQuery/javascript 答案都不起作用。

我试过的最新sn-p是：

d3.select('.presidio').on('mouseover', function(){
  console.log('hey!');
  var object = document.getElementById("presidio");
  object.setAttribute("stroke-opacity", 1);
});

svg 很大，因此将其粘贴到此处需要一百万年的时间才能阅读。但如果你想在这里检查 svg 元素：http://www.petegetscreative.com/hoods/hoods.html

【问题讨论】：

标签： javascript jquery svg d3.js

【解决方案1】：

改变id为'presidio的元素的不透明度：

d3.select('#presidio').style("stroke-opacity", "1");

为所有具有“presidio”类的元素添加鼠标悬停效果

d3.selectAll('.presidio').on('mouseover', function(){
  d3.select(this).style("stroke-opacity", "1"); })

【讨论】：

我实际上在您回答这个问题时找到了一个非常相似的解决方案：p 我通过在 mouseover 函数中执行此操作来做到这一点：$('#mySVG').find("path.port ").css('stroke-opacity', "1");

【解决方案2】：

我没有测试过，但是你试过吗：

object.setAttribute("stroke-opacity", "1");

我认为引号是正确的语法。

【讨论】：

我很确定你可以使用任何一种引用类型，只要它是一致的，无论哪种方式它都显示为 TypeError: 'null' is not an object (evalating 'object.setAttribute') in the安慰。但我认为，在 1 周围没有引号是一个语法错误。
再说一次，我只是想看看这个小小的改动是否能解决您的问题。

【解决方案3】：

我已经测试过了...

object.style['stroke-opacity'] = 1;

【讨论】：