如何使用HTML,CSS和/或Javascript显示校样树?

我希望在网页中以自然演绎的方式显示证明树.
我将从JSON文件中获取数据.

什么是显示这样的东西的最佳方式?
它只能用css吗?
或者有一个库可以做这样的事情吗?
渲染为图像是不可能的,因为最终它应该是交互式的.
我还应该提到这棵树可以变得相当大.

例:

更新:最终结果的最佳示例:

解决方法:

最简单的解决方案是mathjax这是一个乳胶javascript渲染器.还有很多其他类似的渲染选项.

或者你也可以看看MathML,它是写数学方程式的w3c标准.可悲的是,现在,对它的支持非常缺乏,如here所示,但从长远来看,这将是一个很好的解决方案.此外,前面提到的MathJax可以在不支持MathML的浏览器中用作MathML shim.

MathJax shim的唯一问题是,当你使它成为交互式时,它将与你支持MathML的浏览器中的代码进行不同的交互,但尽管如此我会亲自建议MathML,除非你已经被绑定到胶乳.

根据您的更新,我不确定这是否可以用MathML或LaTeX表达,我担心您唯一可以做的就是在画布上绘制它或者如果您以后需要交互性而将其设置在SVG中.但是我可以警告你,如果你不习惯,那就不会是一件简单的事.

要向Mathjax添加交互性:

>使用MathML作为输入
>使用HTML / CSS作为输出
>通过向您的核心MathJax配置添加showMathMenu:false来禁用MathJax上下文菜单
>在您的MathML标记中包含id(字面上< mo id =“someid”>例如)
>使用例如jQuery在MathJax完成后绑定到id(即$(“#someid”).on(“mousemove”,function(){…}))

可以在here找到完全正常工作的演示,移动等号以触发警报.

上一篇:Lytro发布光场影片,让你感受真正的沉浸式视频体验


下一篇:cpython做什么来帮助检测对象周期(引用计数)?