您的代码中有一些无法使用的东西,让我们先来看看:
-
首先,在您的createCanvas(400, 400``enter code here``); 行中,您有一个语法错误,您需要删除enter code here 字符串。
-
然后在您的max_min() 函数中,您迭代所有总线并获得bus[i].geometry.coordinate。我的理解是这是一个包含公交车经纬度的数组,所以在这个数组上使用Math.max会返回当前公交车经纬度之间的最大值,这不是你想要的。
您有多种选择来做您想做的事。如果你真的想使用Math.max()和Math.min()并且熟悉map你可以:
- 构建一个包含所有纬度的数组:
bus.map(b => b.geometry.coordinates[0]),即取出bus 数组中的所有项并将其转换为一个数组,其中只有每个总线的geometry.coordinates 属性的第一项。 (将[0] 替换为[1] 以获得经度)
- 使用
... 运算符解构它,因为 Math.max() 不采用数组而是参数列表
- 并将其分配给一个值,您的函数将如下所示:
function max_min() {
const maxLat = Math.max(...bus.map(b => b.geometry.coordinates[0]));
const minLat = Math.min(...bus.map(b => b.geometry.coordinates[0]));
const maxLong = Math.max(...bus.map(b => b.geometry.coordinates[1]));
const minLong = Math.min(...bus.map(b => b.geometry.coordinates[1]));
return { maxLat, minLat, maxLong, minLong };
}
这里的代码很短,但是您在 bus 数组上迭代了 4 次,这并不是特别有效。因此,您还可以采用另一种方法,创建一个简短的辅助函数来获取公共汽车的纬度和经度:
// Given a feature return its latitude and longitude in an object
function getLatLong(feature) {
const [lat, long] = feature.geometry.coordinates;
return { lat, long };
}
然后遍历所有总线,并根据这些信息更新最小值和最大值,如下所示:
// Find the max and min longitude and latitude and return them in an object
function max_min() {
// Use the first feature of the list to initialize the max and min values
const { lat: firstLat, long: firstLong } = getLatLong(bus[0]);
let maxLat = firstLat;
let minLat = firstLat;
let maxLong = firstLong;
let minLong = firstLong;
// Iterate through all the features to update the max and min values
for (let i = 1; i < bus.length; i++) {
const { lat, long } = getLatLong(bus[i]);
if (lat > maxLat) {
maxLat = lat;
}
if (lat < minLat) {
minLat = lat;
}
if (long > maxLong) {
maxLong = long;
}
if (long < minLong) {
minLong = long;
}
}
// Return the updated max and min values
return { maxLat, minLat, maxLong, minLong };
}
最后在draw()你可以对它们做任何你想做的事情,例如我只在画布上写它们:
function draw() {
background(220);
// Get the max and min values with our helper function
const { maxLat, minLat, maxLong, minLong } = max_min();
// Show the values
text(`max lat ${maxLat}`, 0, 10);
text(`min lat ${minLat}`, 0, 30);
text(`max long ${maxLong}`, 0, 50);
text(`min long ${minLong}`, 0, 70);
}
我创建了 this codepen 并使用了完整的代码,以便您了解各个部分是如何协同工作的。