JavaScript code: Determine if a set of x/y points represents a circular shape

I have a matrix in the format below. I am looking for help to identify the outline that forms a circle:

EDIT 1: What about the outline? The outline should not include spaces (each y-value should have at least 2 x-values).

EDIT 2: What is considered a circle? I am searching for circles that are relatively precise, similar to the example provided below! (consistently maintaining radius)

    // Matrix representation
    00000000000000000000000000000000
    00000000000001111111100000000000
    ...
    00000000000000000000000000000000

In addition, I have an array containing all positions of the outline:

var coordinates = [
  [13,1],[14,1],[15,1], ... ,[20,22]
]

What's the best method to determine if these coordinates form a circular shape?

Initially, I attempted using this code snippet but I believe there might be a more efficient solution:

var circle = [[13,1],[14,1],[15,1], ... ,[20,22]];

var no_circle= [[13,1],[14,1],[25,4]];

Array.prototype.is_circle = function() {
// Code logic for determining a circle
}

var result1 = circle.is_circle();
console.log(result1)

var result2 = no_circle.is_circle();
console.log(result2)

Answer №1

It appears that your algorithm focuses on only the four most distant points along the X and Y axes. I believe that if you input points forming a square shape, it will still meet the requirements for the is_circle test.

My suggestion is to conduct a two-step evaluation with an additional parameter known as the roundness margin, denoted by e. First, traverse through the entire point set and keep track of x_min, y_min, x_max, and y_max. Next, ensure that the difference between the Delta X and Delta Y falls within the error threshold, such as

abs((x_max-x_min) - (y_max-y_min)) <= e
. This step evaluates the roundness of the shape to distinguish between a circle and an oval. If this assessment passes, proceed to calculate the center point c at coordinates
(x_c, y_c) = (x_min+(x_max-x_min)/2, y_min+(y_max-y_min)/2)
. Then, for each point, determine if the radius (distance from the point to the center c) is within the error margin e. To optimize efficiency, initially confirm if the squared radius of each point aligns with the error boundary, indicated by
abs((x-x_c)^2 + (y-y_c)^2 - r^2) <= e
, where r^2 is calculated using the center c and the initial point in the sequence.

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

Simple solution for storing key-value pairs temporarily in a form using JQuery

Is there an elegant method to temporarily store an array of string values in a form? In my article editing form, users can add tags as string values. I don't want these tags to be persisted until the user saves the entire article, so I require a way ...

Guide to implement a confirmation box in PHP

I recently set up a Joomla article and integrated the Sourcerer Joomla extension to include JavaScript and PHP in my project. Currently, I am developing a course purchase site where users can buy courses from owners and credits are deducted upon every purc ...

Are Primereact and MUI JOY Styling at Odds?

here is the image of datatables and button I am currently using Primereact and MUI Joy in the same project, but I am facing an issue where the Primereact styling does not load properly. I'm not sure if it's due to a conflict with MUI Joy or some ...

Debugging TypeScript on a Linux environment

Approximately one year ago, there was a discussion regarding this. I am curious to know the current situation in terms of coding and debugging TypeScript on Linux. The Atom TypeScript plugin appears promising, but I have not come across any information ab ...

What is the reason behind the unnecessary requirement of adding {...props} when passing them to a component in a React router?

Recently, I delved into learning React and encountered a puzzling issue while following a course. To gain clarity, I decided to experiment with it separately, but the confusion remains unresolved. While researching, I discovered that when utilizing a Rout ...

What is the best way to bypass TS1192 when incorporating @types/cleave.js into my Angular application?

Using cleave.js (^1.5.2) in my Angular 6 application, along with the @types/cleave.js package (^1.4.0), I encountered a strange issue. When I run ng build to compile the application, it fails and shows the following errors: ERROR in src/app/app.component. ...

Identifying text within a paragraph using JavaScript regex, excluding any URLs mentioned

How can I use JavaScript on the client side to find a search term in a paragraph while excluding any matches that are part of a URL? I attempted to use the following regex but encountered an error: "A quantifier inside a lookbehind makes it non-fixed widt ...

transmit JSON formatted form data to an AngularJS platform

I have a webpage built on AngularJS with a login feature. I want to iframe this webpage onto my own page and automatically log in my users. Upon inspecting the AngularJS site, I noticed that the login procedure expects a json object. I have tried multipl ...

When scrolling, the selected text does not maintain its correct position

I'm looking to enable my users to search by selecting text. Once they select text, a new button will appear on the right side of the selected text giving them the option to search or not. However, when the user scrolls to the bottom of the page, the p ...

I am looking to customize the color of my Material UI switch

I am having difficulty changing the color of my Material UI switch based on my preference. I have tried several ways, but have not achieved the desired outcome. const useStyles = makeStyles((theme) => ({ toggle: { '& .Mui-checked': ...

Securely Upload Files with JavaScript

Are there any methods to utilize javascript or ajax for encrypting file uploads securely? If so, could you provide a sample code snippet or direct me to a functional example? ...

Confirm that only the days of the present month are eligible for selection

I have been given the responsibility of validating a date field that is populated when an invoice is created. The date field consists of a text box and three button objects allowing users to select a date from a calendar, input today's date, or remove ...

Enhancing the structural layout of DNA sequencing degapping

Question: How can we efficiently redesign the code for manipulating aligned DNA sequences representing gene locations? If we have three aligned DNA sequences (seq1, seq2, and seq3), each containing strings that represent two genes (gene1 and gene2) with k ...

What is the best way to split a semicircular border radius in two equal parts?

Is there a way to halve the yellow line or remove it from above the red box, while keeping it below? Can this be achieved using just HTML and CSS, or is JavaScript necessary? * { margin: 0; padding: 0; box-sizing: border-box; } body { height: 1 ...

The carousel comes to a halt once it reaches the final slide and does not continue cycling

Currently working on a website project for a client and utilizing Bootstrap to create a carousel feature. I am specifically using Bootstrap 3.0. After searching for a similar issue here, I found two cases that resemble mine but unfortunately have no soluti ...

How can you stop data URI from being cached as an image source?

I am facing an issue where I have an img-tag with a data-image base64 URI as the source. Browsers tend to cache this source, which is causing problems for me. If it were a normal URL, I could easily prevent caching by adding a random query-parameter value. ...

How can you trigger a link click event when clicking anywhere on the page using Jquery?

Here's the code I'm working with: <a href="http://google.com" target="_blank">Open in new tab </a> I am trying to make it so that when a user clicks anywhere on the website, the link above will be automatically clicked and a new tab ...

Is there a way to show a 'Refresh' icon in HTML without the need to download an image through HTTP?

In my HTML/JavaScript app project, I am looking to incorporate a 'refresh' symbol without having to load an image through HTTP requests. Are there reliable methods that can achieve this across all major browsers? I came across the Unicode value: ...

Axios appends square brackets at the end of the parameter name

Utilizing vuejs in combination with axios and a Django server presents a challenge. The server requires parameters to be passed as travelers, but when using axios to send this data, it appends [] at the end resulting in travelers[]. Is there a way to prev ...

What steps can I take to completely remove JavaScript from an HTML document?

To eliminate the <script> tags in the HTML, I can utilize regex just like this $html = preg_replace('#<script(.*?)>(.*?)</script>#is','', $html); While this approach works well, dealing with inline JavaScript require ...