izawartka/td2-visualizer
izawartka/td2-visualizer
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Place route name label at the start of route

Browse Source
This commit is contained in:
dominik-korsa 2025-07-13 22:58:55 +02:00
parent 94554d5200
commit 391be08250
No known key found for this signature in database
GPG Key ID: 5A24D76EE0A30974
3 changed files with 26 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/map/Map.css
View File

@ -63,11 +63,11 @@
fill: #111;
}
.map svg g.route g {
.map svg g.route-arrow {
fill: #eee;
}
.map svg g.route text {
.map svg g.route-name text {
fill: #eee;
font-size: 72mm;
}

19
src/components/map/object-renderers/RouteRenderer.js
View File

@ -1,17 +1,21 @@
import { ReactSVG } from "react-svg";
import AlwaysUpText from "../text/AlwaysUpText";
import AngleHelper from "../../../helpers/angleHelper";
export default function RouteRenderer(props) {
const { object } = props;
const [x, y] = object.end_center.toSVGCoords();
const angle = object.end_angle_rad * 180 / Math.PI;
const [startX, startY] = object.pos.toSVGCoords();
const startAngle = object.rot.y;
const [endX, endY] = object.end_center.toSVGCoords();
const endAngle = AngleHelper.radToDeg(object.end_angle_rad);
const offY = object.track_count === 2 ? -22 : -20;
const arrowOffset = - object.track_offset - 37.8;
return (
<g className="route" transform={`translate(${x}, ${y}) rotate(${angle})`}>
<g transform={`rotate(90) translate(-80, ${arrowOffset})`}>
return (<>
<g className="route-arrow" transform={`translate(${endX}, ${endY}) rotate(${endAngle + 90}) translate(-80, ${arrowOffset})`}>
<ReactSVG
src={`${process.env.PUBLIC_URL}/assets/route.svg`}
wrapper='svg'
@ -21,8 +25,9 @@ export default function RouteRenderer(props) {
}}
/>
</g>
<g className="route-name" transform={`translate(${startX}, ${startY}) rotate(${startAngle})`}>
<AlwaysUpText
baseRot={angle}
baseRot={startAngle}
additionalRot={-90}
offsetX={object.track_offset}
reverseAnchor={true}
@ -33,5 +38,5 @@ export default function RouteRenderer(props) {
text={object.route_name}
/>
</g>
);
</>);
}

5
src/model/route.js
View File

@ -3,6 +3,7 @@ import Vector3 from "./vector3";
import SceneryParserLog from "./scenery-parser-log";
import RouteTrack from "./tracks/route-track";
import TrackConnection, {TrackConnectionEnd} from "./track-connection";
import AngleHelper from "../helpers/angleHelper";
export default class Route extends SceneryObject {
track_count;
@ -57,7 +58,7 @@ export default class Route extends SceneryObject {
return;
}
const startAngleRad = this.end_angle_rad;
const start_rot = new Vector3(0, startAngleRad * 180 / Math.PI, 0);
const startRot = new Vector3(0, AngleHelper.radToDeg(startAngleRad), 0);
const startPoints = this.end_points;
this.end_points = [];
@ -98,7 +99,7 @@ export default class Route extends SceneryObject {
trackId,
startPoints[index],
this.end_points[index],
start_rot,
startRot,
lengths[index],
radii[index],
[], // connections