Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Adding an arrow to a Line with GeoJson #89

Open
asecondwill opened this issue Nov 2, 2018 · 0 comments
Open

Adding an arrow to a Line with GeoJson #89

asecondwill opened this issue Nov 2, 2018 · 0 comments

Comments

@asecondwill
Copy link

asecondwill commented Nov 2, 2018

Hi

I've got a line showing up with an arrow, but ny arrow points the wrong way. What have I done wrong?

Here is the geojson for the line:

{
          "type" => "Feature",
           "geometry" => {
               "type" => "Polygon",
               "coordinates" => [
                  [0] [
                    [0] [
                      [0] -2.642914,
                      [1] 51.502927
                    ],
                  [1] [
                    [0] -2.636177,
                    [1] 51.499918
                ]
            ]
        ]
    },
    "properties" => {
            :name => nil,
            :feature_type => "Annotation",
            :shape => "arrow",
            :popup_content => "Name: , ID: 69, FeatureType: Annotation, shape: arrow, radius: , start: [51.502927, -2.642914]",
             :style => {
                  :color => "Fuchsia",
                 :fillColor => "#1EB300",
                 :radius => 1,
                 :apacity => 1.0,
                :fillOpacity => 1,
                 :weight => 2,
                :clickable => true,
                :dashArray => "6,10",
                :lineJoin => "round"
          }
      }
}

And my onEachFeature:

  function onEachFeature(feature,layer){
	if(feature.properties.shape == 'arrow'){				
	  L.polylineDecorator(layer, {
            patterns: [
              {offset: '100%', repeat: 0, symbol: L.Symbol.arrowHead({pixelSize: 15, polygon: false, pathOptions: {stroke: true}})}
            ]
	  }).addTo(map);
	}
  }

The line gets drawn, with an arrow pointing the wrong way. It points out from the start point, where I want it to point out from the end point. Exactly like the example.js code from the repo.

I'm using polygon, because I couldn't get Polyline or Linestring to draw on the map.

What have I done wrong?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant