defineColor

Simplify the usage of Cesium.Color, as it's practically its substitute.

Usage

const viewer = useViewer()
viewer.entities.add({
  polygon: {
    // ...
    material: defineColor('#334455/80') // Color is #334455，transparency is 0.8
  }
})

The defineColor function will split the string into two parts based on /, with the latter part considered as the opacity.

// Cesium.Color.fromCssColorString('rgb(255 0 0)')
defineColor('rgb(255 0 0)')

// Cesium.Color.fromCssColorString('rgb(255 0 0 / 0.8)')
defineColor('rgb(255 0 0 / 0.8)')

// Cesium.Color.fromCssColorString('pink')
defineColor('pink')

// Cesium.Color.fromCssColorString('pink').withAlpha(0.8)
defineColor('pink/80')

// Cesium.Color.fromCssColorString('#f00')
defineColor('#f00')

// Cesium.Color.fromCssColorString('#f00').withAlpha(0.8)
defineColor('#f00/80')

demo

Type Declarations

Details

/**
 * Define a `Cesium.Color` from a string.
 *
 * ## example
 * ```js
 * defineColor('#00ff00/60') // #00ff00 with 60% alpha
 * defineColor('green/60')
 * defineColor('green')
 * defineColor('rgb(0 255 0)')
 * ```
 */
export declare function defineColor(str: string): Cesium.Color

Source

source • demo