我想出的解决方案是在iframe中使用vis.js实例。 这显示了笔记本中的交互式3D图,该图仍可在nbviewer中使用。 visjs代码是从3D图形页面上的示例代码中借用的
一个小笔记本来说明这一点:演示
代码本身:
from IPython.core.display import display, HTML
import json
def plot3D(X, Y, Z, height=600, xlabel = "X", ylabel = "Y", zlabel = "Z", initialCamera = None):
options = {
"width": "100%",
"style": "surface",
"showPerspective": True,
"showGrid": True,
"showShadow": False,
"keepAspectRatio": True,
"height": str(height) + "px"
}
if initialCamera:
options["cameraPosition"] = initialCamera
data = [ {"x": X[y,x], "y": Y[y,x], "z": Z[y,x]} for y in range(X.shape[0]) for x in range(X.shape[1]) ]
visCode = r"""
var data = new vis.DataSet();
data.add(""" + json.dumps(data) + """);
var options = """ + json.dumps(options) + """;
var container = document.getElementById("visualization");
var graph3d = new vis.Graph3d(container, data, options);
graph3d.on("cameraPositionChange", function(evt)
{
elem = document.getElementById("pos");
elem.innerHTML = "H: " + evt.horizontal + "
V: " + evt.vertical + "
D: " + evt.distance;
});
"""
htmlCode = " "
display(HTML(htmlCode))