fixing the examples

[Richard Greenwood]

I don't know if this is the right place to discuss this. Let me know if there is a better place.

OpenLayers is an awesome library that I've enjoyed since I was introduced to it at FOSS4G Lausanne. The examples were a great on-ramp for new users. But the current version examples don't work right out of the box so they pose a barrier to entry.

It seems like there are three ways to make the examples work:

1. The "old way": add a <script src=build/ol.js> element to the example and add an "ol." prefix to each "new" constructor
   
2. The "bundle way": copy the example's <script> element into a new .js file and run it thur a bundler
   
3. The "modules way": change the examples <script> element to type=module and edit rbush.js and its dependencies to be es6 module compatible
   

It's great to have these options. It speaks to the remarkable quality of the openlayers code and its developers. But the current examples need one of the three above modifications to work unless I'm totally missing something. Is this a concern to the developers? If so, what would be the best way to make the examples frendier? 

I'm interested in working on it if there is value in it.

--

Richard W. Greenwood, PLS
www.greenwoodmap.com

[Andreas Hocevar]

Thanks for your thoughts Richard. I have started a pull request
(https://github.com/openlayers/openlayers/pull/9103), with the goal to
use what you referenced as the "bundle way".

Feel free to comment there if you have additional ideas.

Thanks again,
Andreas.

> --
> You received this message because you are subscribed to the Google Groups "OpenLayers Dev" group.
> To unsubscribe from this group and stop receiving emails from it, send an email to openlayers-de...@googlegroups.com.
> To post to this group, send email to openlay...@googlegroups.com.
> Visit this group at https://groups.google.com/group/openlayers-dev.
> To view this discussion on the web visit https://groups.google.com/d/msgid/openlayers-dev/CAHBySPZpzdhffzY5C1AUd8mtNzwC7O5MgFyTBC000f5Aj845%3DA%40mail.gmail.com.
> For more options, visit https://groups.google.com/d/optout.

[Andreas Hocevar]

Hey Richard,

the pull request https://github.com/openlayers/openlayers/pull/9103 is
now ready for review. It also contains a comment with a link to an
example. Let me know what you think.

Thanks,
Andreas.

[Richard Greenwood]

Andreas,

That's fantastic. And the codesandbox is really helpful. I started a blog post here in which I'm trying to describe the ways that OpenLayers can be deployed. What release will the new examples be in? I should mention it in my post. And if you have any comments on what I writing let me know.

Thanks,

Rich

To view this discussion on the web visit https://groups.google.com/d/msgid/openlayers-dev/CAOiJ94gr%2BFPagDYTurX0a1wOJPsHDtr75y5oUGCH1VJDXNwZaw%40mail.gmail.com.

For more options, visit https://groups.google.com/d/optout.

[Andreas Hocevar]

Hey Rich,

the new examples will be in the next release, which will be v6.0, and
is scheduled to be released in February. Thanks for writing up that
blog post. Did you really get option 3 to work? When I tried it, it
failed because some of OpenLayers's dependencies do not use ES
modules.

Andreas.

> To view this discussion on the web visit https://groups.google.com/d/msgid/openlayers-dev/CAHBySPZrH6XewW0052v8zF7L4jv70e9Q97H7u4azpz1Kjmb0-g%40mail.gmail.com.

[Richard Greenwood]

Hi Andreas,

I edited rbush and quickselect so that they use es6 export/import syntax and got the simple examples working. Additionally I had to edit 

./ol/structs/RBush.js

./ol/renderer/canvas/VectorLayer.js

./ol/renderer/canvas/VectorTileLayer.js

so they could find rbush. 

And in the user code had to add type="module" to the script element and fully qualify the import paths. 

But that's it. You guys have done an awesome job making a huge codebase es6 module compliant!

I posted my little blog thing at https://dev.to/greenwoodmap/getting-started-with-openlayers-5-17bi

covering only the first two methods but plan to follow up with the module method when time permits.

Best regards,

Rich

To view this discussion on the web visit https://groups.google.com/d/msgid/openlayers-dev/CAOiJ94iDnh68d7JzZzbP34MdLcukyMk9tBWgz03B1qrUB5mEOA%40mail.gmail.com.

For more options, visit https://groups.google.com/d/optout.