從Plotly獲取zaxis範圍3D

Question

我使用JavaScript在Plotly中生成3D散點圖。最初，我沒有指定軸範圍。但是，我想讓用戶在繪圖初始後手動設置zaxis範圍。在那個用戶交互中，我想用現有的（as-drawn）設置來填充範圍值。如何從現有的Plotly scatter3d圖表中提取zaxis範圍？

Plotly.d3.csv('https://raw.githubusercontent.com/plotly/datasets/master/api_docs/mt_bruno_elevation.csv', function(err, rows) { 
 
    function unpack(rows, key) { 
 
    return rows.map(function(row) { 
 
     return row[key]; 
 
    }); 
 
    } 
 

 
    
 
    var data = []; 
 
    
 
    for (i = 0; i < 24; i += 1) { 
 

 
    var x_row = [], 
 
     y_row = [], 
 
     z_row = unpack(rows, i); 
 
    
 
    for (var j = 0; j < z_row.length; j++) { 
 
     x_row.push(i); 
 
     y_row.push(j); 
 
    } 
 
    
 
    data.push({ 
 
     x: x_row, 
 
     y: y_row, 
 
     z: z_row, 
 
     mode: 'lines', 
 
     line: { 
 
     color: '#FF00FF' 
 
     }, 
 
     type: 'scatter3d' 
 
    }); 
 
    } 
 
    
 
    Plotly.newPlot('myDiv', data); 
 

 
    document.getElementById('cmax').innerHTML = 'Max: ' + data[0].cmax; 
 
    document.getElementById('cmin').innerHTML = 'Min: ' + data[0].cmin; 
 
});

<script src="https://cdn.plot.ly/plotly-latest.min.js"></script> 
 
<div id='cmax'></div> 
 
<div id='cmin'></div> 
 
<div id="myDiv"></div>

Answer 1

作爲它的一個scatter3D情節的評論所指出的，解決方案低於適用於3D表面圖。對於scatter3D圖，Plotly根據輸入數組的最小值和最大值計算軸範圍。

sceneBounds[0][i] = Math.min(sceneBounds[0][i], objBounds[0][i]/dataScale[i]); 

從那裏，你可以手動設置範圍的最小值/最大值（+一些額外的空間），或者將範圍爲空，並與最大RESP填充您的默認值。最小值。

---

Plotly設置最大和最小值到cmax RESP。數據對象的cmin傳遞給newPlot函數。

Plotly.d3.csv('https://raw.githubusercontent.com/plotly/datasets/master/api_docs/mt_bruno_elevation.csv', function(err, rows) { 
 
    function unpack(rows, key) { 
 
    return rows.map(function(row) { 
 
     return row[key]; 
 
    }); 
 
    } 
 

 
    var z_data = [] 
 
    for (i = 0; i < 24; i += 1) { 
 
    z_data.push(unpack(rows, i)); 
 
    } 
 

 
    var data = [{ 
 
    z: z_data, 
 
    type: 'surface' 
 
    }]; 
 
    
 
    Plotly.newPlot('myDiv', data); 
 
    
 
    document.getElementById('cmax').innerHTML = 'Max: ' + data[0].cmax; 
 
    document.getElementById('cmin').innerHTML = 'Min: ' + data[0].cmin; 
 
});

<script src="https://cdn.plot.ly/plotly-latest.min.js"></script> 
 
<div id='cmax'></div> 
 
<div id='cmin'></div> 
 
<div id="myDiv"></div>