New Features:

1. Implementing map using the results array from each location 2. Showing trace an latency with random colors New Pages: 1. trace-results.page.html Bugs Corrected: To Be Corrected: 0. On product delete, delete trace results 1. Get analytics from Ripe Service 2. Show in the Graph
juanfranciscocis · Jun 25, 2024 · c53bb03 · c53bb03
1 parent aa71e14
commit c53bb03
Show file tree

Hide file tree

Showing 8 changed files with 32 additions and 26 deletions.
diff --git a/src/app/pages/show-map-trace/show-map-trace.page.ts b/src/app/pages/show-map-trace/show-map-trace.page.ts
@@ -97,37 +97,41 @@ export class ShowMapTracePage implements OnInit {
           continue;
         }
       }
-      arrOfLatLong.push(latLong)
-    }
 
-    for (let data of arrOfLatLong){
-      antPath(data,
-        {color: '#FF0000', weight: 5, opacity: 0.6})
-        .addTo(this.map);
-    }
+      for (let data of this.ripeData){
+        let dest_lat = data.dst_latitude;
+        let dest_long = data.dst_longitude;
+        let src_lat = data.src_latitude;
+        let src_long = data.src_longitude;
 
+        if (dest_lat == 0 && dest_long == 0){
+          continue;
+        }
+        latLong.push([dest_lat, dest_long])
 
+        if (src_lat == 0 && src_long == 0){
+          continue;
+        }
+        // add src lat long to the beginning of the array
+        latLong.unshift([src_lat, src_long])
+      }
 
+      arrOfLatLong.push(latLong)
+    }
 
-/*    for (let data of this.ripeData) {
-      antPath([[data.src_latitude, data.src_longitude], [data.dst_latitude, data.dst_longitude]],
-        {color: '#FF0000', weight: 5, opacity: 0.6})
-        .addTo(this.map);
 
-      let labelIcon = Leaflet.divIcon({
-        className: 'label-icon',
-        html: `<div style="background-color: white; padding: 2px; border-radius: 3px; display: flex; justify-content: center; align-items: center; box-shadow: 0 0 5px 0 rgba(0,0,0,0.2);"><p style="color:black">Latency: ${data} ms</p></div>`,
-        iconSize: [200, 20] // size of the icon
-      })
+    console.log(arrOfLatLong)
 
-      // Add the label to the map at the desired coordinates
-      // @ts-ignore
-      const labelCoordinates: LatLngExpression = [(data.src_latitude + data.src_longitude) / 2, (data.dst_latitude + data.dst_longitude) / 2];
-      Leaflet.marker(labelCoordinates, {icon: labelIcon}).addTo(this.map!);
+    for (let data of arrOfLatLong){
 
+      //generate a random color
+      let randomColor = '#'+(Math.random()*0xFFFFFF<<0).toString(16);
 
-    }*/
 
+      antPath(data,
+        {color:randomColor, weight: 5, opacity: 0.6})
+        .addTo(this.map);
+    }
     await this.hideLoading()
   }
 

diff --git a/src/app/pages/show-map/show-map.page.ts b/src/app/pages/show-map/show-map.page.ts
@@ -83,8 +83,10 @@ export class ShowMapPage implements OnInit, OnDestroy{
 
 
     for (let data of this.ripeData) {
+      //generate a random color
+      let randomColor = '#'+(Math.random()*0xFFFFFF<<0).toString(16);
       antPath([[data.fromLatitude, data.fromLongitude], [data.toLatitude, data.toLongitude]],
-        {color: '#FF0000', weight: 5, opacity: 0.6})
+        {color:randomColor, weight: 5, opacity: 0.6})
         .addTo(this.map);
 
       let labelIcon = Leaflet.divIcon({

diff --git a/www/2051.5c9043987b8b1c6f.js b/www/2051.5c9043987b8b1c6f.js
diff --git a/www/2051.8dc23f3491505a39.js b/www/2051.8dc23f3491505a39.js
diff --git a/www/246.23bae9658c2419a4.js b/www/246.23bae9658c2419a4.js
diff --git a/www/246.3529a1972699a9dd.js b/www/246.3529a1972699a9dd.js
diff --git a/www/index.html b/www/index.html
@@ -21,6 +21,6 @@
 
 <body>
   <app-root></app-root>
-<script src="runtime.1104340dbcf07838.js" type="module"></script><script src="polyfills.e9ea84778c1ce49f.js" type="module"></script><script src="main.9fc22a67aa976cc8.js" type="module"></script></body>
+<script src="runtime.0b5c83f44d17ef66.js" type="module"></script><script src="polyfills.e9ea84778c1ce49f.js" type="module"></script><script src="main.9fc22a67aa976cc8.js" type="module"></script></body>
 
 </html>