--- a/client/src/bottlenecks/Bottlenecks.vue	Tue Oct 30 11:36:58 2018 +0100
+++ b/client/src/bottlenecks/Bottlenecks.vue	Tue Oct 30 12:01:53 2018 +0100
@@ -7,27 +7,34 @@
         <h4>Bottlenecks</h4>
         <hr class="mb-0">
         <input type="text" v-model="search" placeholder="Search Bottleneck..." class="border-0 w-100 p-2" />
-        <div class="row p-2 border-top">
+        <div class="row p-2 border-top text-left small">
             <div class="col-5">
                 <a href="#" @click="sortBy('name')" class="sort-link">Name</a>
                 <i :class="sortClass" v-if="sortColumn === 'name'"></i>
             </div>
-            <div class="col-5">
+            <div class="col-2">
                 <a href="#" @click="sortBy('latestMeasurement')" class="sort-link">Latest Measurement</a>
                 <i :class="sortClass" v-if="sortColumn === 'latestMeasurement'"></i>
             </div>
+            <div class="col-3">
+                <a href="#" @click="sortBy('chainage')" class="sort-link">Chainage</a>
+                <i :class="sortClass" v-if="sortColumn === 'chainage'"></i>
+            </div>
             <div class="col-2"></div>
         </div>
-        <div class="bottleneck-list">
+        <div class="bottleneck-list small text-left">
             <div v-for="bottleneck in filteredAndSortedBottlenecks()" :key="bottleneck.properties.name" class="border-top row mx-0 py-2">
                 <div class="col-5 text-left">
                     <a href="#" class="d-block" @click="moveToBottleneck(bottleneck)">
                         {{ bottleneck.properties.name }}
                     </a>
                 </div>
-                <div class="col-5">
+                <div class="col-2">
                     {{ displayCurrentSurvey(bottleneck) }}
                 </div>
+                <div class="col-3">
+                    {{ displayCurrentChainage(bottleneck) }}
+                </div>
                 <div class="col-2 text-right">
                     <button type="button" class="btn btn-sm btn-outline-secondary" @click="toggleBottleneck(bottleneck)">
                         <i class="fa fa-angle-down"></i>
@@ -101,14 +108,9 @@
   methods: {
     filteredAndSortedBottlenecks() {
       return this.bottlenecks.filter(bn => {
-        const foundInName = bn.properties.name
+        return bn.properties.name
           .toLowerCase()
           .includes(this.search.toLowerCase());
-        const latestMeasurement = (bn.properties.current || '');
-        const foundInLatestMeasurement = latestMeasurement
-          .substr(0, latestMeasurement.length - 1)
-          .includes(this.search.toLowerCase());
-        return foundInName || foundInLatestMeasurement;
       }).sort((bnA, bnB) => {
         switch (this.sortColumn) {
           case "name":
@@ -133,6 +135,13 @@
               return this.sortDirection === "ASC" ? 1 : -1;
             return 0;
 
+          case "chainage":
+            if (bnA.properties.from < bnB.properties.from)
+              return this.sortDirection === "ASC" ? -1 : 1;
+            if (bnA.properties.from > bnB.properties.from)
+              return this.sortDirection === "ASC" ? 1 : -1;
+            return 0;
+
           default:
             return 0;
         }
@@ -191,6 +200,9 @@
     displayCurrentSurvey(bottleneck) {
       const current = bottleneck.properties.current;
       return current ? current.substr(0, current.length - 1) : "";
+    },
+    displayCurrentChainage(bottleneck) {
+      return (bottleneck.properties.from / 10) + " - " + (bottleneck.properties.to / 10);
     }
   },
   mounted() {