原子轨道的Plotly.js等值面图

问题描述

我正在尝试使用Plotly中的等值面图来构造原子轨道的图像,但是在代码运行时不会呈现任何图像,并且控制台中不会显示任何错误

有人可以指出我做错了吗,我已经修改了公式和值,没有发现明显的错误

这是其中的代码

<!DOCTYPE html>
<html>
    <head>
        <!-- mwe orbital -->
        <Meta charset="utf-8"> <!--special chars-->
        <script src="https://cdn.plot.ly/plotly-latest.min.js"></script> <!--Plotly-->
        <style>
            body {
                width: 600px;
                margin: auto;
                text-align: justify;
            }

            .title {
                text-align: center; 
                font-weight: bold; 
                font-size: 14pt; 
                margin-top: 2em; 
                margin-bottom: 2em;
                text-indent: 0em;
            }
        </style>
    </head>
    <body>
        <p class="title"><i>3d<sub>z<sup>2</sup></sub></i> Atomic Orbital</p>
        <div id="3d0"></div>
    </body>

    <script>
        // The probability function
        function prob(radius,theta){
            const a = 5.291772106712e-11;
            let p = (1/(6*Math.PI*81**2))*(1/a**3)*(radius**4)*Math.exp(-2*radius/3)*((3*(Math.cos(theta))**2-1)**2)*((radius*a)**2)*Math.sin(theta)*10**(-6)/200;
            return p;
        }
        // number of dots
        const dots=100;
        // inicializes the radius with values ranging from 0 to 5
        let radius=[];
        for (var i = 0; i <= dots ; i++) {
            radius.push(25*i/dots);
        }
        // inicializes theta with values ranging from 0 to pi
        let theta = []
        for (var i = 0; i <= dots/2; i++){
            theta.push(Math.PI*i/dots);
        }
        // inicializes phi with values ranging from 0 to 2pi
        let phi =[]
        for (var i = 0; i <= dots; i++){
            phi.push(2*Math.PI*i/dots);
        }
        // transforms the spherical points in to cartesian ones
        // and calculates the values of probabilities
        // inicializes the variables
        let x_d = [];
        let y_d = [];
        let z_d = [];
        let values_d = [];
        // execute the calculation
        for (var i = 0; i < radius.length; i++) {
            for (var j = 0; j < theta.length; j++) {
                for (var k = 0; k < phi.length; k++) {
                    x_d.push(radius[i]*Math.sin(theta[j])*Math.cos(phi[k]));
                    y_d.push(radius[i]*Math.sin(theta[j])*Math.sin(phi[k]));
                    z_d.push(radius[i]*Math.cos(theta[j]));
                    values_d.push(prob(radius[i],theta[j]));
                }
            }
        }

        // orbital graphing
        let data_3d0 = [
            {
                type: "isosurface",x: x_d,y: y_d,z: z_d,value: values_d,isomin: 0.01,isomax: 1,colorscale: "RdBu"
            }
        ];

        var layout_3d0 = {
            title: '<i>3d<sub><sup>2</sup></sub></i>',xaxis: {
                range: [-5,5]
            },yaxis: {
                range: [-5,zaxis: {
                range: [-5,5]
            }
        };

        Plotly.newPlot('3d0',data_3d0,layout_3d0);
        console.log("Orbital done!");
    </script>

</html>

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)

相关问答

Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其...
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。...
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbc...