Trafficmaps

shgmongohh

Thanks for the little tutorial!
Could you please explain, with which module do you calculating the current time to your work and mom?

Sebastian

strawberry 3.141

@shgmongohh [card:SamLewis0602/MMM-Traffic]

Notumlord

@strawberry-3.141 said in Trafficmaps:

@shgmongohh [card:SamLewis0602/MMM-Traffic]

Hijacking this thread since i cant find one specific for MMM-Traffic.

I can only get the “driving” mode to work with MMM-Traffic, if i anything else it’s stuck on Loading Commute.
Anyone else have this issue?

strawberry 3.141

@Notumlord if the author is not registered in this forum, then the best way would be to open an issue on github https://github.com/SamLewis0602/MMM-Traffic/issues

Mitchfarino

@Notumlord @strawberry-3-141

I have these two working fine for me in my config

	{
		module: 'MMM-Traffic',
		position: 'bottom_right',
		classes: 'dimmed medium', //optional, default is 'bright medium', only applies to commute info not route_name
		config: {
			api_key: '',
			mode: 'bicycling',
			origin: 'my origin',
			destination: 'my destination',
			route_name: 'Home to Work',
			changeColor: true,
			showGreen: false,
			limitYellow: 5, //Greater than 5% of journey time due to traffic
			limitRed: 20, //Greater than 20% of journey time due to traffic
			traffic_model: 'pessimistic',
			interval: 120000 //2 minutes
		}
	},
	{
		module: 'MMM-Traffic',
		position: 'bottom_right',
		classes: 'dimmed medium', //optional, default is 'bright medium', only applies to commute info not route_name
		config: {
			api_key: '',
			mode: 'driving',
			origin: 'my origin',
			destination: 'my destination',
			route_name: 'Home to Work',
			changeColor: true,
			showGreen: false,
			limitYellow: 5, //Greater than 5% of journey time due to traffic
			limitRed: 20, //Greater than 20% of journey time due to traffic
			traffic_model: 'pessimistic',
			interval: 120000 //2 minutes
		}
	},

Notumlord

@Mitchfarino
Strange, do you use the exact same origin/destination for both modules or do you format them differently depending on the mode?

Mitchfarino

@Notumlord exactly the same origin and destination, using my postcode for home as the origin and postcode for work as the destination

If you want to share your sample config, I can put it in my mirror to see if it works

wscheer

Hey All,
I’ve been tinkering around with the Bing Traffic maps a little more. I made it a bit more customizable but I’m having an issue where the map never refreshes.

I’ve tried calling updateDom() but that does not seem to do anything. I also tried setting the wrapper to ’ ’ before it is set to the bing url path.

Any ideas?

Module.register("maproute", {
        defaults: {
                latitude: '40.4406', // city latitude
                longitude: '-79.9959', // city longitude
                map_zoom: '12', // 1 - 21
                map_layer: 'TrafficFlow', 
                map_size: '500', // using this for both length and width
                api_key: '1234567890', //  your bing maps api key
                updateInterval: 300000 // 5 mins
        },
        getDom: function() {
                var wrapper = ''; // tried setting this to blank to see if that would clear out the old image
                wrapper = document.createElement("img");
                // create the url using the custom parameters
                wrapper.src = "http://dev.virtualearth.net/REST/v1/Imagery/Map/Road/" + this.config.latitude + "," + this.config.longitude + "/" + this.config.map_zoom + "?mapSize=" + this.config.map_size + "," + this.config.map_size + "&ml=" + this.config.map_layer + "&key=" + this.config.map_key;
                return wrapper;
        },
	start: function() {
		var self = this;
		setInterval(function() {
			self.updateDom(); // no speed defined, so it updates instantly.
		}, this.config.updateInterval);
	},
});

strawberry 3.141

@wscheer Quote from the readme Whenever your module need to be updated, call the updateDom(speed) method. It requests the MagicMirror core to update it's dom object. If you define the speed, the content update will be animated, but only if the content will realy change. So i guess your html looks all the time the same, so there is probably no real update of the dom. I suggest to try to add an timestamp somewhere and see if it gets updated then

wscheer

@strawberry-3-141 Ding! Ding! Ding! That was it! THANK YOU!

Also thanks again to @alexyak and @tyho for their input.

I’ll post the code for anyone who wants Bing Traffic maps on their Magic Mirror.

It’s a little hackish but maybe someone will come along and write it the correct way. Basically I’m taking the pushpin (pp) parameter and just assigning two random numbers to it. Math.random() creates a number between 0 and 1. So the map never shows the pushpin on the area I’m at. This causes the information to be “new” so when updateDom() is called, the info has changed.

For any beginners, here is my file structure setup:
The code below is located: /var/www/html/MagicMirror/modules/maproute/maproute.js

Module.register("maproute", {
        defaults: {
                latitude: '40.4406', // City latitude. Use google to get these coordinates
                longitude: '-79.9959', // City longitude
                map_zoom: '12', // 1 - 21
                map_layer: 'TrafficFlow', 
                map_size: '500', // Using this for both length and width
                api_key: '123456789', // Your Bing maps api key
                updateInterval: 300000 // 5 min refresh
        },
        getDom: function() {
                var wrapper = '';
                wrapper = document.createElement("img");
                // The Math.random() calls are to place a random pushpin on the map and make the updateDom() call refresh
                wrapper.src = "http://dev.virtualearth.net/REST/v1/Imagery/Map/Road/" + this.config.latitude + "," + this.config.longitude + "/" + this.config.map_zoom + "?mapSize=" + this.config.map_size + "," + this.config.map_size + "&pp=" + Math.random() + "," + Math.random() + "&ml=" + this.config.map_layer + "&key=" + this.config.map_key;
                return wrapper;
        },
	start: function() {
		var self = this;
		setInterval(function() {
			self.updateDom(5000); // I set a 5 second refresh here for testing.
		}, this.config.updateInterval);
	},
});