cncjs / cncjs

A web-based interface for CNC milling controller running Grbl, Marlin, Smoothieware, or TinyG.
https://cnc.js.org
MIT License
2.27k stars 561 forks source link

UI Improvements #500

Open bradanlane opened 5 years ago

bradanlane commented 5 years ago

Description

Describe the issue or feature request in detail. Take a screenshot or record a video will be helpful.

Versions

How Do You Install CNCjs?

CNC Controller

Hardware

Operating System

The following are suggestions which may be generally useful. My usecase for CNCjs is to drive a laser engraver for creating prototype PCBs.

Suggestion 1: support crosshair for toolhead position or do not zoom red dot with view zoom

To properly align successive gcode runs, I use the UI to position the head over two opposing points on the display and then compare that to the head position over the work. This is done at a relatively high zoom factor. The red dot enlarges with the zoom. This may not be necessary since there is already an option to show the toolhead.

Suggestion 2: compute zoom to fit based on current display area and gcode area

The zoom-to-fit button on the viewer chooses a zoom which appears to be based on viewer height and does not appear to use the min/max coordinates of the loaded gcode. Rarely does the full gcode display when choosing zoom-to-fit. Also, the viewer does not recenter on the gcode. Suggestion 3: pan viewer with cursor

Suggestion 3: eliminate scaling factor when panning (or invert it so scaling has less effect when zoomed in)

The panning motion when click-n-hold mouse button, appears to have some scaling factor applied. The scaling factor is inverse to the zoom factor. EG: zoom way out and pan with the mouse and the mouse moves more than the viewer area; zoon way in and pan with the mouse and the viewer areas moves much more than the mouse. This makes mouse panning very difficult to use when zoomed in on the viewer.

The above issues may be unique to users working with smaller object where zoom is used more aggressively and for users where multiple gcode operations are executed and need relatively high positioning precision.

M0USS commented 4 years ago

Hello,

I am trying to modify the HTML or CSS code to change my gray lines by an orange color, but I have trouble locating the file to edit it.

Thank you in advance.

CNCjs versions: 1.9.20

CNCjs desktop application

CNC controller: Grbl

Material: PC

Operator system: Windows 10

cncjs_html