Plotly.js - 頻度でプロットヒストグラム

Question

Plotly.jsを使用して頻度でヒストグラムを描画するにはどうすればよいですか？

Plotly.jsは、値のセットでヒストグラムを描画するが、頻度の値では描画できないAPIを提供します。

あなたがここにPlotlyヒストグラムについての詳細を見つけることができます - ここでhttps://plot.ly/javascript/histograms/

は一例です：

サンプルセットがある場合は、{2、3、4、5、2、2、2、 3,5}。 Plotlyはこのようにそれをプロット - https://codepen.io/sgsvenkatesh/pen/eEyyMJ

var x = [2, 3, 4, 5, 2, 2, 2, 3, 5]; 

var trace = { 
    x: x, 
    type: 'histogram', 
    }; 
var data = [trace]; 
Plotly.newPlot('myDiv', data); 

しかし、これは私が

x = [2, 3, 4, 5]; 
y = [4, 2, 1, 1]; 

これは0-2の4回、2-3を繰り返して値を2回繰り返し、そうされていることを表していたデータでありますに。

Plotly.jsを使用してこれをプロットするにはどうすればよいですか？

Answer 1

この表現方法を確認してください。

x = [2, 3, 4, 5]; 
 
y = [4, 2, 1, 1]; 
 

 
traces = []; 
 
for (var i = 0; i <= x.length - 1; i++) { 
 
    var yarray = new Array(y[i]).fill(y[i]); 
 
    var trace = {}; 
 
    if (i === 0) { 
 
     trace = { 
 
      x: yarray, 
 
      type: 'histogram', 
 
      name: 0 + " to " + x[i] 
 
     }; 
 
    } else if (i === x.length - 1) { 
 
     trace = { 
 
      x: yarray, 
 
      type: 'histogram', 
 
      name: x[i] + " and above" 
 
     }; 
 
    } else { 
 
     trace = { 
 
      x: yarray, 
 
      type: 'histogram', 
 
      name: x[i - 1] + " to " + x[i] 
 
     }; 
 
    } 
 
    traces.push(trace); 
 
} 
 

 

 
var data = traces; 
 
var layout = {barmode: "group"}; // there are three modes that can be set, "overlay", "stack", "group" 
 
Plotly.newPlot('myDiv', data, layout);

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