Using Cesium instance or type outside main vue-cesium component file

[naiconovalabs]

Hi!
I'm using vue3 with composition api and typescript.
I can use "Cesium" instance only inside onViewerReady event but I can't use it outside.

I want to do this because I neet to extract some logic parts from main vue-cesium component file to other .ts files.
For example I need to do this:

// myLogic.ts (fake/pseudo code)
import { ref } from 'vue';
import { Cesium } from 'vue-cesium/types/something" // <- I can't do that

export default function doSomething(cesium: Cesium) {
  const myColor = ref(cesium.Color.RED);

  const changeColor = () => {
    myColor.value = cesium.Color.WHITE; // random color
  };

  return {
    count,
    changeColor,
  };
}

can you give me some advice?
Thanks!

[zouyaoji]

We noticed this problem, in 3.0.7 most of the type definitions have been exposed.

[zouyaoji]

I will provide a ts version of vue-cesium-demo as soon as possible.

[zouyaoji]

https://github.com/zouyaoji/vue-cesium-demo

[naiconovalabs]

Hi. Thanks so much.

I run this demo correctly and it works.
I found something useful such as useVueCesium() from 'vue-cesium', but when I try to use it:

// src/features/useMyFeature.ts

import { useVueCesium } from 'vue-cesium'

const useMyFeature = () => {

    const $vc = useVueCesium()

    const myFn = () => {

        console.log("$vc: ", $vc)
        // $vc is undefined!!

        const { viewer } = $vc
        // and so I can't access to viewer object

    }

    return {
        myFn,
    }

}

export default useMyFeature;

$vc is undefined. Can you give me some advice?
Thanks.

[zouyaoji]

Indeed, currently useVueCesium() has some limitations and it is not perfect. Its essence is to use the provider and inject features of vue.
确实，目前useVueCesium()有一定局限性，并不完美。其实质是用到了vue的provider和inject特性。

https://github.com/zouyaoji/vue-cesium/blob/dev/packages/composables/use-vue-cesium/index.ts#L6

In other words, useVueCesium can only be used in subcomponents of main-viewer, as in the demo.
换句话说，只有像demo中那样，只有在main-viewer的子组件中才能使用useVueCesium。

[zouyaoji]

The next version will overcome this limitation.
下个版本将突破这个局限性。