Javascript 发光球体-d3正交投影无法使css工作

我试图结合这两个d3示例：

我有一个球体，投影显示正确，缩放功能正常。我现在想做的就是设计它的风格

我以前使用过world tour示例，它使用画布，我能够给它一个阴影来创建我非常喜欢的发光效果

在合并了这两个代码之后，我现在使用的是svg元素，而我似乎无法让发光效果发挥作用

下面是我的代码（.globe类的fill属性似乎正在工作）：

身体{
背景：#000000；
}
.背景{
填充：无；
指针事件：全部；
}
.特征{
填充：#ccc；
光标：指针；
}
.feature.active{
填充：#00FF15；
}
地球
{
填充：#fff；
strokeStyle:#35C441；
线宽：5；
阴影颜色：#35C441；
阴影模糊：40；
shadowOffsetX:0；
shadowoffset:0；
}
.网格{
填充：无；
冲程：#fff；
笔划线头：圆形；
笔划线条连接：圆形；
}
可变宽度=960，
高度=720；
活动=d3。选择（空）；
var globe={type:“Sphere”}；
var projection=d3.geo.orthographic（）
.比例尺（高度/2.1）
.translate（[宽度/2，高度/2]）
clipAngle先生（90）
.精度（.5）；
var svg=d3.选择（“正文”）.追加（“svg”）
.attr（“宽度”，宽度）
.attr（“高度”，高度）；
//将rectange追加到svg元素。给它一个背景css样式类。
//单击“是否重置？”？
svg.append（“rect”）
.attr（“类别”、“背景”）
.attr（“宽度”，宽度）
.attr（“高度”，高度）
。打开（“单击”，重置）；
//将“g”附加到svg元素
var g=svg.append（“g”）
.样式（“笔划宽度”、“1.5px”）；
var path=d3.geo.path（）
.投影（投影）
d3.json（“./world-110m.json”），函数（错误，world）{
g、 附加（“路径”）
.基准面（全球）
.attr（“类”、“全球”）
.attr（“d”，路径）；
g、 选择全部（“路径”）
.data（topojson.feature（world，world.objects.countries.features）
.enter（）.append（“路径”）
.attr（“d”，路径）
.attr（“类”、“特征”）
。开启（“点击”，点击）；
g、 附加（“路径”）
.datum（topojson.mesh（world，world.objects.countries，函数（a，b）{返回a！==b；}））
.attr（“类”、“网格”）
.attr（“d”，路径）；
});
单击函数（d）{
if（active.node（）==此）返回reset（）；
活动。分类（“活动”，假）；
active=d3.选择（this）.classed（“active”，true）；
变量边界=路径边界（d），
dx=边界[1][0]-边界[0][0]，
dy=边界[1][1]-边界[0][1]，
x=（界限[0][0]+界限[1][0]）/2，
y=（界限[0][1]+界限[1][1]）/2，
比例=.9/数学最大值（dx/宽度，dy/高度），
平移=[宽度/2-比例*x，高度/2-比例*y]；
g、 过渡（）
.持续时间（750）
.样式（“笔划宽度”，1.5/刻度+“px”）
.attr（“变换”、“平移”（+translate+））比例（+scale+））；
}
函数重置（）{
活动。分类（“活动”，假）；
活动=d3。选择（空）；
g、 过渡（）
.持续时间（750）
.样式（“笔划宽度”、“1.5px”）
.attr（“transform”，简称“）；
}

如果有人能帮上忙，那就太好了，或者如果答案已经存在，你能给我指出正确的方向吗

---

谢谢

如果你能附上一张你想要的效果图片，那会有帮助的

也就是说，您的CSS对SVG元素无效：

前两个具有相应的样式：

.globe {
   fill:#fff;
   stroke: #35C441; 
   stroke-width: 5; 
}

阴影，虽然

.globe {
   fill:#fff;
   stroke: #35C441; 
   stroke-width: 5; 
}