我想一次映射一个位置,一次绘制一个圆,而不是整个位置阵列。我不想一次绘制整个位置数组,而是想遍历每个位置,以便它成为一个延时动画。
我尝试过:
在构造函数中创建椭圆;
我能得到的最好的是一次所有的圈子。
var cities;
var lat = 0;
var lng = 0;
var clat = 0;
var clng = 0;
var zoom = 1;
function preload(){
cities = loadStrings('shooting_data.csv');
}
function mercX(lng) {
lng = radians(lng);
var a = (256 / PI) * pow(2, zoom);
var b = lng + PI;
return a * b;
}
function mercY(lat) {
lat = radians(lat);
var a = (256 / PI) * pow(2, zoom);
var b = tan(PI/4 + lat/2);
var c = PI - log(b);
return a * c;
}
function setup() {
createCanvas(1980, 1020);
}
function draw() {
translate(width/2, height/2);
imageMode(CENTER);
frameRate(10);
var x = [];
var y = [];
var d = [];
var cx = mercX(clng);
var cy = mercY(clat);
for (var i = 0; i < cities.length; i++) {
var data = cities[i].split(/,/);
// console.log(data);
var lat = data[1];
var lng = data[2];
var victims = data[3];
victims = pow(5, victims);
victims = sqrt(victims);
var victimsmax = sqrt(pow(5, 5));
var x = [mercX(lng) - cx];
var y = [mercY(lat) - cy];
var d = [map(victims, 1, victimsmax, 10, 100)];
// for (z = 0; z < x.length; z++) {
// console.log(d[0]);
var shotsFired = [lat, lng, victims];
if ( mouseIsPressed == true){
for ( var a = 0; a < x.length; a++){
for( var b = 0; b < y.length; b++){
for ( var c = 0; c < d.length; c++){
fill(255, 0, 0, 1);
stroke(255, 0, 0);
ellipse(x[a], y[b], d[c], d[c])
}
if (mouseIsPressed == false){
noFill();
clear();
}
}
}
}
}
}
答案 0 :(得分:0)
您想要创建一个新变量来跟踪当前绘制圆的索引的声音。然后,您可以随着时间(可能是每帧)更改该索引,以更改绘制的圆。
尝试使用一个更简单的示例来使其工作。您可以创建一个包含3个硬编码位置的数组,并在这些位置之间循环吗?