

This way my end users would not have to re-learn or re-design their projects that were based on the 0,0 index always being in the top-left, rather than the center. Then I would just multiply the -Y by -1 to get a +Y and divide +X and +Y by 12 and floor each to get the corresponding cell index as if it were still an HTML table.

My goal is to confine designs to the 4th quadrant (+X,-Y).
#X and y mouse coordinates series#
The “table” is drawn as a series of THREE.Lines spaced 12 points apart from one another.

The user would be shown the current “cell ” for reference. In picture below, the camera and orbit controls are shifted so that the origin (0,0,0 ) is in the top-left (DOM style), rather than the center. Some designs have hundreds, if not a thousand individual 12x12 pixel elements all being rendered at the same time. In the other application that used these designs, the table was not rendered which helped increase performance but still took its toll on mobile devices when the designs became very large (sometimes extending folds beyond the view-port). The table was only used for position referencing. I’m re-writing an existing application where a user would click cells in an HTML table and place predefined design items in them and then save that design to be used in another application.
