openlayers / ol-cesium

OpenLayers - Cesium integration
http://openlayers.org/ol-cesium/
BSD 2-Clause "Simplified" License
991 stars 323 forks source link

Old-fashioned independent lib not loading #613

Closed webarchymeta closed 5 years ago

webarchymeta commented 6 years ago

The following error is thrown:

Uncaught TypeError: Super expression must either be null or a function, not undefined
    at _inherits (VM32705 olcesium.js:3838)
    at VM32705 olcesium.js:3849
    at Module../src/olcs/SynchronizedOverlay.js (VM32705 olcesium.js:4145)
    at __webpack_require__ (VM32705 olcesium.js:30)
    at Module../src/olcs/OverlaySynchronizer.js (VM32705 olcesium.js:3370)
    at __webpack_require__ (VM32705 olcesium.js:30)
    at Module../src/olcs/OLCesium.js (VM32705 olcesium.js:2595)
    at __webpack_require__ (VM32705 olcesium.js:30)
    at Module../src/index.library.js (VM32705 olcesium.js:135)
    at __webpack_require__ (VM32705 olcesium.js:30)
gberaudo commented 6 years ago

The SynchronizedOverlay class extends the ol.Overlay class. According to the stack trace the value is incorrect. Could you check what the value actually is?

webarchymeta commented 6 years ago

I have checked, the value ol.Overlay is defined (it's a Class in the latest release of openlayers, namely 5.0.3) before loading ol-cesium. However I load openlayers from remote site (openlayers' site) and load the ol-cesium from my ownsite, could there be cross origin isssues?

webarchymeta commented 6 years ago

It seems that the ol.Overlay class (and most likely other ones from openlayers) was treated as defined inside the webpacked (old-fashioned) output, however the old fashioned way of loading should treat openlayers classes as somehing defined externally ...

gberaudo commented 6 years ago

@webarchymeta, check the buildtools/webpack.library.js file. It is where webpack is instructed about how to create the distributed olcesium.js file.

There is an externals property which is supposed to handle this. I doubled checked https://webpack.js.org/guides/author-libraries/ and it looks correct.

dandoteverest commented 6 years ago

I too am having the same issue. I'm doing nothing fancy. Here's my application.html.erb snippet:

` <%= stylesheet_link_tag 'application' %> <%= stylesheet_link_tag 'v5.0.3-dist/ol' %> <%= stylesheet_link_tag 'Cesium/Build/Cesium/Widgets/widgets' %> <%= stylesheet_link_tag 'ol-cesium-v2.1/olcs' %>

<% if Rails.env.production? %> <%= javascript_include_tag 'application.js' %> <% else %> <%= javascript_include_tag 'application-debug.js' %> <%= javascript_include_tag 'Cesium/Build/Cesium/Cesium' %> <%= javascript_include_tag 'v5.0.3-dist/ol' %> <%= javascript_include_tag 'ol-cesium-v2.1/olcesium' %> <% end %> `

webarchymeta commented 6 years ago

I think the current buildtools/webpack.library.js file is not sufficient to handle the problem. This is because the ES2015 style of import uses path like syntax, e.g. ol/Overlay.js, while the 'old-fashioned' way of including openlayers via script tag generates a global 'ol.Overlay' object. Therefore using a regex for the externals in webpack config file is not enough, some kind of transformation is required, it better to use a function (see here).

Also the libraryTarget attribute should have a 'root' or 'window' value instead of 'umd'

icemagno commented 6 years ago

Same issue here. I'm afraid I have done something wrong. Please confirm my deploy method:

1) Download OL-Cesium v2.1
2) Extract all
3) Move \ol-cesium-v2.1\node_modules\@camptocamp\cesium\Build\Cesium folder to root folder ( here \ol-cesium-v2.1 )
4) Point it in my HTML file:
    <!-- Release 2.1 based on Cesium 1.47 and the stable OpenLayers 5.0 -->
    <script type="text/javascript" src="js/ol-cesium-v2.1/Cesium/Cesium.js"></script>
    <script type="text/javascript" src="js/ol-cesium-v2.1/olcesium.js"></script>
    <link type="text/css" rel="stylesheet" href="js/ol-cesium-v2.1/olcs.css" >

Two things I noted:

1) My old working 1.31 environment have the same folder structure so I move the "Cesium" folder to make it same
2) The CSS file name was changed from"ol.css" to "olcs.css". 

The error:


TypeError: Super expression must either be null or a function, not undefined  olcesium.js:3838:113
    _inherits http://localhost:8080/mclm/js/ol-cesium-v2.1/olcesium.js:3838:113
    ["./src/olcs/SynchronizedOverlay.js"]/SynchronizedOverlay< http://localhost:8080/mclm/js/ol-cesium-v2.1/olcesium.js:3849:3
    ["./src/olcs/SynchronizedOverlay.js"] http://localhost:8080/mclm/js/ol-cesium-v2.1/olcesium.js:3848:27
    __webpack_require__ http://localhost:8080/mclm/js/ol-cesium-v2.1/olcesium.js:30:12
    ["./src/olcs/OverlaySynchronizer.js"] http://localhost:8080/mclm/js/ol-cesium-v2.1/olcesium.js:3370:81
    __webpack_require__ http://localhost:8080/mclm/js/ol-cesium-v2.1/olcesium.js:30:12
    ["./src/olcs/OLCesium.js"] http://localhost:8080/mclm/js/ol-cesium-v2.1/olcesium.js:2595:82
    __webpack_require__ http://localhost:8080/mclm/js/ol-cesium-v2.1/olcesium.js:30:12
    ["./src/index.library.js"] http://localhost:8080/mclm/js/ol-cesium-v2.1/olcesium.js:135:75
    __webpack_require__ http://localhost:8080/mclm/js/ol-cesium-v2.1/olcesium.js:30:12
    <anonymous> http://localhost:8080/mclm/js/ol-cesium-v2.1/olcesium.js:94:18
    <anonymous> http://localhost:8080/mclm/js/ol-cesium-v2.1/olcesium.js:11:18
    webpackUniversalModuleDefinition http://localhost:8080/mclm/js/ol-cesium-v2.1/olcesium.js:9:18
    <anonymous> http://localhost:8080/mclm/js/ol-cesium-v2.1/olcesium.js:1:11
ReferenceError: ol is not defined[Learn More]  ol3-ext.min.js:33:1
    <anonymous>

Please confirm I'm doing it right.

icemagno commented 6 years ago

So....

olcesium.js file is "webpackUniversalModuleDefinition" in 2.1 release and my 1.31 release is a real Javascript functional file.

Can you please release a RELEASE version? I have no time to compile releases.... I mean.... I need a Javascript file ready to use.

tlepkowski commented 6 years ago

I agree with @icemagno , I don't have the time. I said I could do this in a couple days, now stuck. I love to learn the new-fashioned way, but cannot right now. I have OL 5.1.3, OLCS 2.1. We're getting the same error as describes above: TypeError: Super expression must either be null or a function, not undefined olcesium.js:3838:113

vsile commented 6 years ago

I have the same error:

olcesium.js:3838 Uncaught TypeError: Super expression must either be null or a function, not undefined
    at _inherits (olcesium.js:3838)
    at olcesium.js:3849
    at Module../src/olcs/SynchronizedOverlay.js (olcesium.js:4145)
    at __webpack_require__ (olcesium.js:30)
    at Module../src/olcs/OverlaySynchronizer.js (olcesium.js:3370)
    at __webpack_require__ (olcesium.js:30)
    at Module../src/olcs/OLCesium.js (olcesium.js:2595)
    at __webpack_require__ (olcesium.js:30)
    at Module../src/index.library.js (olcesium.js:135)
    at __webpack_require__ (olcesium.js:30)
BenoitBellegarde commented 6 years ago

Same here :( Uncaught TypeError: Super expression must either be null or a function, not undefined

slavas62 commented 6 years ago

The same problem

gberaudo commented 6 years ago

Hi all, I opened #622 to improve the situation.

jacksparrow47 commented 6 years ago

Hi, I just download ol-cesium(old fashion) with npm , when I run my app it give me error below Uncaught ReferenceError: Cesium is not defined at new OLCesium (OLCesium.js:160) at :1:12 my npm download code is "npm i --save ol-cesium" can anyone help me?

gberaudo commented 6 years ago

@jacksparrow47, you should look at https://github.com/openlayers/ol-cesium/blob/master/examples/oldfashioned.html.

vsile commented 6 years ago

In the release v. 2.2.1 I get another problem:

olcesium.js:3409 Uncaught TypeError: ol_events_js__WEBPACK_IMPORTED_MODULE_2__.listen is not a function
    at olcesium.js:3409
    at Array.forEach (<anonymous>)
    at new OverlaySynchronizer (olcesium.js:3408)
    at new OLCesium (olcesium.js:2803)
    at (index):254

How can I resolve it?

gberaudo commented 6 years ago

I missed some uses of the listen function (which is internal in OpenLayers). In your custom build of OpenLayers, you should mark that function @api.

slavas62 commented 6 years ago

Hello, when using the release of OL-Cesium v2.2.2, I get the following error:

Uncaught TypeError: Right-hand side of 'instanceof' is not an object olcesium.js:104

at Object.assertInstanceof (olcesium.js:104)
at VectorSynchronizer.createSingleLayerCounterparts (olcesium.js:4274)
at _loop (olcesium.js:287)
at VectorSynchronizer.addLayers_ (olcesium.js:312)
at t.<anonymous> (olcesium.js:438)
at t.h (ol.js:1)
at t.e.dispatchEvent (ol.js:1)
at t.insertAt (ol.js:1)
at t.push (ol.js:1)
at t.addLayer (ol.js:1)
gberaudo commented 6 years ago

Hi all, see the https://github.com/geoblocks/legacylib project to build a standalone OpenLayers5 with all exported symbols (not just @api ones).

gberaudo commented 6 years ago

@slavas62, looks like some symbol is missing in OpenLayers. See the instanceof calls in src/olcs/VectorSynchronizer.js.

alvaroind commented 5 years ago

Hi all,

I have the same error that @slavas62. When I try to add a layer in the map. However, with baselayers don't occur me this problem. Have you any solution?

Uncaught TypeError: Right-hand side of 'instanceof' is not an object at Object.assertInstanceof (olcesium.js.xhtml?ln=js:104) at VectorSynchronizer.createSingleLayerCounterparts (olcesium.js.xhtml?ln=js:4294) at _loop (olcesium.js.xhtml?ln=js:291) at VectorSynchronizer.addLayers_ (olcesium.js.xhtml?ln=js:316) at VectorSynchronizer.synchronize (olcesium.js.xhtml?ln=js:236) at new OLCesium (olcesium.js.xhtml?ln=js:2809) at init (olmaingis.js.xhtml?ln=js:202) at olmaingis.js.xhtml?ln=js:4

slavas62 commented 5 years ago

@alvaroind, the problem is not solved yet. If you can solve this problem, please let me know

alvaroind commented 5 years ago

For now, I have resolved this error commenting the line 104 in "olcesium.js":

image

Pd: It's good to say I know that this is not the best solution. However, it allows me to skip the error and continue.

gberaudo commented 5 years ago

@alvaroind, I am creating https://github.com/openlayers/ol-cesium/pull/651 to address the issue.

slavas62 commented 5 years ago

@alvaroind, thanks for the help. My service became working after I commented the lines 3964 and 4023 in the file olcesium.js: 3964 ol_dom_jsWEBPACK_IMPORTED_MODULE_2 ["removeNode"] (this.element); 4023 ol_dom_jsWEBPACK_IMPORTED_MODULE_2 ["removeChildren"] (this.element);

Without these comments, there were errors like:

Uncaught TypeError: Cannot read property 'removeChildren' of undefined

at SynchronizedOverlay.handleElementChanged (olcesium.js:4023)
at SynchronizedOverlay.h (ol.js:1)
at SynchronizedOverlay.e.dispatchEvent (ol.js:1)
at SynchronizedOverlay.t.notify (ol.js:1)
at SynchronizedOverlay.t.set (ol.js:1)
at SynchronizedOverlay.t.setElement (ol.js:1)
at SynchronizedOverlay.t [as constructor] (ol.js:1)
at new SynchronizedOverlay (olcesium.js:3834)
at OverlaySynchronizer.addOverlay (olcesium.js:3488)
at OverlaySynchronizer.addOverlayFromEvent_ (olcesium.js:3462)
gberaudo commented 5 years ago

@slavas62, I created https://github.com/openlayers/ol-cesium/pull/656 to fix the issue in the next release.

gberaudo commented 5 years ago

The OpenLayers build does not include these 2 functions as they are considered "internal". As written before, you can get a full OL5 build using https://github.com/geoblocks/legacylib/tree/master/ol5.

alvaroind commented 5 years ago

@gberaudo I am not using Node to load the libraries of OL. Are there another solution to load that legacy library?

gberaudo commented 5 years ago

@alvaroind, what do you mean? OL-Cesium is expected to run in a browser.

vsile commented 5 years ago

With 2.4 version I haven't any problem. Thank you, @gberaudo

slavas62 commented 5 years ago

I also have no problems with version 2.4. Thank you.

gberaudo commented 5 years ago

@webarchymeta, does it also fixes the issue for you?

webarchymeta commented 5 years ago

I am using (partially) the es6 style of programming for the said project, so I am not testing it at present. Thanks anyway. I am going to close this next if every (related) thing is fine now