dancingCycle
/
gtfs-rt-display
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: adjust Popup of msg marker

This commit is contained in:
dancingCycle 2022-09-19 15:50:06 +02:00
parent 0f32a6f090
commit dfcc6b4a50
3 changed files with 20 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/components/map/map.jsx
View File

@ -21,7 +21,7 @@ export default function Map({messages}) {
{
messages.map(function(value,key) {
//console.log(`key: ${key}, value: ${value}`);
return <MsgMarker key={key} index={key} location={value}/>;
return <MsgMarker key={key} index={key} message={value}/>;
})
}
</MapContainer>

10
app/components/map/marker-msg.jsx
View File

@ -2,7 +2,7 @@ import React from 'react';
import PropTypes from 'prop-types';
import {Marker,Popup} from 'react-leaflet';
import bfly from '../../assets/Logo_SIB_electricindigo.svg';
const MarkerMsg = ({ index,location }) => {
const MarkerMsg = ({ index,message }) => {
const iconBfly = new L.Icon({
iconUrl: bfly,
iconRetinaUrl: bfly,
@ -13,11 +13,13 @@ const MarkerMsg = ({ index,location }) => {
<>
<Marker
index={index}
position={[location.lat,location.lon]}
position={[message.lat,message.lon]}
icon={iconBfly}
>
<Popup>
Popup
route id: {message.routeId}
ts creation: {message.tsMsgCreation}
ts reception; {message.tsMsgReception}
</Popup>
</Marker>
</>
@ -28,5 +30,5 @@ export default MarkerMsg;
MarkerMsg.propTypes = {
index: PropTypes.number,
location: PropTypes.object
message: PropTypes.object
};

15
app/utils/gtfs-rt-utils.js
View File

@ -8,7 +8,14 @@ export default function parseMessages(buffer){
const messages = [];
const pbf = new Pbf(buffer);
const feed = FeedMessage.read(pbf);
let gtfs_realtime_version, incrementality, timestamp = null;
/*Version of the feed specification. The current version is 2.0.*/
let gtfs_realtime_version;
let incrementality;
/*This timestamp identifies the moment when the content of this feed has been created (in server time). In POSIX time (i.e., number of seconds since January 1st 1970 00:00:00 UTC). To avoid time skew between systems producing and consuming realtime information it is strongly advised to derive timestamp from a time server. It is completely acceptable to use Stratum 3 or even lower strata servers since time differences up to a couple of seconds are tolerable.*/
let timestamp = null;
if (feed.header) {
//console.log('getVehPos() header available');
gtfs_realtime_version=feed.header.gtfs_realtime_version;
@ -59,10 +66,14 @@ export default function parseMessages(buffer){
let lonFormed = longitude.toString().replace(/\.+$/, "");
lonFormed=charIntoString(lonFormed,lonFormed.length - 7,'.');
//console.log(`getVehPos() lonFormed:${lonFormed}`);
const now= new Date();
const message={
headerGtfsRealtimeVersion: gtfs_realtime_version === undefined ? -1 : parseInt(gtfs_realtime_version,10) || -2,
headerIncrementality: incrementality === undefined ? -1 : parseInt(incrementality,10) || -2,
headerTimestamp : timestamp === undefined ? -1 : parseInt(timestamp,10) || -2,
/*ts msg creation at server in s*/
tsMsgCreation: timestamp === undefined ? -1 : parseInt(timestamp,10) || -2,
/*ts msg reception at client in ms and convert to s*/
tsMsgReception: Math.floor(now.getTime() / 1000),
routeId: route_id === undefined ? -1 : parseInt(route_id,10) || -2,
lat: latFormed === undefined ? -360 : latFormed,
lon: lonFormed === undefined ? -720 : lonFormed,