- Make icon inner space transparent

- Use array of fillId
- Make default icon consistent with other
- Use bare arrow for route markers

9 files changed, 192 insertions, 44 deletions

diff --git a/web/app/DeviceImages.js b/web/app/DeviceImages.js
index c79406b..d781b52 100644
--- a/web/app/DeviceImages.js
+++ b/web/app/DeviceImages.js
@@ -20,7 +20,7 @@ Ext.define('Traccar.DeviceImages', {
     singleton: true,
     
     getImageIcon: function(color, zoom, angle, category) {
-        var image, device, svg, width, height, rotateTransform, scaleTransform, transform;
+        var image, device, svg, width, height, rotateTransform, scaleTransform, transform, fill;
         // Get right image or fallback to default arrow
         if (category) {
             device = Ext.getStore('DeviceImages').findRecord('key', category);
@@ -36,7 +36,13 @@ Ext.define('Traccar.DeviceImages', {
         width = parseFloat(svg.documentElement.getAttribute('width'));
         height = parseFloat(svg.documentElement.getAttribute('height'));
         // Colorize
-        svg.getElementById(device.get('fillId')).style.fill = color;
+        fill = device.get('fillId');
+        if (!Ext.isArray(fill)) {
+            fill = [fill];
+        }
+        for (i = 0; i < fill.length; i++) {
+            svg.getElementById(fill[i]).style.fill = color;
+        }
         // Prepare rotate transformation
         rotateTransform = 'rotate(' + angle + ' ' + (width / 2) + ' ' + (height / 2) + ')';
         svg.getElementById(device.get('rotateId')).setAttribute('transform', rotateTransform);
diff --git a/web/app/store/DeviceImages.js b/web/app/store/DeviceImages.js
index e7ad4cb..ba91575 100644
--- a/web/app/store/DeviceImages.js
+++ b/web/app/store/DeviceImages.js
@@ -20,18 +20,26 @@ Ext.define('Traccar.store.DeviceImages', {
     fields: ['key', 'name', 'svg', 'fillId', 'rotateId', 'scaleId', 'scale'],
 
     data: [{
-        key: 'default',
+        key: 'route',
         name: Strings.categoryDefault,
-        svg: document.getElementById('arrowSvg').contentDocument,
+        svg: document.getElementById('routeSvg').contentDocument,
         fillId: 'arrow',
         rotateId: 'arrow',
         scaleId: 'arrow',
         scale: 1
     }, {
+        key: 'default',
+        name: Strings.categoryDefault,
+        svg: document.getElementById('defaultSvg').contentDocument,
+        fillId: ['arrow', 'path4148'],
+        rotateId: 'layer2',
+        scaleId: 'layer2',
+        scale: 1
+    }, {
         key: 'car',
         name: Strings.categoryCar,
         svg: document.getElementById('carSvg').contentDocument,
-        fillId: 'path4148',
+        fillId: ['path4148', 'path4157'],
         rotateId: 'path4148',
         scaleId: 'layer2',
         scale: 1
@@ -39,7 +47,7 @@ Ext.define('Traccar.store.DeviceImages', {
         key: 'bus',
         name: Strings.categoryBus,
         svg: document.getElementById('busSvg').contentDocument,
-        fillId: 'path4148',
+        fillId: ['path4148', 'path4200'],
         rotateId: 'path4148',
         scaleId: 'layer2',
         scale: 1
@@ -47,7 +55,7 @@ Ext.define('Traccar.store.DeviceImages', {
         key: 'truck',
         name: Strings.categoryTruck,
         svg: document.getElementById('truckSvg').contentDocument,
-        fillId: 'path4148',
+        fillId: ['path4148', 'path4336'],
         rotateId: 'path4148',
         scaleId: 'layer2',
         scale: 1
diff --git a/web/app/view/MapController.js b/web/app/view/MapController.js
index 2f72e81..a0e2867 100644
--- a/web/app/view/MapController.js
+++ b/web/app/view/MapController.js
@@ -305,7 +305,7 @@ Ext.define('Traccar.view.MapController', {
         if (deviceId !== undefined) {
             index = deviceId % Traccar.Style.mapRouteColor.length;
         }
-        return this.getMarkerStyle(false, Traccar.Style.mapRouteColor[index], angle);
+        return this.getMarkerStyle(false, Traccar.Style.mapRouteColor[index], angle, 'route');
     },
 
     resizeMarker: function (style, zoom) {
diff --git a/web/images/bus.svg b/web/images/bus.svg
index 2847eab..935d7b9 100644
--- a/web/images/bus.svg
+++ b/web/images/bus.svg
@@ -25,9 +25,9 @@
      borderopacity="1.0"
      inkscape:pageopacity="0.0"
      inkscape:pageshadow="2"
-     inkscape:zoom="7.9999999"
-     inkscape:cx="-4.2362527"
-     inkscape:cy="18.152102"
+     inkscape:zoom="16"
+     inkscape:cx="24.67596"
+     inkscape:cy="22.389227"
      inkscape:document-units="px"
      inkscape:current-layer="layer2"
      showgrid="false"
@@ -71,16 +71,36 @@
      id="layer2"
      inkscape:label="Layer 2">
     <path
-       style="opacity:1;fill:#ff5468;fill-opacity:1;stroke:#000000;stroke-width:1;stroke-miterlimit:4;stroke-dasharray:none"
-       d="M 42.046474,25 C 42.046474,34.414508 34.414508,42.046474 25,42.046474 15.585492,42.046474 7.9535258,34.414508 7.9535255,25 7.9535253,17.60606 12.661055,11.311623 19.242451,8.9503498 l 5.619408,-7.4180155 6.003402,7.4570729 C 37.390248,11.380441 42.046474,17.64646 42.046474,25 Z"
-       id="path4148"
-       inkscape:connector-curvature="0"
-       sodipodi:nodetypes="ssscccs" />
+       style="opacity:1;fill:#008000;fill-opacity:1;stroke:#000000;stroke-width:0.9;stroke-miterlimit:4;stroke-dasharray:none"
+       d="m 24.835938,15 c -2.029405,0.104367 -4.224031,0.194416 -5.955099,1.384579 -0.967027,0.625001 -0.992823,1.834875 -1.313127,2.824078 -0.634042,2.314087 -1.159315,4.692966 -1.065749,7.106185 -0.0078,1.92435 -0.01563,3.848699 -0.02345,5.773049 0.488281,-0.0013 0.976562,-0.0026 1.464843,-0.0039 0.06247,0.821104 -0.222941,1.763667 0.355267,2.45298 0.725171,0.850603 2.364263,0.385698 2.379597,-0.787667 0.01539,-0.547653 6.57e-4,-1.095919 0.0034,-1.643828 2.901042,-0.0039 5.802083,-0.0078 8.703125,-0.01172 0.04124,0.736959 -0.129081,1.507503 0.114137,2.214921 0.525411,1.082242 2.49727,0.850284 2.589362,-0.416067 0.01489,-0.602538 -0.0036,-1.205791 -0.0024,-1.80862 0.479167,0.002 0.958333,0.0039 1.4375,0.0059 -0.01716,-2.624357 0.02704,-5.250153 -0.03272,-7.87352 C 33.334549,21.925736 32.563956,19.744982 32.054629,17.52153 31.45137,16.048265 29.736634,15.607466 28.321878,15.325483 27.171936,15.117024 26.002455,15.037677 24.835938,15 Z"
+       id="path4200"
+       inkscape:connector-curvature="0" />
+    <path
+       style="opacity:1;fill:#f2f2f2;fill-opacity:1;stroke:#000000;stroke-width:0.9;stroke-miterlimit:4;stroke-dasharray:none"
+       d="m 28.615234,16.751953 c 0.419884,-0.0036 0.634905,0.382734 0.640625,0.771485 0.0057,0.38875 -0.198295,0.779803 -0.61914,0.783203 l -7.25,-0.03906 c -0.363434,-2.31e-4 -0.540727,-0.374859 -0.533203,-0.748047 0.0075,-0.373187 0.20013,-0.745337 0.574218,-0.742187 l 7.1875,-0.02539 z"
+       id="path4198" />
+    <path
+       style="opacity:1;fill:#008000;fill-opacity:1;stroke:#000000;stroke-width:0.9;stroke-miterlimit:4;stroke-dasharray:none"
+       d="m 30.064453,19.763672 c 0.367262,0.01971 0.556422,0.129342 0.662109,0.257812 0.105688,0.12847 0.128063,0.27555 0.164063,0.375 l 0.791016,3.763672 c -0.0052,0.350719 -0.09591,0.53281 -0.220703,0.644532 -0.124796,0.111721 -0.284137,0.152687 -0.431641,0.21875 l -12.011719,-0.01953 c -0.180791,-0.004 -0.334209,-0.05515 -0.445312,-0.183594 -0.111104,-0.128447 -0.179665,-0.333593 -0.1875,-0.646484 l 0.804687,-3.892578 c 0.08303,-0.192819 0.216257,-0.474296 0.730469,-0.509766 l 10.144531,-0.0078 z"
+       id="path4196" />
+    <path
+       style="opacity:1;fill:#f2f2f2;fill-opacity:1;stroke:#000000;stroke-width:0.9;stroke-miterlimit:4;stroke-dasharray:none"
+       d="m 30.699219,27.105469 c 0.678139,-0.01219 1.31348,0.51714 1.422706,1.186688 0.125573,0.631851 -0.238002,1.312303 -0.828117,1.56677 -0.586035,0.275196 -1.340663,0.09168 -1.733251,-0.423637 -0.418234,-0.509187 -0.407572,-1.306388 0.02181,-1.80562 0.270416,-0.329597 0.690327,-0.527309 1.116857,-0.524201 z"
+       id="path4194"
+       inkscape:connector-curvature="0" />
     <path
-       style="opacity:1;fill:#ffffff;fill-opacity:1;stroke:#000000;stroke-width:0.8434273;stroke-miterlimit:4;stroke-dasharray:none"
-       d="M 25,10.444761 C 16.961442,10.444954 10.444954,16.961442 10.444761,25 10.444954,33.038558 16.961442,39.555046 25,39.555239 33.038558,39.555046 39.555046,33.038558 39.555239,25 39.555046,16.961442 33.038558,10.444954 25,10.444761 Z m -0.164733,4.556013 0.0024,0 c 3.155084,0.0979 6.515016,0.567167 7.217613,2.520398 0.583475,2.537942 1.473743,4.963655 1.461405,7.532955 l 0.0071,7.036405 -1.437875,-0.0071 0.0094,1.656732 c 0.0036,1.678026 -2.685458,1.674435 -2.725136,0.02824 l 0.01412,-1.675559 -8.70255,0.01181 0.0047,1.475528 c 0.0035,1.863548 -2.688814,1.852016 -2.751022,0.01181 l 0.0071,-1.508474 -1.463761,0.0047 0.02824,-7.212904 c 0.150002,-2.626816 0.92017,-5.079313 1.543772,-7.476474 0.814705,-1.822141 3.854148,-2.309935 6.7846,-2.398025 z m 3.779421,1.750865 -7.187017,0.02589 c -0.748177,-0.0063 -0.767618,1.489368 -0.04075,1.489831 L 28.6366,18.3065 c 0.84169,-0.0068 0.817847,-1.561956 -0.02192,-1.554848 z m 1.449641,3.012147 -10.145131,0.0071 c -0.514212,0.03547 -0.646498,0.31785 -0.729527,0.510669 l -0.804832,3.892472 c 0.01567,0.625782 0.271458,0.822646 0.63304,0.830719 l 12.011308,0.01883 c 0.295009,-0.132124 0.641506,-0.162229 0.651867,-0.863667 l -0.790712,-3.763037 c -0.072,-0.198901 -0.09149,-0.593618 -0.826013,-0.633043 z m 0.635395,7.342429 c -0.799321,-4.68e-4 -1.447491,0.64454 -1.447287,1.440227 -2.04e-4,0.795688 0.647966,1.440697 1.447287,1.440228 0.798401,-8.25e-4 1.445138,-0.645454 1.444934,-1.440228 2.04e-4,-0.794772 -0.646533,-1.439401 -1.444934,-1.440227 z m -11.364148,0.0047 c -0.799321,-4.69e-4 -1.447491,0.644541 -1.447287,1.440228 -2.04e-4,0.795687 0.647966,1.440695 1.447287,1.440227 0.799321,4.68e-4 1.447492,-0.64454 1.447287,-1.440227 2.05e-4,-0.795687 -0.647966,-1.440697 -1.447287,-1.440228 z"
-       id="path4179"
-       inkscape:connector-curvature="0"
-       sodipodi:nodetypes="cccccccccccccccccccccccccccccccccccccccccccccc" />
+       style="opacity:1;fill:#f2f2f2;fill-opacity:1;stroke:#000000;stroke-width:0.9;stroke-miterlimit:4;stroke-dasharray:none"
+       d="m 19.335938,27.111328 c 0.665875,-0.01325 1.294092,0.494428 1.41792,1.149271 0.137989,0.617714 -0.191102,1.29637 -0.759018,1.574081 -0.583075,0.309284 -1.3635,0.149537 -1.775759,-0.366694 -0.429377,-0.499232 -0.440039,-1.296433 -0.02181,-1.80562 0.269487,-0.345034 0.700603,-0.554527 1.138662,-0.551038 z"
+       id="path4181"
+       inkscape:connector-curvature="0" />
+    <path
+       style="opacity:1;fill:#f2f2f2;fill-opacity:1;stroke:#000000;stroke-width:0.9;stroke-miterlimit:4;stroke-dasharray:none"
+       d="M 30.064453 19.763672 L 19.919922 19.771484 C 19.40571 19.806954 19.272482 20.088431 19.189453 20.28125 L 18.384766 24.173828 C 18.392601 24.486719 18.461162 24.691865 18.572266 24.820312 C 18.683369 24.94876 18.836787 24.99987 19.017578 25.003906 L 31.029297 25.023438 C 31.176801 24.957375 31.336142 24.916409 31.460938 24.804688 C 31.585733 24.692966 31.67646 24.510875 31.681641 24.160156 L 30.890625 20.396484 C 30.854625 20.297034 30.83225 20.149954 30.726562 20.021484 C 30.620875 19.893014 30.431715 19.783384 30.064453 19.763672 z "
+       id="path4185" />
+    <path
+       style="opacity:1;fill:#008000;fill-opacity:1;stroke:#000000;stroke-width:1;stroke-miterlimit:4;stroke-dasharray:none"
+       d="M 24.861328,1.5332031 C 22.988281,4.0058594 21.115235,6.4785156 19.242188,8.9511719 12.384811,11.305004 7.56648,18.411829 7.9656275,25.658945 8.1243699,33.146749 13.834,40.035153 21.150251,41.610345 28.126748,43.324765 35.941754,40.043911 39.57889,33.839327 43.471367,27.647386 42.664931,19.005572 37.705569,13.635688 35.848955,11.500603 33.373153,9.9676699 30.796754,8.9051796 28.818278,6.4478541 26.839803,3.9905286 24.861328,1.5332031 Z M 25,10.445312 C 31.718978,10.31196 38.025287,15.466156 39.259766,22.066406 40.645829,28.295943 37.349871,35.1464 31.626829,37.963035 25.868939,41.028841 18.176824,39.535013 13.993847,34.52613 9.5491383,29.57914 9.2593433,21.544158 13.337144,16.290647 16.025561,12.64863 20.469187,10.408583 25,10.445312 Z"
+       id="path4148"
+       inkscape:connector-curvature="0" />
   </g>
 </svg>
diff --git a/web/images/car.svg b/web/images/car.svg
index 0f56cc5..893078f 100644
--- a/web/images/car.svg
+++ b/web/images/car.svg
@@ -25,9 +25,9 @@
      borderopacity="1.0"
      inkscape:pageopacity="0.0"
      inkscape:pageshadow="2"
-     inkscape:zoom="32.000001"
-     inkscape:cx="28.992205"
-     inkscape:cy="19.572065"
+     inkscape:zoom="11.313709"
+     inkscape:cx="-6.1434451"
+     inkscape:cy="26.255618"
      inkscape:document-units="px"
      inkscape:current-layer="layer2"
      showgrid="false"
@@ -71,15 +71,28 @@
      id="layer2"
      inkscape:label="Layer 2">
     <path
-       style="opacity:1;fill:#ff5468;fill-opacity:1;stroke:#000000;stroke-width:0.90704989"
-       d="M 42.046474,25 C 42.046474,34.414508 34.414508,42.046474 25,42.046474 15.585492,42.046474 7.9535258,34.414508 7.9535255,25 7.9535253,17.60606 12.661055,11.311623 19.242451,8.9503498 l 5.619408,-7.4180155 6.003402,7.4570729 C 37.390248,11.380441 42.046474,17.64646 42.046474,25 Z"
-       id="path4148"
+       style="opacity:1;fill:#008000;fill-opacity:1;stroke:#000000;stroke-width:0.90704989"
+       d="m 21.134766,16.966797 c -1.38074,-0.02043 -2.662213,1.062691 -2.832936,2.436607 l -0.921698,3.89102 c -1.030864,0.02164 -2.1403,0.529554 -2.448528,1.549583 -0.08585,0.66913 -0.08614,1.388686 -0.07126,2.054772 l 0.01365,2.858336 1.189799,0.01566 0.001,1.548644 c 0.179748,2.389748 3.7531,2.12524 3.766748,0.02427 0.0066,-0.524033 0.005,-1.048171 0.0083,-1.572246 3.450521,-0.0072 6.901041,-0.01432 10.351562,-0.02148 0.05778,0.910442 -0.249011,1.970932 0.45243,2.704019 0.988358,1.038977 3.20042,0.602342 3.320249,-0.963432 0.02206,-0.570623 0.0053,-1.142204 0.01052,-1.713243 0.415365,-0.0059 0.830729,-0.01172 1.246094,-0.01758 l 0,-4.546875 c -0.147573,-1.134958 -1.234974,-1.904789 -2.342351,-1.843564 l -1.27093,-4.500186 C 31.138256,17.606118 29.783723,16.901333 28.479776,17.00525 Z"
+       id="path4157"
        inkscape:connector-curvature="0"
-       sodipodi:nodetypes="ssscccs" />
+       sodipodi:nodetypes="cccccccccccccccccccc" />
+    <path
+       style="opacity:1;fill:#f2f2f2;fill-opacity:1;stroke:#000000;stroke-width:0.90704989"
+       d="m 21.166016,19.529297 c 2.582682,0 5.165364,0 7.748046,0 0.466632,0.143466 0.391901,0.755072 0.553141,1.137183 0.241401,0.921069 0.482802,1.842139 0.724203,2.763208 -3.423177,0 -6.846354,0 -10.269531,0 0.318103,-1.254803 0.572247,-2.533108 0.930254,-3.773248 0.07632,-0.09232 0.201879,-0.116527 0.313887,-0.127143 z"
+       id="path4155" />
+    <path
+       style="opacity:1;fill:#f2f2f2;fill-opacity:1;stroke:#000000;stroke-width:0.90704989"
+       d="m 17.966797,24.964844 c 1.160497,-0.0485 2.007143,1.347083 1.435547,2.357422 -0.482677,1.078253 -2.151895,1.188153 -2.769532,0.179687 -0.742773,-1.0203 0.06301,-2.57906 1.333985,-2.537109 z"
+       id="path4138" />
     <path
-       style="opacity:1;fill:#ffffff;fill-opacity:1;stroke:#000000;stroke-width:0.60713017;stroke-miterlimit:4;stroke-dasharray:none"
-       d="M 25,10.33164 A 14.668712,14.668712 0 0 0 10.33164,25 14.668712,14.668712 0 0 0 25,39.66836 14.668712,14.668712 0 0 0 39.66836,25 14.668712,14.668712 0 0 0 25,10.33164 Z m -3.865712,6.635744 7.835774,0.04032 c 1.53138,0.145913 2.201745,0.919069 2.637222,1.864078 l 1.128883,4.49893 c 1.541149,-0.02204 2.241616,0.731963 2.485439,1.845106 l 0,4.546362 -1.247463,0.0166 0,1.501224 c 0.0043,2.349095 -3.798813,2.290352 -3.794564,-0.0095 l 0.01186,-1.517826 -10.352045,0.02135 -0.0047,1.460907 c 0.0074,2.412595 -3.843637,2.383667 -3.813536,-0.0047 l 0.02371,-1.444305 -1.052991,-0.0095 c -0.113588,0.0033 -0.213279,-0.01916 -0.213445,-0.237161 l 0.0072,-4.311572 c 0.36842,-1.045963 0.870527,-1.961458 2.549472,-1.845107 l 1.107538,-4.562963 c 0.252447,-0.737352 1.125378,-1.818866 2.691768,-1.852221 z m 0.03083,2.56133 c -0.180038,0.01554 -0.320307,0.07228 -0.362855,0.225302 l -0.879865,3.675983 10.269038,0 -0.93204,-3.555031 c -0.08363,-0.303493 -0.218321,-0.308551 -0.346254,-0.346254 l -7.748024,0 z m -3.199292,5.435712 a 1.6132596,1.6218878 0 0 0 -1.61506,1.622177 1.6132596,1.6218878 0 0 0 1.61506,1.622174 1.6132596,1.6218878 0 0 0 1.61269,-1.622174 1.6132596,1.6218878 0 0 0 -1.61269,-1.622177 z m 14.092061,0.0498 a 1.6132596,1.6218878 0 0 0 -1.612689,1.622175 1.6132596,1.6218878 0 0 0 1.612689,1.619805 1.6132596,1.6218878 0 0 0 1.61269,-1.619805 1.6132596,1.6218878 0 0 0 -1.61269,-1.622175 z"
-       id="path4179"
+       style="opacity:1;fill:#f2f2f2;fill-opacity:1;stroke:#000000;stroke-width:0.90704989"
+       d="m 32.058594,25.013672 c -0.766342,-0.01507 -1.475814,0.591834 -1.589844,1.347656 -0.153101,0.790611 0.37843,1.636985 1.160156,1.835938 0.770126,0.232914 1.6622,-0.218965 1.931641,-0.976563 0.306933,-0.743792 -0.04694,-1.678626 -0.771485,-2.029297 C 32.563971,25.07741 32.311423,25.0126 32.058594,25.013672 Z"
+       id="path4146"
+       inkscape:connector-curvature="0" />
+    <path
+       style="opacity:1;fill:#008000;fill-opacity:1;stroke:#000000;stroke-width:1;stroke-miterlimit:4;stroke-dasharray:none"
+       d="M 24.861328,1.5332031 C 22.988281,4.0058594 21.115235,6.4785156 19.242188,8.9511719 12.384811,11.305004 7.56648,18.411829 7.9656275,25.658945 8.1243699,33.146749 13.834,40.035153 21.150251,41.610345 27.989532,43.285719 35.647133,40.179534 39.361234,34.187995 43.421356,28.066366 42.795931,19.360483 37.916491,13.875765 36.03007,11.625208 33.474003,10.003272 30.796946,8.9054182 28.818406,6.4480132 26.839867,3.9906081 24.861328,1.5332031 Z M 25,10.332031 C 32.308131,10.16753 39.022437,16.25267 39.595703,23.535156 40.48381,30.788539 35.105845,38.081555 27.914062,39.375 20.786251,40.98485 12.992585,36.360512 10.986328,29.333984 8.6726776,22.401128 12.498474,14.188659 19.287109,11.490234 21.087914,10.727308 23.044264,10.329914 25,10.332031 Z"
+       id="path4148"
        inkscape:connector-curvature="0" />
   </g>
 </svg>
diff --git a/web/images/default.svg b/web/images/default.svg
new file mode 100644
index 0000000..b199135
--- /dev/null
+++ b/web/images/default.svg
@@ -0,0 +1,84 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="50"
+   height="50"
+   viewBox="0 0 50.000001 50.000001"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.91 r13725"
+   sodipodi:docname="default.svg">
+  <defs
+     id="defs4" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="11.313709"
+     inkscape:cx="1.1750604"
+     inkscape:cy="21.052061"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer2"
+     showgrid="false"
+     units="px"
+     inkscape:window-width="1920"
+     inkscape:window-height="981"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata7">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+        <cc:license
+           rdf:resource="http://creativecommons.org/licenses/by-sa/3.0/" />
+      </cc:Work>
+      <cc:License
+         rdf:about="http://creativecommons.org/licenses/by-sa/3.0/">
+        <cc:permits
+           rdf:resource="http://creativecommons.org/ns#Reproduction" />
+        <cc:permits
+           rdf:resource="http://creativecommons.org/ns#Distribution" />
+        <cc:requires
+           rdf:resource="http://creativecommons.org/ns#Notice" />
+        <cc:requires
+           rdf:resource="http://creativecommons.org/ns#Attribution" />
+        <cc:permits
+           rdf:resource="http://creativecommons.org/ns#DerivativeWorks" />
+        <cc:requires
+           rdf:resource="http://creativecommons.org/ns#ShareAlike" />
+      </cc:License>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="Layer 2">
+    <path
+       style="opacity:1;fill:#008000;fill-opacity:1;stroke:#000000;stroke-width:1;stroke-miterlimit:4;stroke-dasharray:none"
+       d="M 24.861328,1.5332031 C 22.988281,4.0058594 21.115235,6.4785156 19.242188,8.9511719 12.384811,11.305004 7.56648,18.411829 7.9656275,25.658945 8.1243699,33.146749 13.834,40.035153 21.150251,41.610345 27.989532,43.285719 35.647133,40.179534 39.361234,34.187995 43.421356,28.066366 42.795931,19.360483 37.916491,13.875765 36.03007,11.625208 33.474003,10.003272 30.796946,8.9054182 28.818406,6.4480132 26.839867,3.9906081 24.861328,1.5332031 Z M 25,10.332031 C 32.308131,10.16753 39.022437,16.25267 39.595703,23.535156 40.48381,30.788539 35.105845,38.081555 27.914062,39.375 20.786251,40.98485 12.992585,36.360512 10.986328,29.333984 8.6726776,22.401128 12.498474,14.188659 19.287109,11.490234 21.087914,10.727308 23.044264,10.329914 25,10.332031 Z"
+       id="path4148"
+       inkscape:connector-curvature="0" />
+    <polygon
+       transform="translate(11.748737,10.957319)"
+       id="arrow"
+       points="13,19 7,22 13,4 19,22 "
+       style="fill:#008000;stroke:#000000;stroke-width:1px" />
+  </g>
+</svg>
diff --git a/web/images/arrow.svg b/web/images/route.svg
index a85201d..a85201d 100644
--- a/web/images/arrow.svg
+++ b/web/images/route.svg
diff --git a/web/images/truck.svg b/web/images/truck.svg
index f9a34d4..e0026c3 100644
--- a/web/images/truck.svg
+++ b/web/images/truck.svg
@@ -26,8 +26,8 @@
      inkscape:pageopacity="0.0"
      inkscape:pageshadow="2"
      inkscape:zoom="16"
-     inkscape:cx="40.268129"
-     inkscape:cy="20.202497"
+     inkscape:cx="12.420548"
+     inkscape:cy="24.226399"
      inkscape:document-units="px"
      inkscape:current-layer="layer2"
      showgrid="false"
@@ -45,7 +45,7 @@
         <dc:format>image/svg+xml</dc:format>
         <dc:type
            rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
-        <dc:title></dc:title>
+        <dc:title />
         <cc:license
            rdf:resource="http://creativecommons.org/licenses/by-sa/3.0/" />
       </cc:Work>
@@ -72,15 +72,31 @@
      inkscape:label="Layer 2">
     <path
        style="opacity:1;fill:#ff5468;fill-opacity:1;stroke:#000000;stroke-width:0.90704989"
-       d="M 42.046474,25 C 42.046474,34.414508 34.414508,42.046474 25,42.046474 15.585492,42.046474 7.9535258,34.414508 7.9535255,25 7.9535253,17.60606 12.661055,11.311623 19.242451,8.9503498 l 5.619408,-7.4180155 6.003402,7.4570729 C 37.390248,11.380441 42.046474,17.64646 42.046474,25 Z"
-       id="path4148"
-       inkscape:connector-curvature="0"
-       sodipodi:nodetypes="ssscccs" />
+       d="M 30.316406 29.011719 C 30.032969 29.012099 29.77725 29.129922 29.591797 29.318359 C 29.406343 29.506797 29.292477 29.765616 29.292969 30.052734 C 29.293119 30.339392 29.406391 30.599146 29.591797 30.787109 C 29.777203 30.975073 30.033423 31.091416 30.316406 31.091797 C 30.599849 31.092075 30.857088 30.977075 31.042969 30.789062 C 31.228849 30.60105 31.343599 30.339859 31.34375 30.052734 C 31.344243 29.76515 31.228896 29.504892 31.042969 29.316406 C 30.857041 29.12792 30.600304 29.011439 30.316406 29.011719 z "
+       id="path4330" />
+    <path
+       style="opacity:1;fill:#008000;fill-opacity:1;stroke:#000000;stroke-width:0.90704989"
+       d="m 33.841797,17.199219 c -3.79362,0.0033 -7.587239,0.0065 -11.380859,0.0098 -0.69659,0.0028 -0.655606,0.76697 -0.635167,1.261258 0.0014,0.532055 0.0029,1.064109 0.0043,1.596164 -0.818995,0.03277 -1.654099,-0.08495 -2.459094,0.09178 -0.632659,0.315896 -1.044459,0.93882 -1.568543,1.403598 -0.56765,0.63639 -1.366187,1.150658 -1.603243,2.005594 -6.59e-4,1.659164 -0.0013,3.318328 -0.002,4.977492 -1.027034,-0.04909 -0.863853,1.622575 0.143695,1.365669 0.413039,0.0012 0.826078,0.0023 1.239117,0.0035 -0.100744,1.404697 0.999905,2.745148 2.412469,2.862533 1.463988,0.236545 3.041103,-0.817833 3.182341,-2.338018 -0.193618,-0.695013 0.435198,-0.483296 0.862971,-0.50858 1.154698,0.0032 2.309396,0.0063 3.464094,0.0095 -0.08973,1.41597 1.077973,2.71414 2.487157,2.80097 1.412682,0.199315 2.875611,-0.838574 3.031898,-2.283519 -0.189293,-0.741658 0.532546,-0.463074 0.971937,-0.547762 0.650835,-0.120978 0.531304,-0.853948 0.532032,-1.34246 -0.01093,-3.587977 -0.02186,-7.175954 -0.03278,-10.763931 0.0027,-0.357707 -0.302217,-0.611902 -0.650391,-0.603515 z"
+       id="path4336"
+       inkscape:connector-curvature="0" />
+    <path
+       style="opacity:1;fill:#f2f2f2;fill-opacity:1;stroke:#000000;stroke-width:0.90704989"
+       d="m 20.369141,21.662109 1.46875,0 -0.02734,2.617188 -3.869141,0.03906 -0.0059,-0.52539 2.433594,-2.13086 z"
+       id="path4334" />
     <path
-       style="opacity:1;fill:#ffffff;fill-opacity:1;stroke:#000000;stroke-width:0.84430718;stroke-miterlimit:4;stroke-dasharray:none"
-       d="M 25,10.429576 C 16.953056,10.429769 10.429769,16.953056 10.429576,25 10.429769,33.046944 16.953056,39.570231 25,39.570424 33.046944,39.570231 39.570231,33.046944 39.570424,25 39.570231,16.953056 33.046944,10.429769 25,10.429576 Z m 8.841196,6.770477 c 0.460634,0.02953 0.622705,0.267803 0.650193,0.603076 l 0.03534,11.540907 c -0.07256,0.299323 -0.236494,0.572403 -0.69024,0.579519 l -0.770337,0.01885 c -0.07661,3.844781 -5.58244,3.657007 -5.564323,-0.0025 l -4.29221,-0.01183 c 0.0137,3.807627 -5.659897,3.856665 -5.630285,-0.01413 l -1.394615,-0.0047 c -0.958858,0.01435 -0.940133,-1.339998 0.01182,-1.363989 l 0.0025,-5.029565 c 0,0 0.03734,-0.309502 0.55596,-0.904614 l 2.108412,-2.113124 c 0.192955,-0.194626 0.404056,-0.415465 1.144904,-0.433461 l 1.821009,0.0025 -0.0047,-2.167306 c 0.02174,-0.279544 0.07758,-0.641486 0.636056,-0.69024 z m -13.472636,4.461824 -2.433508,2.13197 0.0071,0.525336 3.868171,-0.04004 0.02827,-2.617258 z m 0.02356,7.293457 c -0.565965,7.6e-4 -1.024459,0.465576 -1.02476,1.038894 3.01e-4,0.573318 0.458795,1.038134 1.02476,1.038894 0.566886,5.56e-4 1.026813,-0.464646 1.027115,-1.038894 -3.02e-4,-0.574249 -0.460229,-1.03945 -1.027115,-1.038894 z m 9.92485,0.05653 c -0.566874,7.61e-4 -1.025743,0.467012 -1.024759,1.041249 3.01e-4,0.573316 0.458793,1.038133 1.024759,1.038894 0.566885,5.57e-4 1.026813,-0.464645 1.027115,-1.038894 9.85e-4,-0.575169 -0.45932,-1.041808 -1.027115,-1.041249 z"
-       id="path4179"
-       inkscape:connector-curvature="0"
-       sodipodi:nodetypes="ccccccccccccccccccccccccccccccccccccccc" />
+       style="opacity:1;fill:#f2f2f2;fill-opacity:1;stroke:#000000;stroke-width:0.90704989"
+       d="m 20.392578,28.955078 c 0.495617,-0.01 0.949054,0.392744 1.015279,0.880782 0.08326,0.480935 -0.222962,0.990466 -0.686539,1.142734 -0.433519,0.157426 -0.953792,-0.03157 -1.192133,-0.42471 -0.264966,-0.402656 -0.196351,-0.982659 0.156372,-1.311528 0.187059,-0.182377 0.44554,-0.288296 0.707021,-0.287278 z"
+       id="path4322"
+       inkscape:connector-curvature="0" />
+    <path
+       style="opacity:1;fill:#f2f2f2;fill-opacity:1;stroke:#000000;stroke-width:0.90704989"
+       d="m 30.316406,29.011719 c 0.478158,-0.0097 0.92095,0.363157 1.006701,0.831145 0.100881,0.459837 -0.150196,0.969495 -0.58392,1.158109 -0.416503,0.197732 -0.954004,0.0628 -1.228859,-0.307059 -0.31121,-0.389351 -0.284147,-1.000054 0.06429,-1.357684 0.189169,-0.203633 0.463259,-0.325919 0.741784,-0.324511 z"
+       id="path4328"
+       inkscape:connector-curvature="0" />
+    <path
+       style="opacity:1;fill:#008000;fill-opacity:1;stroke:#000000;stroke-width:1;stroke-miterlimit:4;stroke-dasharray:none"
+       d="M 24.861328,1.5332031 C 22.988281,4.0058594 21.115235,6.4785156 19.242188,8.9511719 12.384811,11.305004 7.56648,18.411829 7.9656275,25.658945 8.1243699,33.146749 13.834,40.035153 21.150251,41.610345 27.989532,43.285719 35.647133,40.179534 39.361234,34.187995 43.421356,28.066366 42.795931,19.360483 37.916491,13.875765 36.03007,11.625208 33.474003,10.003272 30.796946,8.9054182 28.818406,6.4480132 26.839867,3.9906081 24.861328,1.5332031 Z M 25,10.429688 c 6.598201,-0.123185 12.819493,4.830867 14.196406,11.280617 1.543338,6.202211 -1.588945,13.143604 -7.251063,16.101735 -5.688194,3.206782 -13.425166,1.899164 -17.73054,-3.015306 C 9.647006,29.954251 9.1668508,21.921033 13.117741,16.56535 15.789672,12.756758 20.34357,10.392898 25,10.429688 Z"
+       id="path4148"
+       inkscape:connector-curvature="0" />
   </g>
 </svg>
diff --git a/web/load.js b/web/load.js
index 7f0caf9..7f5c62c 100644
--- a/web/load.js
+++ b/web/load.js
@@ -130,7 +130,8 @@
     addStyleFile('app.css');
     //addScriptFile('arrow.js');
     
-    addSvgFile('images/arrow.svg', 'arrowSvg');
+    addSvgFile('images/default.svg', 'defaultSvg');
+    addSvgFile('images/route.svg', 'routeSvg');
     addSvgFile('images/car.svg', 'carSvg');
     addSvgFile('images/bus.svg', 'busSvg');
     addSvgFile('images/truck.svg', 'truckSvg');