在mhtml5 svg中绘制球体

我想在html5中画一个气泡（实际上有很多气泡，但让我们先来画一个），我想使用svg，因为我想缩放气泡，不需要对它们进行纹理处理，所以svg是这里更好的选择

但是我没有发现任何关于在纯html5和javascript中使用svg创建球体的事情，我发现的主要是针对canvas-like-question或webgl-like，这两者都是基于光栅的，基于矢量的更适合我

---

有办法做到这一点吗？还是我一直在用圆圈来代替呢？

不幸的是，这有点晚了，但我希望它能帮助人们寻找类似的东西。您找不到独立的解决方案（或者您必须编写自己的javascript实现来处理创建球体所需的所有数学运算），但您可以使用library并使用.geo（geometry）extension（默认附带）一个很好的示例如下：

var-width=500，height=width，
投射,路径,，
svg、特征、分划；
投影=d3.geo.orthographic（）
.translate（[宽度/2，高度/2]）
.比例尺（250）
clipAngle先生（90）
.精度（0.1）
.旋转（[0，-30]）；
path=d3.geo.path（）
.投影（投影）；
svg=d3。选择（“.globe”）
.append（'svg'）
.attr（'width'，width）
.attr（'height'，height）
.attr（'viewBox'，'0,0'，+宽度+'，'高度）；
features=svg.append（'g'）；
features.append（'path'））
.datum（{type:'Sphere'}）
.attr（'class'，'background'）
.attr（'d'，路径）；
分划=d3.geo.gracile（）；
features.append（'path'））
.基准面（分划）
.attr（'类'，'分划'）
.attr（'d'，路径）
svg{
宽度：100%
}
路径{
填充：无；
笔画：黑色
}
.背景{
填充：rgba（200212220.5）；
笔划宽度：.8px；
笔画：黑色；
}
.分划{
行程：rgba（0,0,0,2）；
笔划宽度：.5px；
}
.国家{
光标：指针；
}
.country.land、.state.land{
填充物：白色；
行程：rgba（0,0,0,2）；
笔画宽度3倍；
}
.州.覆盖{
填充：蓝色；
填充不透明度：0；
}
.国家，覆盖{
填充物：橙色；
填充不透明度：0；
}

看起来像球体的圆能工作吗？我失败了，这是我最好的尝试，绝对不正确@adambuchantransmisth它一定看起来像个气泡，我不知道这是否可能。你提供的链接有点完美（我会控制颜色使它看起来像一个气泡），但是没有任何3D内置html5吗？“难道没有一个“z”？@adambuchanemissh——如此简单，却又有效。我希望你能把它作为一个答案，也许有一个小的解释和一个片段，这样我就可以投票了。这当然对我有帮助。