Блог

Я пытаюсь нарисовать оранжевые многоточия, но цикл for в нижней части моего кода ничего не рисует. Я знаю, что приведенный ниже код является правильным способом доступа к массивам внутри объектов, потому что я использовал его в другой задаче, и это сработало. Ранее у меня были beginShape (); и endShape (); до и после моего for-цикла, но это тоже не сработало.

Все выглядит правильно, и я не уверен, что я делаю неправильно. Я был бы признателен всем за помощь. Спасибо

 Case 601 - Cross Reference - stage 2

Fry is still on the loose. We think she’s resorted to stealing to get by.
Hopefully we can track her down by cross-referencing sightings and recent thefts in the area.

In the setup function, use a for loop to traverse the sightings, marking all of the locations on the map
where she was last seen. Do this by drawing small, DarkOrange stroke ellipses at each location.

In addition, we've assembled a list of recent thefts in the area. Using another for loop to traverse the
recent crime records, you should mark those locations on the map. Do this by drawing small, Magenta stroke rectangles centered over each location.

Use X11 colours. You can find a reference table at https://en.wikipedia.org/wiki/Web_colors.

For this mission you will need ONLY the following:

- for loop
- stroke
- ellipse()

- stroke
- rect() NB. Draw each rectangle with the point at its center.


*/

var countyMap;

//Sightings of Casey Fry.

var absconder_record = {
    Loc_X: [639, 681, 712, 756, 715, 701, 753, 815, 795, 788, 781, 768, 750, 732, 714, 695, 693, 654, 624, 594, 555],
    Loc_Y: [288, 286, 293, 310, 368, 425, 436, 468, 506, 497, 486, 489, 500, 506, 514, 531, 552, 523, 500, 484, 474],
};

//Recent crime records.

var robbery_record = [ 
  { PointX : 403, PointY : 401},
  { PointX : 402, PointY : 360},
  { PointX : 427, PointY : 403},
  { PointX : 646, PointY : 284},
  { PointX : 639, PointY : 264},
  { PointX : 830, PointY : 434},
  { PointX : 809, PointY : 443},
  { PointX : 844, PointY : 496},
  { PointX : 802, PointY : 350},
  { PointX : 683, PointY : 413},
  { PointX : 552, PointY : 464},
  { PointX : 629, PointY : 498},
  { PointX : 712, PointY : 562},
  { PointX : 783, PointY : 603},
  { PointX : 415, PointY : 225},
  { PointX : 561, PointY : 282},
  { PointX : 562, PointY : 392},
  { PointX : 751, PointY : 283},
  { PointX : 680, PointY : 359},
  { PointX : 626, PointY : 436},
  { PointX : 701, PointY : 455},
  { PointX : 838, PointY : 565},
  { PointX : 322, PointY : 508},
  { PointX : 468, PointY : 556},
  { PointX : 625, PointY : 737} 
];


function preload()
{
    countyMap = loadImage("map.png")
}

function setup()
{
  createCanvas(countyMap.width, countyMap.height);

    image(countyMap, 0,0);

    //add your code below here
    stroke(255, 140, 0);
    
    for(i = 0; i <absconder_record.Loc_X[i].length; i   ){
        ellipse(absconder_record.Loc_X[i], absconder_record.Loc_Y[i], 5)
    }
    
    
    


}  

Вот изображение, на котором он должен отображаться:

Глядя на эту строку:

  for(i = 0; i <absconder_record.Loc_X[i].length; i   ){
  

Я думаю, что вы хотели сделать это:

i <absconder_record.Loc_X.length

i <absconder_record.Loc_X[i].length

• i равно 0
• absconder_record.Loc_X[0] является 639
• 639 не имеет length свойства.

Продолжайте вопрос в комментарии:

как вы выполняете цикл через массив robbery_record?

For цикл принимает 3 выражения:

1. инициализатор, обычно используемый для инициализации счетчика, как в i = 0; . (Это выполняется только один раз, а не на каждой итерации.)
2. условие для проверки. если условие истинно, выполняется тело цикла. наиболее распространенное использование — проверить, превысил ли счетчик некоторый порог, как в i > 10 . если i меньше 10, запустите тело цикла.
3. выражение, которое выполняется после каждой итерации цикла. чаще всего используется для увеличения счетчика: i .

В совокупности это выглядит так:

 for (let i = 0; i < 10; i  ) {
  // body
}
  

1. i начинается со значения 0 .
2. Вычисляется условие: i меньше 10?
3. Если это так, выполняется тело цикла.
4. после выполнения тела выполняется последнее выражение ( i ). Теперь i равен 1.
5. Повторяйте 2-4, пока условие больше не станет истинным (когда i больше не будет меньше 10).

Чтобы использовать цикл for для перебора массива, общий подход заключается в том, чтобы сделать точно так же, как указано выше, но заменить 10 на длину массива. Итак, в вашем случае с robbery_record:

 for (let i = 0; i < robbery_record.length; i  ) {
  // do stuff
}
  

Обычно, когда кто-то делает это, это потому, что они хотят выполнить тело один раз для каждого элемента в массиве. Удобно, потому что i увеличивается каждый раз в цикле, вы можете получить текущий элемент внутри тела цикла через robbery_record[i] :

 for (let i = 0; i < robbery_record.length; i  ) {
  const record = robbery_record[i];
  // do stuff with the current record
}
  

Каждая из ваших записей robbery_record является объектом со свойствами PointX и PointY , поэтому вы можете использовать их в теле цикла:

 for (let i = 0; i < robbery_record.length; i  ) {
  // record is an object, like: { PointX: 123, PointY: 456 }
  const record = robbery_record[i];

  // do stuff with the object's properties
  console.log(record.PointX) // 123
  console.log(record.PointY) // 456

  const x = record.PointX; // now x === 123
  const y = record.PointX; // now y === 456

  // etc.
}
  

Надеюсь, это поможет.

Глядя на i <absconder_record.Loc_X[i].length ,

• absconder_record.Loc_X является ли массив

• absconder_record.Loc_X[i] является числом

• absconder_record.Loc_X[i].length является length свойством number (совместно используемого с объектом Number), которое undefined

• Проверка сравнения на число, меньшее undefined , возвращает false

Таким образом, условие цикла всегда выполняется с ошибкой, и тело цикла никогда не выполняется.