Javascript 如何缩放一组圆,使它们在整个缩放过程中保持可见?
无论是数学还是描述我的问题,我都在苦苦挣扎,所以我将保留大量的图片来帮助可视化。我一直在极坐标图上绘制素数,以演示出现的模式。 对于任何不熟悉的人来说,它看起来是这样的 我一直面临的问题是,最终这些圆变得太小,以至于看不见。我使用的代码如下所示:Javascript 如何缩放一组圆,使它们在整个缩放过程中保持可见?,javascript,p5.js,Javascript,P5.js,无论是数学还是描述我的问题,我都在苦苦挣扎,所以我将保留大量的图片来帮助可视化。我一直在极坐标图上绘制素数,以演示出现的模式。 对于任何不熟悉的人来说,它看起来是这样的 我一直面临的问题是,最终这些圆变得太小,以至于看不见。我使用的代码如下所示: let radius; let theta; let toCalc = 50000 let primes; let size = 1; function setup() { createCanvas(800,800); primes = g
let radius;
let theta;
let toCalc = 50000
let primes;
let size = 1;
function setup() {
createCanvas(800,800);
primes = getPrimes(toCalc);
//put origin point in center
r = height * 0.45;
theta = 0;
noStroke();
color(255,255,255)
scale(0.01)
}
function draw() {
translate(width / 2, height / 2);
background(10);
scale(size);
//the for loop takes forever to fully create all of the circles, so it takes a really long time //to fully generate so i might leave it overnight sometime
for(var i = 0; i < toCalc; i++)
{
current = primes[i];
let x = current * cos(current);
let y = current * sin(current);
//the horrific (5/exp(size)*2) is something i threw together to get exponential scaling
//with the zoom at roughly the right level
circle(x, y, (5/exp(size))*3)
}
console.log(size)
}
function getPrimes(max) {
//i timed this code and apparently its actually really really performant,
//even up to a million primes. its the for loop that really kills performance.
var sieve = [], i, j, primes = [];
for (i = 2; i <= max; ++i) {
if (!sieve[i]) {
// i has not been marked -- it is prime
primes.push(i);
for (j = i << 1; j <= max; j += i) {
sieve[j] = true;
}
}
}
return primes;
}
//measuring mousewheel for zoom
function mouseWheel(event) {
//ternary to check if it was a scrolldown or scrollup
//have to make zoom out by size/10 because size is represented by a value from 0 to 1
event.delta >= 0 ? size-=size/10 : size+=size/10
//returning false to block page scrolling
return false;
}
let半径;
让θ;
让toCalc=50000
设素数;
设大小为1;
函数设置(){
createCanvas(800800);
素数=getPrimes(toCalc);
//把原点放在中心
r=高度*0.45;
θ=0;
仰泳();
颜色(255255)
比例(0.01)
}
函数绘图(){
平移(宽度/2,高度/2);
背景(10);
规模(大小);
//for循环要花很长时间才能完全创建所有的圆,所以需要很长的时间//才能完全生成,所以我可能会在某个时候把它留到晚上
对于(变量i=0;i 对于(i=2;我只是一个评论……作为一个长期使用canvas进行图形处理的人,最近的一个发现是SVG在很多方面都有优势。在您的情况下,即使半径变得任意小,您仍然可以看到圆(它也有可能看起来更好)值得一看。我一定会考虑这个问题,我只是在使用P5的任务来完成这个任务。