feat: 增加路径箭头 demo

examples/line/path/demo/arrow.js

@@ -0,0 +1,139 @@
+import {
+  Scene,
+  LineLayer,
+  PointLayer
+} from '@antv/l7';
+import {
+  GaodeMap
+} from '@antv/l7-maps';
+
+const scene = new Scene({
+  id: 'map',
+  map: new GaodeMap({
+    center: [ 120.15, 30.3 ],
+    zoom: 10,
+    style: 'light'
+  })
+});
+
+const pointLayer = new PointLayer()
+.source([{lng: 120.155, lat: 30.31}], {
+  parser: {
+    type: "json",
+    x: 'lng',
+    y: 'lat'
+  }
+})
+.shape('circle')
+.size(6000)
+.color('#f00')
+.animate(true)
+.style({
+  unit: 'meter'
+})
+const lineLayer = new LineLayer({})
+.source({
+  "type": "FeatureCollection",
+  "features": [
+    {
+      "type": "Feature",
+      "properties": {},
+      "geometry": {
+        "type": "LineString",
+        "coordinates": [
+          [
+            120.18630981445312,
+            30.321915039121063
+          ],
+          [
+            120.34011840820312,
+            30.434465946142005
+          ]
+        ]
+      }
+    },
+    {
+      "type": "Feature",
+      "properties": {},
+      "geometry": {
+        "type": "LineString",
+        "coordinates": [
+          [
+            120.19660949707033,
+            30.298796461361665
+          ],
+          [
+            120.31883239746092,
+            30.28041626667403
+          ]
+        ]
+      }
+    },
+    {
+      "type": "Feature",
+      "properties": {},
+      "geometry": {
+        "type": "LineString",
+        "coordinates": [
+          [
+            120.12245178222656,
+            30.29523927312319
+          ],
+          [
+            120.01808166503906,
+            30.261439550638762
+          ]
+        ]
+      }
+    },
+    {
+      "type": "Feature",
+      "properties": {},
+      "geometry": {
+        "type": "LineString",
+        "coordinates": [
+          [
+            120.15609741210938,
+            30.285159872426014
+          ],
+          [
+            120.14923095703124,
+            30.20626765511821
+          ]
+        ]
+      }
+    },
+    {
+      "type": "Feature",
+      "properties": {},
+      "geometry": {
+        "type": "LineString",
+        "coordinates": [
+          [
+            120.10940551757812,
+            30.320136880604423
+          ],
+          [
+            120.01327514648438,
+            30.362803774813028
+          ]
+        ]
+      }
+    }
+  ]
+}
+)
+.size(1.5)
+.shape('line')
+.style({
+  arrow: {
+    enable: true,
+    arrowWidth: 4,
+    arrowHeight: 6
+  }
+})
+.color('#f00');
+scene.on('loaded', () => {
+  scene.addLayer(pointLayer);
+  scene.addLayer(lineLayer);
+});

examples/line/path/demo/meta.json

@@ -33,6 +33,11 @@
       "filename": "road_dark_dash.js",
       "title": "路径虚线",
       "screenshot":"https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*vZFUTaBCGoEAAAAAAAAAAAAAARQnAQ"
+    },
+    {
+      "filename": "arrow.js",
+      "title": "箭头路径",
+      "screenshot":"https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*vZFUTaBCGoEAAAAAAAAAAAAAARQnAQ"
     }
   ]
 }