Merge branch 'main' of https://github.com/s3xysteak/cesium-use

s3xysteak · May 22, 2024 · d579486 · d579486
2 parents 2dad778 + 9242937
commit d579486
Show file tree

Hide file tree

Showing 5 changed files with 20 additions and 2 deletions.
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "cesium-use",
   "type": "module",
-  "version": "0.8.1",
+  "version": "0.8.2",
   "private": false,
   "description": "Vue powered CesiumJS utility library",
   "author": "s3xysteak",

diff --git a/src/core/composables/useWaterPlane/demo.vue b/src/core/composables/useWaterPlane/demo.vue
@@ -3,7 +3,7 @@ import { reactive, watchEffect } from 'vue'
 import * as Cesium from 'cesium'
 import WaterImage from './waterNormals.jpg'
 import { useWaterPlane } from '.'
-import { useViewer } from '~/index'
+import { useViewer, defineColor } from '~/index'
 
 const viewer = useViewer()
 
@@ -50,13 +50,15 @@ const form = reactive({
   height: 10,
   reflectivity: 0.15,
   rippleSize: 100,
+  waterColor: '#020E12',
   waterAlpha: 0.9,
   distortionScale: 10,
 })
 watchEffect(() => {
   primitive.height = form.height
   primitive.reflectivity = form.reflectivity
   primitive.rippleSize = form.rippleSize
+  primitive.waterColor = defineColor(form.waterColor)
   primitive.waterAlpha = form.waterAlpha
   primitive.distortionScale = form.distortionScale
 })
@@ -80,6 +82,10 @@ function toggleShow() {
       rippleSize:
       <input v-model="form.rippleSize" input type="number">
     </label>
+    <label>
+      waterColor:
+      <input v-model="form.waterColor" input type="color">
+    </label>
     <label>
       waterAlpha:
       <input v-model="form.waterAlpha" input step="0.05" max="1" min="0" type="number">

diff --git a/src/core/composables/useWaterPlane/index-zh.md b/src/core/composables/useWaterPlane/index-zh.md
@@ -21,13 +21,15 @@ const form = reactive({
   height: 10,
   reflectivity: 0.15,
   rippleSize: 100,
+  waterColor: '#020E12',
   waterAlpha: 0.9,
   distortionScale: 10,
 })
 watchEffect(() => {
   primitive.height = form.height
   primitive.reflectivity = form.reflectivity
   primitive.rippleSize = form.rippleSize
+  primitive.waterColor = defineColor(form.waterColor)
   primitive.waterAlpha = form.waterAlpha
   primitive.distortionScale = form.distortionScale
 })

diff --git a/src/core/composables/useWaterPlane/index.md b/src/core/composables/useWaterPlane/index.md
@@ -21,13 +21,15 @@ const form = reactive({
   height: 10,
   reflectivity: 0.15,
   rippleSize: 100,
+  waterColor: '#020E12',
   waterAlpha: 0.9,
   distortionScale: 10,
 })
 watchEffect(() => {
   primitive.height = form.height
   primitive.reflectivity = form.reflectivity
   primitive.rippleSize = form.rippleSize
+  primitive.waterColor = defineColor(form.waterColor)
   primitive.waterAlpha = form.waterAlpha
   primitive.distortionScale = form.distortionScale
 })

diff --git a/src/core/composables/useWaterPlane/index.ts b/src/core/composables/useWaterPlane/index.ts
@@ -261,6 +261,14 @@ class WaterPrimitive {
     this._material!.uniforms.size = val
   }
 
+  get waterColor() {
+    return this._material!.uniforms.waterColor
+  }
+
+  set waterColor(val) {
+    this._material!.uniforms.waterColor = val
+  }
+
   get waterAlpha() {
     return this._material!.uniforms.waterAlpha
   }