start of ruler preferences and style

- Want to have initial X position.
- initial Y position.
- initial ruler lenght.

pending:

- Don't overlap at creation.
- change polyline width.
- change white and gray polyline.
- Change polyline color.
- Change text label.
- Change text font family.
- Change text font size.
This commit is contained in:
Ángel Montero Lamas 2024-08-27 22:19:17 +02:00
parent 19f7f2508e
commit 8b4dcec79d
5 changed files with 166 additions and 17 deletions

View file

@ -122,12 +122,23 @@ function editUnits() {
function addRuler() {
if (!layerIsOn("toggleRulers")) toggleRulers();
const pt = byId("map").createSVGPoint();
(pt.x = graphWidth / 2), (pt.y = graphHeight / 4);
// Use saved values on localStorage, or default values if not exist
const initialX = parseFloat(localStorage.getItem("rulerInitialX")) || 50;
const initialY = parseFloat(localStorage.getItem("rulerInitialY")) || 50;
const initialLength = parseFloat(localStorage.getItem("rulerInitialLength")) || 100;
// Calculate coordinates based on percentages
pt.x = graphWidth * (initialX / 100);
pt.y = graphHeight * (initialY / 100);
// const defaultvalue = (pt.x = graphWidth / 2), (pt.y = graphHeight / 4);
const p = pt.matrixTransform(viewbox.node().getScreenCTM().inverse());
const dx = graphWidth / 4 / scale;
const dx = (initialLength / 200) * graphWidth / scale;
const dy = (rulers.data.length * 40) % (graphHeight / 2);
const from = [(p.x - dx) | 0, (p.y + dy) | 0];
const to = [(p.x + dx) | 0, (p.y + dy) | 0];
const from = [(p.x - dx) | 0, p.y | 0];
const to = [(p.x + dx) | 0, p.y | 0];
rulers.create(Ruler, [from, to]).draw();
}