可以使用javascript(而不是python)api绘制多个曲面图吗?

时间:2015-12-06 20:45:01

标签: plotly

任何人都知道是否有办法做多表面图表(如果是这样,如何),例如https://plot.ly/python/3d-surface-plots/显示的底部图表,但使用javascript plot.ly api而不是python一个?

2 个答案:

答案 0 :(得分:2)

要重现您在阴谋云上看到的任何图表图表,请将.js附加到图表的网址:

e.g。 https://plot.ly/~PlotBot/685.js

答案 1 :(得分:1)

此Codepen:

http://codepen.io/plotly/pen/GogNjj

应该有帮助。

HTML代码:

<html>
<head>
<script src="http://cdn.plot.ly/plotly-latest.min.js"></script>
</head>
<body>
<!-- Plotly chart will be drawn inside this DIV -->
<div id="example"></div>
<script>

z1 = [
    [8.83,8.89,8.81,8.87,8.9,8.87],
    [8.89,8.94,8.85,8.94,8.96,8.92],
    [8.84,8.9,8.82,8.92,8.93,8.91],
    [8.79,8.85,8.79,8.9,8.94,8.92],
    [8.79,8.88,8.81,8.9,8.95,8.92],
    [8.8,8.82,8.78,8.91,8.94,8.92],
    [8.75,8.78,8.77,8.91,8.95,8.92],
    [8.8,8.8,8.77,8.91,8.95,8.94],
    [8.74,8.81,8.76,8.93,8.98,8.99],
    [8.89,8.99,8.92,9.1,9.13,9.11],
    [8.97,8.97,8.91,9.09,9.11,9.11],
    [9.04,9.08,9.05,9.25,9.28,9.27],
    [9,9.01,9,9.2,9.23,9.2],
    [8.99,8.99,8.98,9.18,9.2,9.19],
    [8.93,8.97,8.97,9.18,9.2,9.18]
];

z2 = [];
for (var i=0;i<z1.length;i++ ) { 
    z2_row = [];
    for(var j=0;j<z1[i].length;j++) { 
        z2_row.push(z1[i][j]+1);
    }
    z2.push(z2_row);
}

z3 = []
for (var i=0;i<z1.length;i++ ) { 
    z3_row = [];
    for(var j=0;j<z1[i].length;j++) { 
        z3_row.push(z1[i][j]-1);
    }
    z3.push(z3_row);
}
var data_z1 = {z: z1, type: 'surface'};
var data_z2 = {z: z2, showscale: false, opacity:0.9, type: 'surface'};
var data_z3 = {z: z3, showscale: false, opacity:0.9, type: 'surface'};



Plotly.newPlot('example', [data_z1, data_z2, data_z3]);
 </script>

</body>
</html>