Refactor draw_line

mapbox · Aug 16, 2016 · 4998566 · 4998566
1 parent e9ac1e5
commit 4998566
Show file tree

Hide file tree

Showing 2 changed files with 183 additions and 179 deletions.
diff --git a/debug/index.html b/debug/index.html
@@ -57,40 +57,72 @@
     container: 'map',
     zoom: 12.5,
     center: [-77.01866, 38.888],
-    style: 'mapbox://styles/mapbox/streets-v9',
+    style: {
+      "version": 8,
+      "metadata": {
+        "test": {
+          "height": 256
+        }
+      },
+      "center": [
+        -77.0305,
+        38.9014
+      ],
+      "zoom": 12.15,
+      "sources": {
+        "geojson": {
+          "type": "geojson",
+          "data": {
+            "type": "Feature",
+            "geometry": {
+              "type": "LineString",
+              "coordinates": [
+                [
+                  -80,
+                  38.910203
+                ],
+                [
+                  80,
+                  38.910321
+                ]
+              ]
+            },
+            "properties": {
+              "name": "P Street Northwest - Massachusetts Avenue Northwest"
+            }
+          }
+        }
+      },
+      "layers": [
+        {
+          "id": "background",
+          "type": "background",
+          "paint": {
+            "background-color": "#FFF"
+          }
+        },
+        {
+          "id": "line",
+          "type": "line",
+          "source": "geojson",
+          "paint": {
+            "line-color": "#000",
+            "line-dasharray": [
+              1,
+              1
+            ],
+            "line-width": 50
+          }
+        }
+      ]
+    },
     hash: true
 });
 
 map.addControl(new mapboxgl.Navigation());
 map.addControl(new mapboxgl.Geolocate());
 
 map.on('load', function() {
-    map.addSource('geojson', {
-        "type": "geojson",
-        "data": "mapbox-gl-test-suite/data/linestring.geojson"
-    });
-
-    map.addLayer({
-        "id": "route",
-        "type": "line",
-        "source": "geojson",
-        "paint": {
-            "line-color": "#EC8D8D",
-            "line-width": {
-                "base": 1.5,
-                "stops": [
-                    [
-                        5,
-                        0.75
-                    ],
-                    [
-                        18,
-                        32
-                    ]
-                ]
-            }
-        }
-    }, 'country-label-lg');
 
     var bufferTimes = {};
     map.on('tile.stats', function(bufferTimes) {