While in the comments you said something similar to graphing, I would really give something like kineticjs a peek. It uses canvas's and could be a bit of overkill for what you are attempting but it's a great resource that has many uses but since you've requested a grid, here is a question over that as well Kinetic.js – creating a grid and combine with something like: Jquery drag and drop and snap to grid in kineticJS or Snap to grid operation using images,kinetic.js,javascript? to get the snapping you're looking for.
JS: displaying an infinitely long coordinating system (grid)
-
27-06-2022 - |
Question
I would like to display an infinitely long coordinating system/grid (X and Y axes), which contains an endless amount of square (something like DIVs), using JavaScript. I don't have any idea where to start. It seems to me like a really hard problem to solve. There are so many factors of which I don't have an idea to build them, such as:
- structuring them in an HTML element tree
- using the right elements (probably SVG elements)
- giving the grid a fluid scroll
- coordinating the loading of each element (if it has to be displayed)
I am sure there are JavaScript libraries, that can help me doing it, but I don't know any of these.
What would be a good way to start with?
Here is the concept of my grid:
(Y axis)
^
| | | |
|--+------+------+---
| E| SQURE| SQURE| SQ
| | | |
|--+------+------+---
| E| SQURE| SQURE| SQ
| | | |
|--+------+------+---
| E| SQURE| SQURE| SQ
+--------------------> (X axis)
La solution
Autres conseils
There exist books about this topic, e.g.
- Supercharged JavaScript Graphics, see http://shop.oreilly.com/product/0636920013044.do
Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow