OpenLayers using Diamond

[sressi]

Hi guys. I'm trying to include OpenLayers using Diamond and I can't even visualize the simplest map. I tryed building a vu3 primevue project from scracth and it worked fine. The thing is that when I try to include a map in the project I'm developing that is already using Diamond it does not work.

I have installed openlayers

Code: Select all

npm install vue3-openlayers

Added the following lines to main.js:

Code: Select all

import OpenLayersMap from 'vue3-openlayers'
import 'vue3-openlayers/dist/vue3-openlayers.css'
...
app.use(OpenLayersMap)

Then created a test page:

Code: Select all

<template>
<ol-map :loadTilesWhileAnimating="true" :loadTilesWhileInteracting="true" style="height:400px">

    <ol-view ref="view" :center="center" :rotation="rotation" :zoom="zoom" 
    :projection="projection" />

    <ol-tile-layer>
        <ol-source-osm />
    </ol-tile-layer>
    
</ol-map>
</template>

<script>
import {defineComponent,ref} from "vue";

export default defineComponent({
      setup() {
        const center = ref([40, 40])
        const projection = ref('EPSG:4326')
        const zoom = ref(8)
        const rotation = ref(0)
        return {
            center,
            projection,
            zoom,
            rotation
        }
    },
})
</script>

After running

Code: Select all

npm run serve

the map is not visible and theres an error on Chrome's console:
TypeError: Object(...) is not a function
at Proxy.Mapvue_type_template_id_39e43851_lang_true_render (vue3-openlayers.common.js?2993:12709:1)...

I'm new to vue, I've been trying to figure it out for a few days and couldn't fix it. Any help would be greatly appreciated.

[sressi]

Hi guys! No answer at all? I really need to solve this and be able to use OpenLayers within Diamond. Thanks!

[tugce.kucukoglu]

Hi,

I really don't know anything about OpenLayers but how do you import PrimeVue? Did you check PrimeVue setup page?

[sressi]

Project is running using primevue and diamond template. Everything works fine. I need to add some map functionality and that's why I need to use openlayers. If I build a primevue project from scratch (no diamond template) openlayers work and a map is shown, but when I try to use openlayers in my project (with diamond) it does not work.

[tugce.kucukoglu]

What kind of error are you getting on the console? Could you attach some screenshots?