diff --git a/src/components/map/Map.css b/src/components/map/Map.css index 08a77bf..c32c2e8 100644 --- a/src/components/map/Map.css +++ b/src/components/map/Map.css @@ -35,7 +35,7 @@ display: block; } -.map svg g.signal g { +.map svg g.signal-icon g { stroke: #eee; } diff --git a/src/components/map/object-renderers/RouteRenderer.js b/src/components/map/object-renderers/RouteRenderer.js index 1f8ba7f..35303f8 100644 --- a/src/components/map/object-renderers/RouteRenderer.js +++ b/src/components/map/object-renderers/RouteRenderer.js @@ -1,21 +1,12 @@ -import { useMemo } from "react"; import { ReactSVG } from "react-svg"; +import AngleHelper from "../../../helpers/angleHelper"; export default function RouteRenderer(props) { const { object } = props; const [x, y] = object.pos.toSVGCoords(); - const upsideDown = useMemo(() => { - let rot = object.rot.y; - if (rot < 0) { - rot += 360 * Math.ceil(Math.abs(rot) / 360); - } else if (rot >= 360) { - rot -= 360 * Math.floor(rot / 360); - } - - return rot > 180; - }, [object.rot.y]); - + const rot = AngleHelper.normalizeDegAngle(object.rot.y); + const upsideDown = rot >= 180; const upsideDownRot = upsideDown ? 90 : -90; const offY = object.track_count === 2 ? -22 : -20; const anchor = upsideDown ? "start" : "end"; diff --git a/src/components/map/object-renderers/SignalRenderer.js b/src/components/map/object-renderers/SignalRenderer.js index 9a4d7b9..b6c1f10 100644 --- a/src/components/map/object-renderers/SignalRenderer.js +++ b/src/components/map/object-renderers/SignalRenderer.js @@ -1,12 +1,18 @@ import { ReactSVG } from 'react-svg' +import AngleHelper from '../../../helpers/angleHelper'; export default function SignalRenderer(props) { const { object } = props; const [x, y] = object.pos.toSVGCoords(); + const rot = AngleHelper.normalizeDegAngle(object.rot.y); + const upsideDown = rot >= 180; + const upsideDownRot = upsideDown ? 90 : -90; + const anchor = upsideDown ? "end" : "start"; + return ( - - + + - - {object.getPrintableSignalName()} - + + + {object.getPrintableSignalName()} + + ); } diff --git a/src/helpers/angleHelper.js b/src/helpers/angleHelper.js new file mode 100644 index 0000000..a435e96 --- /dev/null +++ b/src/helpers/angleHelper.js @@ -0,0 +1,25 @@ +function degToRad(angle) { + return angle * (Math.PI / 180); +} + +function radToDeg(angle) { + return angle * (180 / Math.PI); +} + +function normalizeDegAngle(angle) { + if (angle < 0) { + return angle + 360 * Math.ceil(Math.abs(angle) / 360); + } else if (angle >= 360) { + return angle - 360 * Math.floor(angle / 360); + } else { + return angle; + } +} + +const AngleHelper = { + degToRad, + radToDeg, + normalizeDegAngle, +} + +export default AngleHelper; \ No newline at end of file diff --git a/src/model/point-track.js b/src/model/point-track.js index d392315..0f8e999 100644 --- a/src/model/point-track.js +++ b/src/model/point-track.js @@ -1,3 +1,4 @@ +import AngleHelper from '../helpers/angleHelper'; import Track from './track'; import Vector3 from './vector3'; @@ -10,7 +11,7 @@ export default class PointTrack extends Track }; constructor(id, start, end, r, previd, nextid, id_station, id_isolation, maxspeed, derailspeed) { - const ry = start.atanY(end); + const ry = AngleHelper.radToDeg(start.atanY(end)); const rot = new Vector3(0, ry, 0); // TODO: fix rx and rz = 0 // TODO: calculate length diff --git a/src/model/standard-track.js b/src/model/standard-track.js index 08c2b91..5aa654a 100644 --- a/src/model/standard-track.js +++ b/src/model/standard-track.js @@ -1,3 +1,4 @@ +import AngleHelper from "../helpers/angleHelper"; import Track from "./track"; import Vector3 from "./vector3"; @@ -35,7 +36,7 @@ export default class StandardTrack extends Track } _calcPoints() { - const rotRad = this.rot.y * Math.PI / 180; + const rotRad = AngleHelper.degToRad(this.rot.y); this.points.start = this.pos.clone(); this.points.end = this.pos.add(Vector3.fromAngleY(rotRad, this.len));