What could be causing this code to continuously loop without end?

I've been scratching my head trying to understand why this code isn't working.

var refP = [];
var calculateDistance = function (p1, p2) {
    return dist(p1.x, p1.y, p2.x, p2.y);
}
while (refP.length < 24) {
    var point = {
        x: -1,
        y: -1,
        closestRefPoint: 9999999
    };
    point.x = (random(0, 400));
    point.y = (random(0, 400));
    for (var i = 0; i < refP.length; i++) {
        if (calculateDistance(point, refP[i]) < point.closestRefPoint) {
            point.closestRefPoint = calculateDistance(point, refP[i]);
        }
    }
    if (point.closestRefPoint > 2) {
        refP[refP.length] = point;
    }
}

After removing the last if-statement and unconditionally pushing 'point' onto 'refP', the loop doesn't seem to work as expected.

Any help or suggestions on how to clean up or simplify this code would be greatly appreciated. Thank you!

Answer №1

Have you double-checked the functionality of your random and dist functions?

Try updating your distance function to:

var distance = function (point1, point2) {
  var xs = 0;
  var ys = 0;

  xs = point2.x - point1.x;
  xs = xs * xs;

  ys = point2.y - point1.y;
  ys = ys * ys;

  return Math.sqrt( xs + ys );
}

and replace your random(0, 400) calls with:

pusher.x = Math.floor(Math.random() * 400);
pusher.y = Math.floor(Math.random() * 400);

This adjustment worked for me.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What seems to be causing the malfunction in this ranking function?

I created a custom function to retrieve the top five users from a JSON database. Below is the code snippet: var users = []; Object.keys(database).forEach(user => { if (!users[0]) { users[0] = user } else { var checked = false; for (let ...

"Creating a new element caused the inline-block display to malfunction

Can someone explain why the createElement function is not maintaining inline-block whitespace between elements? Example problem First rectangle shows normal html string concatenation: var htmlString = '<div class='inline-block'...>&l ...

What is the best way to ensure that the checkbox is not affected when you click on the area?

If the user interacts with the checkbox, I don't want the handleClick function to execute. Is there a way to exclude it or prevent the click event from triggering? <div ... onClick={this.handleClick}> <div> some content here < ...

Challenges with character encoding in NextJS

I am currently dealing with a line of code that creates a dynamic route. <Link href={`/bundeslander/${urlName}`} ><div className=" text-blue-400">{state.name}</div></Link> The variable urlName is generated by fetching dat ...

Simplify nested JSON data

I'm struggling with a JSON object that looks like this: const people = { name: 'My Name', cities: [{city: 'London', country: 'UK'},{city: 'Mumbai', country: 'IN'},{city: 'New York', country: ...

The uncomplicated Python script encountered an endless loop

I am currently working on a basic XOR program. After double-checking my syntax, I executed the program and unexpectedly encountered an infinite loop. I have been unable to identify the cause of this issue. Can anyone provide assistance? def disencode(n) ...

Learn the process of sending notifications upon clicking on an advertisement by a user

I'm currently working on a system that displays ads on mobile devices. Our clients have the option to use their own custom HTML code for their advertisements. We want to be able to track when a user clicks on these ads. I am considering wrapping the u ...

Vanilla JavaScript: toggling text visibility with pure JS

Recently, I started learning javascript and I am attempting to use vanilla javascript to show and hide text on click. However, I can't seem to figure out what is going wrong. Here is the code snippet I have: Below is the HTML code snippet: <p cla ...

Focusing in on the mouse location to magnify a THREE.js element

I am currently working on a project using THREE.js and I have encountered an issue with zooming the object. The zoom functionality is centered around the render position when using trackball controls, but I need it to be based on the cursor's position ...

Transforming the navigation menu using CSS, HTML, and jQuery

One challenge I am facing involves creating a menu similar to the one on http://edition.cnn.com/. I want the clicked button in the menu to receive focus, while the others lose it. Despite trying various methods, I have not been successful. Can someone off ...

I attempted to initiate a transition using JavaScript, but unfortunately it failed to execute

Hey there! I'm just starting out with HTML, CSS, and JavaScript, and I've been trying to make a transition work using JavaScript. The element I'm working with is a "menu-icon" which is a span tag with a small image nested inside another div ...

Inexperienced individual asks: 'Is it possible to accomplish this task using Dojo and Ajax?'

On my website, there is a feature that sends an initial request to a web service. Once this request is sent, the user has to wait for a specific amount of time before being able to send a second request. During this waiting period, I would like a countdo ...

There are a few steps to take in order to sort an array of objects by a

I want to organize and display data in a sortable table format javascript let dataList = [ { idx: number, name: string, btn: number, index: number }, { idx: number, name: string, btn: number, index: number }, { idx: number, name: string, btn: number ...

What is the process of directing to another HTML page within the same Express controller script?

I am looking to switch the initial page (login page) to a second page (admin dashboard) from within the same controller in Express after a specific action has been taken. Here is the relevant code snippet from my controller file nimda.js: function handle ...

Assigning arbitrary hidden form data from dropdown selection

Would like to assign Layers Value as one of the following: GFS Meteogram 3day std or WRF 20 Global Meteogram 3day Std depending on the option selected from the dropdown menu <div><select id="myselect" class="productViewerParameter" name=" ...

Ways to implement StackNavigator along with Redux?

Is there anyone who can assist me in integrating StackNavigator and Redux? It seems straightforward, but I'm encountering issues. index.ios.js import React from 'react' import { AppRegistry } from 'react-native' import { Provi ...

What is the best way to eliminate YouTube branding from a video embedded in a website?

I am currently utilizing an <iframe width="550" height="314" src="https://www.youtube.com/embed/vidid?modestbranding=1&amp;rel=0&amp;showinfo=0" frameborder="0" allowfullscreen></iframe> This setup removes the "YouTube" logo from the ...

Utilizing Dynamic Image Sources in Vue.js with the Help of APIs

Can someone help me figure out how to solve this issue? I have an API that returns a base64 image, and I want to load this image on my site. Any suggestions on where or how I should implement my function? This is the API call located in the methods: metho ...

What is the method to implement timeago.js?

I've recently embarked on my journey to learn JavaScript, and it has only been two weeks since I started. As a beginner, I'm encountering some difficulties with implementing timeago from . The specific line of instruction that's giving me tr ...

Steps to incorporate / insert Angular directive in an application

In my app, the main.js file is located in the root folder. -app |_ routes.js |_ main.js -components |_directives |_abc-directive.js I am trying to figure out how to define a directive that can be accessed from a different folder. This is what I at ...