Merge pull request #56 from forensic-architecture/hot-fix/map-snappiness

Hot fix: map snappiness

src/components/Map.jsx

@@ -39,8 +39,8 @@ class Map extends React.Component {
       // Fly to first  of events selected
       const eventPoint = (nextProps.app.selected.length > 0) ? nextProps.app.selected[0] : null;
 
-      if (eventPoint.latitude && eventPoint.longitude) {
-        this.map.flyTo([eventPoint.latitude, eventPoint.longitude]);
+      if (eventPoint !== null && eventPoint.latitude && eventPoint.longitude) {
+        this.map.setView([eventPoint.latitude, eventPoint.longitude]);
       }
     }
   }  

src/components/MapEvents.jsx

@@ -46,7 +46,6 @@ class MapEvents extends React.Component {
       <g
         className="location"
         transform={`translate(${x}, ${y})`}
-        style={{ transition: 'transform 0.1s' }}
       >
         {Object.keys(eventsByCategory).map(cat => {
           return this.renderCategory(eventsByCategory[cat], cat)

src/components/MapSelectedEvents.jsx

@@ -13,7 +13,6 @@ class MapSelectedEvents extends React.Component {
 
   renderMarker (event) {
     const { x, y } = this.projectPoint([event.latitude, event.longitude]);
-    console.log(x, y)
     return (
       <g
         className="location-marker"

src/scss/map.scss

@@ -59,7 +59,6 @@
     font-family: 'Lato', Helvetica, sans-serif;
     border: rgba($black,0.6);
     letter-spacing: 0.05em;
-    transition: transform 0.1s;
 
     &::before {
       border-top-color: rgba($black,0.6);
@@ -169,12 +168,9 @@
 .location-event-marker {
   fill: $event_default;
   stroke-width: 0;
-  transition: 0.2s ease;
-  /*fill-opacity: 0.8;*/
   cursor: pointer;
 
   &:hover {
-    transition: 0.2s ease;
     fill-opacity: 1;
   }
 }