Home > steelseries-rose-gauge > Rose

Rose class

Round Rose-Chart Gauge

Signature:

export declare class Rose 

Remarks

require steelseries package installed or imported globally

Example 1

Example passing directly the canvas id

const rose = new Rose('canvasId', {
		size: 200,
		// ...
})

Example 2

Example passing the canvas element

const canvas = document.getElementById('canvasId')
// or
const canvas = document.createElement('canvas')

const rose = new Rose(canvas, {
		// ...
})

Constructors

Constructor	Modifiers	Description
(constructor)(canvas, parameters)		Constructs a new instance of the Rose class

Properties

Property	Modifiers	Type	Description
getBackgroundColor		() => ss.BackgroundColor	Return current background color
getForegroundType		() => ss.ForegroundType	Return current foreground type
getFrameDesign		() => ss.ForegroundType	Return current frame design
getOdoValue		() => number	Return current odometer value
getPointSymbols		() => string[]	Return current cardinal points symbols
getTitleString		() => string	Return current title string
getUnitString		() => string	Return current unit string
getValue		() => number[]	Return current Rose value
repaint		() => void	Repaint the gauge
setBackgroundColor		(newBackgroundColor: ss.BackgroundColor) => this	Set a new background color
setForegroundType		(newForegroundType: ss.ForegroundType) => this	Set a new foreground type
setFrameDesign		(newFrameDesign: ss.FrameDesign) => this	Set a new frame design
setOdoValue		(newValue: number) => this	Change odometer value
setOdoValueAnimated		(newValue: number, callback?: () => void) => this	Change odometer value, with animation
setPointSymbols		(newPointSymbols: string[]) => this	Change cardinal points symbols
setTitleString		(newTitle: string | number) => this	Change title string
setUnitString		(newUnit: string) => this	Change unit string
setValue		(newValue: number[]) => this	Change Rose value