diff --git a/dist/leaflet.polylineDecorator.js b/dist/leaflet.polylineDecorator.js index cb2fdee..b727a14 100644 --- a/dist/leaflet.polylineDecorator.js +++ b/dist/leaflet.polylineDecorator.js @@ -226,6 +226,7 @@ L$1.Symbol.ArrowHead = L$1.Class.extend({ polygon: true, pixelSize: 10, headAngle: 60, + angleCorrection: 0, pathOptions: { stroke: false, weight: 2 @@ -244,7 +245,7 @@ L$1.Symbol.ArrowHead = L$1.Class.extend({ _buildArrowPath: function _buildArrowPath(dirPoint, map) { var d2r = Math.PI / 180; var tipPoint = map.project(dirPoint.latLng); - var direction = -(dirPoint.heading - 90) * d2r; + var direction = -(dirPoint.heading - 90 + this.options.angleCorrection) * d2r; var radianArrowAngle = this.options.headAngle / 2 * d2r; var headAngle1 = direction + radianArrowAngle; diff --git a/example/example.js b/example/example.js index 6f3e55f..c706537 100644 --- a/example/example.js +++ b/example/example.js @@ -76,4 +76,14 @@ function init() { {offset: 25, repeat: 50, symbol: L.Symbol.arrowHead({pixelSize: 15, pathOptions: {fillOpacity: 1, weight: 0}})} ] }).addTo(map); + + // --- Example with an rotated arrow heads --- + var arrowRotatedCoords = [[ 50.955, -8.240 ], [ 41.083, -17.869 ]]; + var arrowRotatedLine = L.polyline(arrowRotatedCoords).addTo(map); + L.polylineDecorator(arrowRotatedLine, { + patterns: [ + {offset: 25, repeat: 50, symbol: L.Symbol.arrowHead({angleCorrection: 90, pixelSize: 15, pathOptions: {color: 'red', fillOpacity: 1, weight: 0}})}, + {offset: 25, repeat: 50, symbol: L.Symbol.arrowHead({angleCorrection: 270, pixelSize: 15, pathOptions: {color: 'blue', fillOpacity: 1, weight: 0}})} + ] + }).addTo(map); } diff --git a/src/L.Symbol.js b/src/L.Symbol.js index 24e9f41..1250e76 100644 --- a/src/L.Symbol.js +++ b/src/L.Symbol.js @@ -54,6 +54,7 @@ L.Symbol.ArrowHead = L.Class.extend({ polygon: true, pixelSize: 10, headAngle: 60, + angleCorrection: 0, pathOptions: { stroke: false, weight: 2 @@ -74,7 +75,7 @@ L.Symbol.ArrowHead = L.Class.extend({ _buildArrowPath: function (dirPoint, map) { const d2r = Math.PI / 180; const tipPoint = map.project(dirPoint.latLng); - const direction = (-(dirPoint.heading - 90)) * d2r; + const direction = (-(dirPoint.heading - 90 + this.options.angleCorrection)) * d2r; const radianArrowAngle = this.options.headAngle / 2 * d2r; const headAngle1 = direction + radianArrowAngle;