[gnome-maps/wip/mlundblad/transit-routing: 7/7] mapView: WIP, implement showing transit routes
- From: Marcus Lundblad <mlundblad src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gnome-maps/wip/mlundblad/transit-routing: 7/7] mapView: WIP, implement showing transit routes
- Date: Fri, 15 Jul 2016 10:57:13 +0000 (UTC)
commit 6594f00fb7ac8220e72c723304eb1aef73876311
Author: Marcus Lundblad <ml update uu se>
Date: Tue Mar 29 23:10:22 2016 +0200
mapView: WIP, implement showing transit routes
Also added functionallity to allow showing dynamically created
route layer segments, optionally using a dashed style.
This is used by transit routes to show walking and transit legs
of journeys.
src/mapView.js | 165 ++++++++++++++++++++++++++++++++++++++++++++++++++-----
1 files changed, 150 insertions(+), 15 deletions(-)
---
diff --git a/src/mapView.js b/src/mapView.js
index e8db3bb..089ece7 100644
--- a/src/mapView.js
+++ b/src/mapView.js
@@ -39,8 +39,12 @@ const Maps = imports.gi.GnomeMaps;
const MapWalker = imports.mapWalker;
const Place = imports.place;
const PlaceMarker = imports.placeMarker;
+const RouteQuery = imports.routeQuery;
const ShapeLayer = imports.shapeLayer;
const StoredRoute = imports.storedRoute;
+const TransitArrivalMarker = imports.transitArrivalMarker;
+const TransitBoardMarker = imports.transitBoardMarker;
+const TransitWalkMarker = imports.transitWalkMarker;
const TurnPointMarker = imports.turnPointMarker;
const UserLocationMarker = imports.userLocationMarker;
const Utils = imports.utils;
@@ -85,15 +89,21 @@ const MapView = new Lang.Class({
},
get routeVisible() {
- return this._routeLayer.visible || this._instructionMarkerLayer.visible;
+ return this._routeVisible || this._instructionMarkerLayer.visible;
},
set routeVisible(value) {
let isValid = Application.routeQuery.isValid();
- this._routeLayer.visible = value && isValid;
+ this._routeVisible = value && isValid;
+ this._routeLayers.forEach((function(routeLayer) {
+ Utils.debug('setting route layer visible: ' + (value && isValid));
+ routeLayer.visible = value && isValid;
+ }).bind(this));
this._instructionMarkerLayer.visible = value && isValid;
+ Utils.debug('after instructionMarkerLayer visible');
this.notify('routeVisible');
+ Utils.debug('after notify routeVisible');
},
_init: function(params) {
@@ -157,22 +167,49 @@ const MapView = new Lang.Class({
return view;
},
- _initLayers: function() {
- let strokeColor = new Clutter.Color({ red: 0,
- blue: 255,
- green: 0,
- alpha: 100 });
+ /* create and store a route layer, pass true to get a dashed line */
+ _createRouteLayer: function(dashed, lineColor) {
+ let red =
+ lineColor ? parseInt(lineColor.substring(0, 2), 16) : 0;
+ let green =
+ lineColor ? parseInt(lineColor.substring(2, 4), 16) : 0;
+ let blue =
+ lineColor ? parseInt(lineColor.substring(4, 6), 16) : 255;
+
+ let strokeColor = new Clutter.Color({ red: red,
+ blue: blue,
+ green: green,
+ alpha: 255 });
+ let routeLayer = new Champlain.PathLayer({ stroke_width: 5.0,
+ stroke_color: strokeColor });
+ if (dashed)
+ routeLayer.set_dash([5, 5]);
+
+ this._routeLayers.push(routeLayer);
+ this.view.add_layer(routeLayer);
+
+ return routeLayer;
+ },
+ _clearRouteLayers: function() {
+ Utils.debug('_clearRouteLayers');
+ this._routeLayers.forEach((function(routeLayer) {
+ Utils.debug('remove layer');
+ routeLayer.remove_all();
+ routeLayer.visible = false;
+ this.view.remove_layer(routeLayer);
+ }).bind(this));
+
+ Utils.debug('clear array');
+ this._routeLayers = [];
+ },
+
+ _initLayers: function() {
let mode = Champlain.SelectionMode.SINGLE;
this._userLocationLayer = new Champlain.MarkerLayer({ selection_mode: mode });
this.view.add_layer(this._userLocationLayer);
- this._routeLayer = new Champlain.PathLayer({ stroke_width: 5.0,
- stroke_color: strokeColor });
- this.view.add_layer(this._routeLayer);
-
-
this._placeLayer = new Champlain.MarkerLayer({ selection_mode: mode });
this.view.add_layer(this._placeLayer);
@@ -185,15 +222,35 @@ const MapView = new Lang.Class({
ShapeLayer.SUPPORTED_TYPES.push(GeoJSONShapeLayer.GeoJSONShapeLayer);
ShapeLayer.SUPPORTED_TYPES.push(KmlShapeLayer.KmlShapeLayer);
ShapeLayer.SUPPORTED_TYPES.push(GpxShapeLayer.GpxShapeLayer);
+
+ this._routeLayers = [];
+ },
+
+ _ensureInstructionLayerAboveRouteLayers: function() {
+ this.view.remove_layer(this._instructionMarkerLayer);
+ this.view.add_layer(this._instructionMarkerLayer);
},
_connectRouteSignals: function() {
let route = Application.routeService.route;
+ let transitPlan = Application.openTripPlanner.plan;
let query = Application.routeQuery;
route.connect('update', this.showRoute.bind(this, route));
route.connect('reset', (function() {
- this._routeLayer.remove_all();
+ this._clearRouteLayers();
+ this._instructionMarkerLayer.remove_all();
+ }).bind(this));
+ transitPlan.connect('update', this._showTransitPlan.bind(this, transitPlan));
+ transitPlan.connect('reset', (function() {
+ this._clearRouteLayers();
+ this._instructionMarkerLayer.remove_all();
+ }).bind(this));
+ transitPlan.connect('itinerary-selected', (function(obj, itinerary) {
+ this._showTransitItinerary(itinerary);
+ }).bind(this));
+ transitPlan.connect('itinerary-deselected', (function() {
+ this._clearRouteLayers();
this._instructionMarkerLayer.remove_all();
}).bind(this));
@@ -365,6 +422,8 @@ const MapView = new Lang.Class({
return;
}
+ Utils.debug('gotoBBox');
+
let [lat, lon] = bbox.get_center();
let place = new Place.Place({
location: new Location.Location({ latitude : lat,
@@ -375,6 +434,7 @@ const MapView = new Lang.Class({
right : bbox.right })
});
new MapWalker.MapWalker(place, this).goTo(true, linear);
+ Utils.debug('end gotoBBox');
},
showTurnPoint: function(turnPoint) {
@@ -452,12 +512,16 @@ const MapView = new Lang.Class({
},
showRoute: function(route) {
- this._routeLayer.remove_all();
+ let routeLayer;
+
+ this._clearRouteLayers();
this._placeLayer.remove_all();
+ routeLayer = this._createRouteLayer(false);
+ route.path.forEach(routeLayer.add_node.bind(routeLayer));
this.routeVisible = true;
- route.path.forEach(this._routeLayer.add_node.bind(this._routeLayer));
+ this._ensureInstructionLayerAboveRouteLayers();
this._showDestinationTurnpoints();
this.gotoBBox(route.bbox);
@@ -481,6 +545,77 @@ const MapView = new Lang.Class({
}, this);
},
+ _showTransitItinerary: function(itinerary) {
+ this.gotoBBox(itinerary.bbox);
+ this._clearRouteLayers();
+ this._placeLayer.remove_all();
+ this._instructionMarkerLayer.remove_all();
+
+ for (let index = 0; index < itinerary.legs.length; index++) {
+ let leg = itinerary.legs[index];
+ let dashed = !leg.transit;
+ let color = leg.color ? leg.color : '000000';
+ let routeLayer = this._createRouteLayer(dashed, color);
+
+ /* if this is a walking leg and not at the start, "stitch" it
+ * together with the end point of the previous leg, as the walk
+ * route might not reach all the way */
+ if (index > 0 && !leg.transit) {
+ let previousLeg = itinerary.legs[index - 1];
+ let lastPoint =
+ previousLeg.polyline[previousLeg.polyline.length - 1];
+
+ routeLayer.add_node(lastPoint);
+ }
+
+ leg.polyline.forEach(routeLayer.add_node.bind(routeLayer));
+
+ /* like above, "stitch" the route segment with the next one if it's
+ * a walking leg, and not the last one */
+ if (index < itinerary.legs.length - 1 && !leg.transit) {
+ let nextLeg = itinerary.legs[index + 1];
+ let firstPoint = nextLeg.polyline[0];
+
+ routeLayer.add_node(firstPoint);
+ }
+ }
+
+ this._ensureInstructionLayerAboveRouteLayers();
+
+ for (let index = 0; index < itinerary.legs.length; index++) {
+ let leg = itinerary.legs[index];
+ let previousLeg = index === 0 ? null : itinerary.legs[index - 1];
+
+ /* add start marker */
+ let startMarker;
+ if (!leg.transit) {
+ startMarker =
+ new TransitWalkMarker.TransitWalkMarker({ leg: leg,
+ previousLeg: previousLeg,
+ mapView: this });
+ } else {
+ startMarker =
+ new TransitBoardMarker.TransitBoardMarker({ leg: leg,
+ mapView: this});
+ }
+
+ this._instructionMarkerLayer.add_marker(startMarker);
+ }
+
+ /* add arrival marker */
+ let lastLeg = itinerary.legs[itinerary.legs.length - 1];
+ let arrivalMarker =
+ new TransitArrivalMarker.TransitArrivalMarker({ leg: lastLeg,
+ mapView: this });
+ this._instructionMarkerLayer.add_marker(arrivalMarker);
+
+ this.routeVisible = true;
+ },
+
+ _showTransitPlan: function(plan) {
+ this.gotoBBox(plan.bbox);
+ },
+
_onViewMoved: function() {
this.emit('view-moved');
if (this._storeId !== 0)
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]