TypeError: Cannot read property 'style' of undefined

[ToHold]

Hello,
Nice work!!! This is a really cool component !
But with Leaflet 1.3.1, i got an issue, can you help me ?

This is what my google console show me :
https://image.noelshack.com/fichiers/2018/20/4/1526566662-scene-1-2018-05-17-16-15-14.jpg

[xmikedanielsx]

@ToHold - the author of this plugin obviously abandoned it. Which is why I find it interesting that Leaflet still keeps it on their site even though it's completely broken with the new leaflet.

However, not to fear a colleague of mine and myself have been working the last several days getting it migrated over to leaflet 1.5.x ..

We have a prelim version working. Once we're done we will fork this repo and create our own. to Provide a working copy of this (with more documentation!!! and more functionality).

[w8r]

@ToHold fixed

@xmikedanielsx migrating it to leaflet@1.x was about 20 minutes. I never had much push for that, and I somehow missed this ticket (I have a lot of public repositories). Please refrain from bitter messages like that, instead you can always fork the repo and make a PR.

Excited to see the new functionality you were working on!

[w8r]

[xmikedanielsx]

@w8r -- please understand my comment was not meant in any means to be "bitter". I was really impressed with this plugin and truly do love the work you did. So much I recommended it for my work. I have been butchering it unfortunately in my code because I do not understand quite how to use it (from a source stand point). However I am pushing myself through it. Code is clean :) Until I got a hold of it. haha

Things I needed I have managed to butcher together

1. wrap for use with vuejs
2. ability to change markers from circle markers to icons
3. ability to load previous selections back to the plugin on initialization. (1/2 way) first load back works second fails due to it going from a function to a normal array

Things I would love to have

1. a little bit better documentation (if these things are already capable of being done)
2. ability to pass styles to plugin (Marker or CircleMarker) styles for the specified type of marker (since you're extending the marker anyways I was hoping to be able to do this)
3. Maybe adding a little bit of api as well. So we can hook on at least enabled, after first selection, after second selection, selections completed, finished resetting, disabled

Thank you again so much for your amazing work and contribution :) 👍 👍 👍

[w8r]

@xmikedanielsx 👍
to extend it with your own type of markers, you need to extend the control and replace the following methods on it, that's the easiest way:

  /**
   * Replace this method if you want to subclass moving marker
   * @param  {L.LatLng} pos
   * @param  {Object}   style
   * @return {L.Control.LineStringSelect.ControlMarker}
   */
  movingMarkerFactory: function(pos, style) {
    return new ControlMarker(pos, style);
  },

  /**
   * Replace this method if you want to subclass endpoint marker
   * @param  {L.LatLng} pos
   * @param  {Object}   style
   * @param  {Boolean}  isEnd
   * @return {L.Control.LineStringSelect.Endpoint}
   */
  endpointFactory: function(pos, style, isEnd) {
    return new Endpoint(pos, style);
  },

styles for those are passed via control options, so that's quite straight-forward, too

[xmikedanielsx]

@w8r 👍
Yeah, I followed that. I have done it. However I am doing it from the dist file as I do not quite follow the build process for this repo. If there is some other location I should be looking to be able to change and see changes let me know. But my thought process was that I would update files. while watching and it would create new bundles and I would use that in order to see changes in my system. But it doesn't seem to do that. Maybe I am using it wrong. Maybe you can quickly document if you wouldn't mind the process to build this. as I am very interested in adding functionality to this :) I wrote you PM as well on GMAIL. Thanks for understanding I was not trying to be bitter :)

[w8r]

around here you can find how to get the meter marks of selection start and end
https://github.com/w8r/L.Control.LineStringSelect/blob/master/examples/js/app.js#L47
you can then store these values and use selectMeters on initialize to restore previous selection

[w8r]

as for Vue.js - I don't really know that framework, I can't help you there

[xmikedanielsx]

it's not really about vuejs -- this I know how to use very well.
It's about your repo. So I cloned it. npm i . Then npm start
But.. the example uses bundle.js
So everything in src doesn't really do anything from what I understand. Because as I see no where in your package.json file does it mention any of your src files.. this is what I am missing? Should I completely ignore the src files?