add traffic layer

[unrzn0]

Hi,

great widget, and already using the Javascipt API of Google Maps which is more extensible than the iframe embedding API. I want to use this for looking at the traffic easily from my tablet before leaving my home, so here's a simple patch for that (sorry, no git patch, just plain old diff).

Maybe you can add it so that I don't need to patch any updated version.

Cheers, -Stefan

====

--- map.html.1  2016-12-28 10:24:06.344123134 +1030
+++ map.html    2016-12-28 09:46:18.753031542 +1030
@@ -28,6 +28,7 @@
             "SATELLITE":        {"en": "Satellite",             "de": "Satellit",               "ru": "Спутник"},
             "HYBRID":           {"en": "Hybrid",                "de": "Hybrid",                 "ru": "Гибридная"},
             "TERRAIN":          {"en": "Terrain",               "de": "Gelände",                "ru": "Местность"},
+            "traffic":          {"en": "Traffic",               "de": "Verkehrslage",           "ru": "???"},
             "mapTypeId":        {"en": "Map type",              "de": "Kertentyp",              "ru": "Тип карты"},
             "noZoomAndPan":     {"en": "No zoom",               "de": "Kein Zoom",              "ru": "Без зума"},
             "apiKey":           {"en": "Google API Key",        "de": "Google API Schlüssel",   "ru": "Google API ключ"},
@@ -300,6 +301,10 @@
                     panControl:             !options.noZoomAndPan
                 });

+                if(!!options.traffic) {
+                    var trafficLayer = new google.maps.TrafficLayer();
+                    trafficLayer.setMap(map);
+                }
                 var $div = $(divElem);
                 $div.css('border-radius', $div.parent().css('border-radius'));

@@ -359,7 +364,8 @@
                 var options = {
                     mapTypeId:      google.maps.MapTypeId[data.mapTypeId || 'ROADMAP'],
                     hideControls:   data.hideControls || false,
-                    noZoomAndPan:   data.noZoomAndPan || false
+                    noZoomAndPan:   data.noZoomAndPan || false,
+                    traffic:        data.traffic || false
                 };
                 var markers = [];

@@ -455,10 +461,10 @@
         data-vis-type="map"
         data-vis-update-style="true"
         data-vis-prev='<img src="widgets/map/img/Prev_tplGoogleMap.png"></img>'
-        data-vis-attrs="mCount[1]/number,1,20,1;maxZoom[14]/slider,0,30,1;mapTypeId/select,ROADMAP,SATELLITE,HYBRID,TERRAIN;hideControls/checkbox;noZoomAndPan/checkbox;apiKey//onIdChanged;"
+        data-vis-attrs="mCount[1]/number,1,20,1;maxZoom[14]/slider,0,30,1;mapTypeId/select,ROADMAP,SATELLITE,HYBRID,TERRAIN;hideControls/checkbox;noZoomAndPan/checkbox;traffic/checkbox;apiKey//onIdChanged;"
         data-vis-attrs0="group.markers/byindex;markersLon-oid(1-mCount)/id,gps;markersLat-oid(1-mCount)/id,gps;markersImage(1-mCount)/image;markersWidth(1-mCount)/slider,1,100,1;markersHeight(1-mCount)/slider,1,100,1;markersOffsetX(1-mCount)/slider,1,100,1;markersOffsetY(1-mCount)/slider,1,100,1;markersText(1-mCount);markersLabel(1-mCount);markersOpacity(1-mCount)/slider,0,1,0.05;"
 >
     <div class="vis-widget <%== this.data.attr('class') %>" style="overflow: hidden; width: 200px; height: 200px;background-color: none !important" id="<%= this.data.attr('wid') %>">
         <div class="vis-widget-body" id="map_<%= this.data.attr('wid') %>" <%= (el) -> vis.binds.map.googleMap.init(el, this.view, this.data) %>></div>
     </div>
-</script>
\ No newline at end of file
+</script>

[GermanBluefox]

I missed this issue. You can easily create pull request and I will with a great pleasure accept it.

[GermanBluefox]

?

[unrzn0]

Hasn’t this been added by you already? We could close it.