Trying to show text on an ordered loop - Javascript

Hi! I have a marker on a map that shows a popup with text. My goal is for the text to change with each click on the marker. I would like the text to go in order and loop when finished.

I currently have a working Random Text generator but I’m failing to get the function working in the Ordered Text

1 Like

Hello, @sleepyjoshua.

Welcome to the forums.

In your Ordered Text project, you have what appears to be the makings of a for loop which would allow you to iterate over the different string values, but you are missing a few key parts of the loop. See the docs for more information.

1 Like

2 posts were split to a new topic: Sitka area

Thank you. I’ve modified it. Perhaps I’m getting closer.

I get a little flustered when I’m not sure if i should be iterated inside of the loopText function or if it should be outside. I get confused on how to get the value of i out of the for loop, like… I think it’s redefining the str value and so return items[str]; is maybe returning the string I want? (Just typing out the questions in my brain)

2 Likes

This is from your code:

var items = new Array(
      "First message",
      "Second message",
      "Last message. Now loop..."
);

// Iterate i values
let str = "";
 
for (let i=0, len=items.length; i < len; i++) { 
  str = str + i;
}
  
return items[str];}

It appears that you want to use i as the index to access the elements of your items array. When you start your for loop you’ll want to follow this pattern from the MDN documentation:

for ([ initialization ]; [ condition ]; [ final-expression ])

The three expressions should be separated by semi-colons, so you could do this:

for(let i = 0; i < items.length; i++) {
  //in here you would use i as the index to access elements of the items array
  //for example: console.log(items[i]) this loop would log each element of
  //the array to the console.
}

That’s how a for loop works, but that doesn’t appear to me to be what you’re trying to do here. It looks like you want to have the messages in the items array appear in a popup on the map when the map marker is clicked. You want the messages to appear in order, one at a time, changing with each mouse click. Using a for loop probably isn’t what you want here. Think about how you would ask another person to complete the task:
Possibly:

  1. When the marker is clicked, show items[0].
  2. If the marker is clicked again, show items[1].
  3. Continue to show the next element in the items array on each subsequent mouse click. After the last element has been displayed, start over from the beginning of the array (items[0]) on the next mouse click.

If I were using a variable such as i to keep track of the index of the element in the array to be displayed next, I’d need to increment after each use. If my array had 6 elements, the indexes would be 0-5, so instead of going from 5 to 6, I’d want to go from 5 back to 0.

See what you can come up with, and feel free to ask more questions.

Thank you so much for this detailed response. I’ll take some time going through what you said. I appreciate it.

1 Like

You’re very welcome.

1 Like