Jiji
Well-Known Member
- First Name
- Rick
- Joined
- Jul 26, 2021
- Threads
- 24
- Messages
- 493
- Reaction score
- 641
- Location
- Finger Lakes
- Vehicles
- 2022 Mustang Mach-E GT 2024 F-150 Lightning
- Thread starter
- #46
So how nice would it be to have this for displaying a trip route?
I knew I needed to step up my game to have any sort of nice displays so I spent an hour with some iOS SwiftUI MapKit examples and you can see the result. Not much code at all, most of the time was spent searching the web for ideas.
So what you see there is a simulated trip from the Willow Glen Cafe to Tops Friendly Market. To draw this view I just needed to define the start and end points:
Next is to find the center of the map, just the average of the latitudes and longitudes:
Next we need to define the region of the map that will be displayed, don't want it to be too big or small, we just want it to comfortably contain the start and end points of the trip:
A scale factor of 1.0 will place the start and end points at the margin, the value of 1.5 seems nice to show some of the surrounding region without losing the trip route detail.
Finally the code that draws everything, including some custom car buttons to mark the start and end points:
And that is it, maybe 30 lines of code to create a map that contains a realistic view of a trip.
Seems too easy and so far it has been. But if I can pull the trip coordinates from my database using a query I can replace the simulated start/end points with those from an actual trip. InfluxDB has a Swift client and I have done queries in the past using the Python client so that part looks promising. The pulling the GPS track and overlaying it on the map completes the view, except it doesn't. Having other data like the SoC that pops up when a track point is selected would be just too much fun.
I knew I needed to step up my game to have any sort of nice displays so I spent an hour with some iOS SwiftUI MapKit examples and you can see the result. Not much code at all, most of the time was spent searching the web for ideas.
So what you see there is a simulated trip from the Willow Glen Cafe to Tops Friendly Market. To draw this view I just needed to define the start and end points:
Next is to find the center of the map, just the average of the latitudes and longitudes:
Next we need to define the region of the map that will be displayed, don't want it to be too big or small, we just want it to comfortably contain the start and end points of the trip:
A scale factor of 1.0 will place the start and end points at the margin, the value of 1.5 seems nice to show some of the surrounding region without losing the trip route detail.
Finally the code that draws everything, including some custom car buttons to mark the start and end points:
And that is it, maybe 30 lines of code to create a map that contains a realistic view of a trip.
Seems too easy and so far it has been. But if I can pull the trip coordinates from my database using a query I can replace the simulated start/end points with those from an actual trip. InfluxDB has a Swift client and I have done queries in the past using the Python client so that part looks promising. The pulling the GPS track and overlaying it on the map completes the view, except it doesn't. Having other data like the SoC that pops up when a track point is selected would be just too much fun.
Sponsored