Sunset Harbor Dev Diary #2a
Author: Avanya,
published 4 years ago,
[b]Greetings fellow city-builders and welcome to another Sunset Harbor Dev Diary![/b]
Ever since Cities: Skylines was released, we have received hundreds of requests for one specific feature: Trolleybuses! And to go along with every one of those requests, vivid debates took place within the community about whether or not trolleybuses are too hard to implement, if the feature is “too niche” or if “they” actually ever even read the suggestions posted on the forums.
Let us assure you that we are indeed constantly listening, and every single idea is considered when we are deciding what to do next! Also, we are just as enthusiastic about public transport as you are, and you would have to be very creative to suggest something that we would consider to be “too niche”
The reason trolleybuses have never been added is their technical complexity. Trolleybuses are basically “trackless trams”: electrical buses that draw their power from overhead wires. Unlike trams, they utilize two wires and two trolley poles to complete the electrical circuit. And like a normal bus, a trolleybus is able to change lanes and stop on the side of the road. As the bus is moving, its poles rotate and tilt to stay attached to the wires. In the game as well as in reality, the trolley poles are the most tricky part of the whole system.
[b]We are glad to inform you that we have managed to overcome the technical challenges, so Trolleybuses will finally be available in Cities: Skylines – Sunset Harbor![/b]
[img]https://clan.cloudflare.steamstatic.com/images//6625556/0a1d08c321a9b48c9b34df2e17dab6e72a70df0d.jpg[/img]
[i]They are finally here![/i]
The trolleybus system in Cities: Skylines – Sunset Harbor consists of four components:
[list][*]Trolleybus Depot
[*]Trolleybus Roads
[*]Trolleybus Stops
[*]Trolleybus Vehicle[/list]
To get started with trolleybuses, you first place a Trolleybus Depot. After that, you can place Trolleybus Roads and create Trolleybus Lines with roadside stops. Your depot will then send out trolleybuses to operate the lines. It is important to remember that the trolley poles must be attached to the wires at all times, so your Trolleybus Depot and your Trolleybus Lines must be connected by Trolleybus Roads as well!
[img]https://clan.cloudflare.steamstatic.com/images//6625556/032df1f7f1a65cf2b808af3b8f10294ffde0e929.jpg[/img]
[i]Trolleybus Depot sending out new trolleybuses.[/i]
[img]https://clan.cloudflare.steamstatic.com/images//6625556/71c3fc0f2b65c773e376517fc60aafb2f7950658.jpg[/img]
[i]Taking passengers over the river.[/i]
That’s the easy part! In the second part of this Dev Diary, we would like to shed light on what we did to make the trolley poles behave realistically. Unlike other diary entries, this one will be slightly more technical. Even if you are not that math and geometry savvy, we still hope you enjoy this inside look!
[img]https://clan.cloudflare.steamstatic.com/images//6625556/ee12f3ee48dd7f8afee70f27b98a13f5011f059f.jpg[/img]
[h2]The Wire[/h2]
Let’s take a closer look at the roads! On every road segment, you will find three catenary masts: One at the start, one in the middle and one at the end. The electrical wires span the masts, and with some mathematical calculations we can find out the start and end coordinate of each wire section. Let’s call them [img]https://clan.cloudflare.steamstatic.com/images//6625556/e4f69143d5b31416a15c3c352e15da91b8301ee4.jpg[/img] and [img]https://clan.cloudflare.steamstatic.com/images//6625556/d2b7af79e9ae33cbd442bb32570ab974f439b42c.jpg[/img] (using a small arrow to mark them as 3D vectors).
A mathematical formula to define the line of the wire would be [img]https://clan.cloudflare.steamstatic.com/images//6625556/9e88a6e1659f69f2e5a5c6b68d04ce48575f3c8e.jpg[/img] with [img]https://clan.cloudflare.steamstatic.com/images//6625556/ce815313cd58a1bdf5668ceef151a8a0b6fdf96f.jpg[/img] and [img]https://clan.cloudflare.steamstatic.com/images//6625556/9de18f230c642b776eb70653167961253e92e22b.jpg[/img]
When the bus is on the road segment, we want its pole to connect to the overhead wire defined by the mathematical formula above. [img]https://clan.cloudflare.steamstatic.com/images//6625556/9dd354b32b3242161fe6e5d75266b3e12dd334b7.jpg[/img] is the coordinate where the pole is attached to the wire.
[h2]The Trolleybus[/h2]
The game knows how the bus is positioned and rotated in the world, and from that it is possible to calculate the coordinate where the trolley pole is attached to the bus. Let’s call it [img]https://clan.cloudflare.steamstatic.com/images//6625556/24d1e1af1a80ba94f3f495534ba48067d22216c1.jpg[/img]!
The trolley pole is made of sturdy metal, so it cannot stretch. That means the distance between the coordinate where the pole is attached to the bus ([img]https://clan.cloudflare.steamstatic.com/images//6625556/24d1e1af1a80ba94f3f495534ba48067d22216c1.jpg[/img]) and the coordinate where the pole is attached to the wire ([img]https://clan.cloudflare.steamstatic.com/images//6625556/9dd354b32b3242161fe6e5d75266b3e12dd334b7.jpg[/img]) must always be equal to the length of the pole. Let’s call it and define this formula to
take that into account: [img]https://clan.cloudflare.steamstatic.com/images//6625556/42b89074f2270e6582c3a7406a898c768415972f.jpg[/img]
[h2]The Equation System[/h2]
By inserting the first formula into the second one, we end up with a single equation with a single unknown variable c :
[img]https://clan.cloudflare.steamstatic.com/images//6625556/0c78f1a5bfc58412bd7c08230e10ca0d1d5a5971.jpg[/img]
With a few tricks we can transform it into a quadratic equation:
Step 1: [img]https://clan.cloudflare.steamstatic.com/images//6625556/2cb9f267c750c8dcb4fcb3948f13aebcb9f6aca7.jpg[/img] with [img]https://clan.cloudflare.steamstatic.com/images//6625556/7f379f2deb1e590581457872cf6df73436b1e993.jpg[/img]
Step 2: [img]https://clan.cloudflare.steamstatic.com/images//6625556/cbd4baed3b4f6bf6a3d0aa5dcb2a06f30f3f533b.jpg[/img]
Step 3: [img]https://clan.cloudflare.steamstatic.com/images//6625556/cdbc08ab0842fc077ffdaddca0281d4c5a4b3394.jpg[/img]
Step 4: [img]https://clan.cloudflare.steamstatic.com/images//6625556/08548802a43664a169fcc406307d01cd5ac744c2.jpg[/img]
Step 5: [img]https://clan.cloudflare.steamstatic.com/images//6625556/fe46e9f459eca984b613d9ea0e8c74324b8e0996.jpg[/img]
We can use the [url=https://en.wikipedia.org/wiki/Quadratic_formula]quadratic formula[/url] to solve the equation.
We will get zero, one or two values for c :
[img]https://clan.cloudflare.steamstatic.com/images//6625556/2fd22eaf75255ec97c5c8d78aa221c91d8e9ed4e.jpg[/img]
Note that there will be no solutions if the part in the square root is negative (which happens if the wire is too far away from the bus). Note that the solutions for c calculated by this formula could also be out of range ([img]https://clan.cloudflare.steamstatic.com/images//6625556/9de18f230c642b776eb70653167961253e92e22b.jpg[/img]), so we have to check that as well.
[h2]Choosing the Right Position[/h2]
By inserting [img]https://clan.cloudflare.steamstatic.com/images//6625556/16aa101d6219672efbc41a118e0cb6934a5b9141.jpg[/img] and [img]https://clan.cloudflare.steamstatic.com/images//6625556/019c6a742ac0b8079d393640368fe31715d86c67.jpg[/img] into our wire formula [img]https://clan.cloudflare.steamstatic.com/images//6625556/9e88a6e1659f69f2e5a5c6b68d04ce48575f3c8e.jpg[/img], we can calculate two theoretical pole-wire-attachment coordinates [img]https://clan.cloudflare.steamstatic.com/images//6625556/1eeeea5ba505430c8f5b95fd4dec1beff600c347.jpg[/img] and [img]https://clan.cloudflare.steamstatic.com/images//6625556/017e6bd9b0b7a46f1cdc4fd3f3e7bc00a7776577.jpg[/img]. One will be above the front part and the other above the back of the bus:
[img]https://clan.cloudflare.steamstatic.com/images//6625556/e6db325362d00def9308e9dcc9072248b1614088.jpg[/img]
As the pole of a trolleybus is typically facing backwards, we need to find out which of the two positions is the correct one.
Haven’t had enough of vectors yet? Let’s define a few more:
[list][*] [img]https://clan.cloudflare.steamstatic.com/images//6625556/7fbbf4dac7bf5f15d321f13a681605d66095dc34.jpg[/img] - the direction vector of the bus (points into driving direction)
[*] [img]https://clan.cloudflare.steamstatic.com/images//6625556/9a2ee5a0834fdfd2ce2eedc8c8f3b4b306a30751.jpg[/img] - direction the pole would face if it was attached at [img]https://clan.cloudflare.steamstatic.com/images//6625556/1eeeea5ba505430c8f5b95fd4dec1beff600c347.jpg[/img] (points from [img]https://clan.cloudflare.steamstatic.com/images//6625556/24d1e1af1a80ba94f3f495534ba48067d22216c1.jpg[/img] to [img]https://clan.cloudflare.steamstatic.com/images//6625556/1eeeea5ba505430c8f5b95fd4dec1beff600c347.jpg[/img])
[*] [img]https://clan.cloudflare.steamstatic.com/images//6625556/1ed2a57527fc28089865c4f612c27368e98d1097.jpg[/img] - direction the pole would face if it was attached at [img]https://clan.cloudflare.steamstatic.com/images//6625556/017e6bd9b0b7a46f1cdc4fd3f3e7bc00a7776577.jpg[/img] (points from [img]https://clan.cloudflare.steamstatic.com/images//6625556/24d1e1af1a80ba94f3f495534ba48067d22216c1.jpg[/img] to [img]https://clan.cloudflare.steamstatic.com/images//6625556/017e6bd9b0b7a46f1cdc4fd3f3e7bc00a7776577.jpg[/img])[/list]
Using the [url=https://en.wikipedia.org/wiki/Dot_product]dot product[/url], we can easily find out if [img]https://clan.cloudflare.steamstatic.com/images//6625556/7fbbf4dac7bf5f15d321f13a681605d66095dc34.jpg[/img] and one of the pole vectors are facing into about the same direction (> 0) or the opposite direction (< 0).
We are specifically looking for the pole vector that faces in the opposite direction of [img]https://clan.cloudflare.steamstatic.com/images//6625556/7fbbf4dac7bf5f15d321f13a681605d66095dc34.jpg[/img], so our conditions would look like this:
[list][*] [img]https://clan.cloudflare.steamstatic.com/images//6625556/89d25351f584d1aed6f7f4a0f91ebd4d8696a0a3.jpg[/img] - If that condition is true, [img]https://clan.cloudflare.steamstatic.com/images//6625556/1eeeea5ba505430c8f5b95fd4dec1beff600c347.jpg[/img] is the correct pole-wire-attachment coordinate.
[*] [img]https://clan.cloudflare.steamstatic.com/images//6625556/b32eaa09322ca28b4a7ce0dfa7aa79d6bea85884.jpg[/img] - If that condition is true, [img]https://clan.cloudflare.steamstatic.com/images//6625556/017e6bd9b0b7a46f1cdc4fd3f3e7bc00a7776577.jpg[/img] is the correct pole-wire-attachment coordinate. [/list]
[h2]Rendering the Trolley Poles[/h2]
Uh, that was a lot of math! Now that we know where the pole is attached on the bus ([img]https://clan.cloudflare.steamstatic.com/images//6625556/24d1e1af1a80ba94f3f495534ba48067d22216c1.jpg[/img]) and where the pole is attached to the wire (either [img]https://clan.cloudflare.steamstatic.com/images//6625556/1eeeea5ba505430c8f5b95fd4dec1beff600c347.jpg[/img] or [img]https://clan.cloudflare.steamstatic.com/images//6625556/017e6bd9b0b7a46f1cdc4fd3f3e7bc00a7776577.jpg[/img]), it is possible to render the pole in the correct position and rotation.
As we learned, a trolleybus has two poles (otherwise the electrical circuit would be incomplete), so we will just repeat the same steps to draw the second pole.
And now you know what kind of stuff goes on behind the scenes to render the poles! Of course, in order to make trolleybuses realistic, this was just one small portion of the overall work that was needed!
[img]https://clan.cloudflare.steamstatic.com/images//6625556/113615c87efa36f0c4ece5bb90aa50322dad6d3e.jpg[/img]
[i]The last shift of the evening.[/i]
Once again, we've reached the end of a Dev Diary. We hope that you liked this insight into the development of Cities: Skylines and that we didn’t scare you with all the formulas! Gotta say, the end result is really mesmerizing. We could just watch the buses circle around for hours! What do you guys think about the trolleybuses?
Until next time, city-builders!
Your Colossal Order dev team