Trying to get Leaflet.Label plugin to work with Geojson polygons

95 views
Skip to first unread message

DaveF63

unread,
Dec 12, 2015, 4:07:32 PM12/12/15
to Leaflet
Hi

http://jsfiddle.net/ra6ynj5y/4/

I'm trying to get Leaflet.Label plugin to work with Geojson polygons & have run out of, limited, knowledge.

If you comment out the line: ' layer.bindLabel('I am a Polygon')' it should display the Geojson polygon & a dynamic label. As you can see it doesn't. It won't even work for the standard leaflet polygon.

I'm unsure what's wrong. Are my External Resources valid?

Cheers
Dave F.  

ghybs

unread,
Dec 15, 2015, 12:11:53 AM12/15/15
to Leaflet
Hi,

As for a regular HTML page, you just need to load Leaflet script before plugin scripts.
Within jsfiddle, add external resources in the insertion order, and make sure the order is similar to what you would do in your HTML page (top most is loaded first).

Updated jsfiddle: http://jsfiddle.net/ra6ynj5y/5/

Cheers

DaveF63

unread,
Dec 16, 2015, 5:21:14 PM12/16/15
to Leaflet
Thanks for the reply.

A bit of a newbie error!
Another that's got me confused is the new operator for L.GeoJson which appears dependent on alternative capitalisation! 

The more pressing point though, is it fails if I update leaflet to v1.0
http://jsfiddle.net/ra6ynj5y/6/

 I've looked on github for an explanation & there appears to be 2 versions to use:
The src folders in the master branch & leaflet-master, but both have empty leaflet.label.js files & there's a comment:
https://github.com/Leaflet/Leaflet.label/issues/121#issuecomment-136191535 about 'building js'

Do I really need to do that?

What am I meant to ref as the source?

Cheers, confusedly
Dave F.

ghybs

unread,
Dec 16, 2015, 6:02:44 PM12/16/15
to Leaflet
Hi,

As for "new" operator, Leaflet normally provides you with factories which should cover all cases where you would be tempted to use "new" with a constructor.
That is why you have factory "L.geoJson" but constructor "L.GeoJSON" (which you can avoid).

As for plugins compatibility with Leaflet version 1.0, as you figured out most of them need a different version as well.
Some of them use a different branch (in the case of Leaflet.label, it is called "leaflet-master"), whereas the "master" branch is kept for Leaflet stable (version 0.x).

In the case of Leaflet.label plugin, the JS file that you should use is built from the "src" folder, and normally available in the "dist" folder (together with the CSS file).
Note that you should avoid using the files from github.io for production, as there is no guarantee that they would be always available.
You should download them and serve them from your host server.

Now there is a common practice not to make available "dist" files directly on GitHub repository, as soon as "src" files and build process are available.
The rationale is that "dist" files would need to be updated with every commit, which makes the repository very big quickly.
The drawback is that they are no longer easily downloadable by developers who do not have access to a build environment (Node).

If you really need Leaflet.label with Leaflet 1.0, you should either look for someone who can build for you the dist file from leaflet-master branch (or who has already done so and can transfer to you), or install Node and learn the basics.

Good luck!
Reply all
Reply to author
Forward
0 new messages