<svg viewBox="0 0 200 100" xmlns="http://www.w3.org/2000/svg" id="svg"></svg>
svg {
outline: dashed 1px red;
}
const width = 200; // ширина графика
const max = 1000000;
const divider = max / width;
const data = new Array(width).fill(0);
const sqrtOfMax = Math.sqrt(max);
function getRandomInt(min, max) { // случайное целое в диапазоне
min = Math.ceil(min);
max = Math.floor(max);
return Math.floor(Math.random() * (max - min + 1)) + min;
}
function getX() { // вся магия здесь
const a = getRandomInt(1, sqrtOfMax);
const b = getRandomInt(1, sqrtOfMax);
return a * b;
}
// сгенерируем несколько тысяч чисел
for (let i = 0; i < 5000; i++) {
// округлим, чтобы у столбиков на графике была "ширина"
const rounded = Math.floor(getX() / divider);
data[rounded]++;
}
// console.log(data);
// рисуем столбики на графике
data.forEach(function showLine(n, i) {
const newLine = document.createElementNS('http://www.w3.org/2000/svg','line');
newLine.setAttribute('x1', i);
newLine.setAttribute('x2', i);
newLine.setAttribute('y1', 100);
newLine.setAttribute('y2', 100-n);
newLine.setAttribute("stroke", "black")
svg.appendChild(newLine);
});