From 167e4a1f613f2b653e65eaa4dcb1d2f15d09de48 Mon Sep 17 00:00:00 2001 From: Joseph Malloch Date: Wed, 28 Jul 2021 17:39:31 -0300 Subject: [PATCH] Tweaking appearance of convergent maps to make them more legible. --- js/views/ListView.js | 23 ++++++++++++++++++----- js/views/MapPainter.js | 4 ++-- js/views/View.js | 13 ++++++++----- 3 files changed, 28 insertions(+), 12 deletions(-) diff --git a/js/views/ListView.js b/js/views/ListView.js index 51d5fcb..5230cb0 100644 --- a/js/views/ListView.js +++ b/js/views/ListView.js @@ -136,14 +136,25 @@ class ListMapPainter extends MapPainter if (Math.abs(src.x - dst.x) < 1) this.vertical(src, dst, i); - else this.betweenTables(src, dst, i); + else + this.betweenTables(src, dst, i); } betweenTables(src, dst, i, dstPos) { - let mpx = dstPos ? dst.x : (src.x + dst.x) * 0.5; - this.pathspecs[i] = [['M', src.x, src.y], - ['C', mpx, src.y, mpx, dst.y, dst.x, dst.y]]; + let mpx = this.frame.cx; + if (src.isnode) + mpx = dstPos ? dst.x : (src.x + dst.x) * 0.5; + + if (dst.isnode == true) { + let offset = 50; + this.pathspecs[i] = [['M', src.x, src.y], + ['C', mpx, src.y, dst.x + dst.vx * offset, dst.y, dst.x, dst.y]]; + } + else { + this.pathspecs[i] = [['M', src.x, src.y], + ['C', mpx, src.y, mpx, dst.y, dst.x, dst.y]]; + } } vertical(src, dst, i) @@ -196,7 +207,9 @@ class ListMapPainter extends MapPainter } getNodePosition() { - return super.getNodePosition(50); + let offset = 50; + let dst = this.map.dst.position; + return {x: dst.x + dst.vx * offset, y: dst.y, vx: dst.vx, vy: 0, isnode: 1}; } } diff --git a/js/views/MapPainter.js b/js/views/MapPainter.js index 16bc5e1..33376ed 100644 --- a/js/views/MapPainter.js +++ b/js/views/MapPainter.js @@ -213,7 +213,7 @@ class MapPainter { attributes = this.attributes[0]; // hide arrowhead if path is short to avoid Raphael error message - if (len < 50) + if (len < 30) attributes['arrow-end'] = 'none'; if (typeof path === 'undefined' || path[0] == null) @@ -291,7 +291,7 @@ class MapPainter { y += offset * dst.vy; } - return {x: x, y: y, vy: 0}; + return {x: x, y: y, vx: x < dst.x ? -1 : 1, vy: 0, isnode: true}; } circle_spec(x, y, radius = 7) diff --git a/js/views/View.js b/js/views/View.js index b149fda..b2a1bce 100644 --- a/js/views/View.js +++ b/js/views/View.js @@ -462,7 +462,7 @@ class View { self.newMap = { 'srcs': [sig], - 'dst': {'position': {'x': x, 'y': y}, 'device': {'hidden' : false}, 'view': {}}, + 'dst': {'position': {x: x, y: y, vx: 0, vy: 0}, 'device': {'hidden' : false}, 'view': {}}, 'selected': true, 'hidden': false }; @@ -476,7 +476,7 @@ class View { } if (!self._continue_map_snap(x, y)) { self._unsnap_to_map(); - self.newMap.dst.position = {'x': x, 'y': y}; + self.newMap.dst.position = {x: x, y: y, vx: 0, vy: 0}; } } self.newMap.view.draw(0); @@ -786,7 +786,7 @@ class View { self.newMap = { 'srcs': [self.draggingFrom], - 'dst': {position: {x: 0, y: 0}}, + 'dst': {position: {x: 0, y: 0, vx: 0, vy: 0}}, 'selected': true }; self.newMap.view = new self.mapPainter(self.newMap, self.canvas, @@ -838,7 +838,7 @@ class View { break; } if (!dst) { - self.newMap.dst = {position: {x: svgx, y: svgy}}; + self.newMap.dst = {position: {x: svgx, y: svgy, vx: 0, vy: 0}}; } } } @@ -952,7 +952,10 @@ class View { { let selected_path = map.view.intersected; let selected_len = selected_path.getTotalLength(); - return selected_path.getPointAtLength(selected_len / 2); + let pos = selected_path.getPointAtLength(selected_len / 2); + pos.vx = 0; + pos.vy = 0; + return pos; } _snap_to_map(snap_map)