Docs
ServoyCloudSupportSamplesOpen SourceCommunity
  • Home
  • GUIDES
    • Platform Overview
    • Get Servoy
    • Get Started
      • Chapter 0
      • Chapter 1
      • Chapter 2
      • Chapter 3
      • Chapter 4
      • Chapter 5
    • Get Help
      • SuLA Instructions
      • SuLA Terms
    • Develop
      • Application Design
        • Forms
          • Layout Management
            • Simple Layout
            • Fully Responsive
              • Bootstrap 12-Grid
              • Flexbox
              • Custom Div
              • Collapsible Container
              • Simple Collapsible
              • Center Container
              • Inline Group Container
            • Abstract Form
          • Form Containers
            • Form Container
            • Tab Panel
            • Split Pane
            • Collapse
            • Accordion Panel
            • Form Component
            • List Form Component
          • Form Inheritance
          • Form Components
        • UI Components
          • Buttons and Text
            • Badge
            • Button
            • Data Label
            • Dropdown
            • Image
            • Label
          • Grids
            • Data Grid
            • Power Grid
            • Table
          • Input Controls
            • Calendar
            • Calendar Inline
            • Checkbox
            • Choice Group
            • Combobox
            • Group Buttons
            • Html Area
            • Input Group
            • Rating
            • Slider
            • Switch
            • Spinner
            • TextArea
            • Textbox
            • TextBoxGroup
            • Type Ahead
            • select2tokenizer
          • Media
            • Carousel
            • Embedded YouTube
            • File upload
            • Image label
            • Lightbox Gallery
            • MultiFile Upload
            • PDF JS Viewer
            • PDF Viewer
          • Mobile
            • Native Data List
            • Native Select
          • Navigation
            • Breadcrumbs
            • Navbar
            • sidenav
          • Visualization
            • DBTreeview
            • Progress Bar
            • Treeview
            • ChartJS
              • Data Labels Plugin
              • Funnel Chart
              • OutLabels Plugin
              • TreeMap
          • Specialized Components
            • Smart Document Editor
            • Servoy PDF Viewer
            • Fullcalendar Component
              • Fullcalendar
              • Fullcalendar Events
              • Migrating calendar from Smart and Web client to NG client
            • Fullcalendar Component 2
            • Canvas
            • Google Charts
            • Google Maps
            • svySignature
            • svywebcam
        • Styling and Themes
          • Default Theme Properties
          • CSS / LESS
          • Component Variants
          • Font Icons
        • Data Modeling
          • Databases
            • Tables
              • Columns
              • Calculations
              • Aggregations
              • Methods
              • Events / Triggers
              • Table security
            • Views
            • Procedures
          • Relations
          • Value Lists
          • Menus
          • In-Memory Databases
          • View Datasource
        • Modular Design
      • Programming Guide
        • Scripting the UI
          • Scripting Forms
          • Interacting with Components
          • Navigation
          • Windows, Dialogs and Popups
          • Events Manager
        • Working with Data
          • Concepts
          • Loading
          • Sorting
          • Iterating
          • Searching
            • Find mode
            • Query Builder
            • SQL String
          • Filtering
          • Editing
          • Validation
        • Automation and Scheduling
          • Batch Processor
          • Headless API
          • Scheduler API
        • Creating REST APIs
        • Consuming Webservices
        • Working with Files
          • File Plugin Basics
          • Images
          • Excel
          • PDF
          • JSON
        • Browser Utilities
          • Notifications
            • Web Notifications (Toastr)
            • Web Notifications (Native)
            • Block UI
          • Session Management
          • Keyboard Utilities
          • NG Utils
        • Sending and Receiving Email
        • Servoy Jasper Reports
          • Input Type
          • Display Mode
          • Output format
          • Jaspe Reports Viewer
        • Extensions
          • Modules
            • svyPhonegap
              • First Use Guide
              • Barcode Scanner
              • Browser
              • Camera
              • File
              • Fingerprint
              • Location
              • Network Interface
              • Phonegap
              • Printer
              • Push Notifications
            • svyAPI
              • Getting Started
            • svyLookup
              • Custom Templates
              • API Documentation
              • svyLookup v1
                • API Documentation v1.0.0
                • Base Form svyLookupTable v1.0.0
                • Base Form AbstractLookup v1.0.0
            • svyNavigation
              • API Documentation
                • API svyNavigation
                • API svyNavigationHistory
                • API svyNavigationUX
            • svyPopupFilter
              • Simple Filter Pickers
              • Custom Templates
              • API Documentation
                • API svyToolbarFilter
                • API svyPopupFilter
              • API Documentation v1
                • API svyToolbarFilter v1
                • API svyPopupFilter v1
            • svySearch
            • svySecurity
              • Overview
              • Token-based Auth and SSO (NEW!)
              • API Documentation
              • Getting Started
              • Tenant replication
              • Security Management Console
                • Classic Security Management Console
              • svySecurityUX
              • svyProperties
              • API Doc svyProperties
            • svyUtils
              • Log Manager
              • Log Manager Appenders
              • Smart Doc Editor Utils
              • Custom Dialogs
              • Excel Utils
                • Full API Reference
              • Crypto Utils
      • Security
        • Authentication
        • Permissions
          • UI Permissions
          • Data Permissions
          • Runtime Permissions
        • Audit Logging
        • OAuth
        • JWT
      • Multi-Language Support
      • Mobile Development
        • Getting Started
        • Mobile Design
        • Native Mobile Integrations
        • Building a Native Binary for the App Store
      • Native Desktop Development
        • NGDesktop UI plugin
        • NGDesktop Utils
        • NGDesktop File Plugin
    • Deploy
      • WAR Deployment
      • Docker Deployment
      • Server Configuration
        • Server Settings
        • Server Plugins
        • Database Servers
          • Locks
          • Transactions
          • Oracle
          • SQLServer
        • Client Sessions
        • Batch Processors
        • License Management
        • Monitoring
          • Server Log
          • Browser Console Log
          • Websocket Log
          • Query Performance
          • Client Performance
          • Client Event Tracing
          • Monitoring Servoy with JMX
      • NGClient deployment
      • Troubleshooting
      • Other Topics
        • Security: Cross-site Scripting
        • Running in an iFrame
    • Extend
    • Contribute
  • Reference
    • Servoy Core
      • Object Model
        • Database Server
          • Table
            • Column
            • Calculation
            • Method
            • Aggregation
          • View
          • Procedure
        • Solution
          • Form
          • Form Component
          • Relation
          • Relation Item
          • Table Node
          • Value List
          • Menu
          • Menu item
          • In-Memory Data Source
          • View Foundset Data Source
          • Variable
          • Column Info
          • Media
          • Layout Container
          • Method
        • i18n Message Key
      • Developer API
        • Globals
        • Forms
          • RuntimeForm
            • controller
            • containers
              • RuntimeContainer
            • elements
              • Component
              • RuntimeAccordionPanel
              • RuntimeBean
              • RuntimeButton
              • RuntimeCalendar
              • RuntimeCheck
              • RuntimeCombobox
              • RuntimeComponent
              • RuntimeDataButton
              • RuntimeDataLabel
              • RuntimeGroup
              • RuntimeHtmlArea
              • RuntimeImageMedia
              • RuntimeInsetList
              • RuntimeLabel
              • RuntimeListBox
              • RuntimePassword
              • RuntimePortal
              • RuntimeRadio
              • RuntimeChecks
              • RuntimeRadios
              • RuntimeRectangle
              • RuntimeRtfArea
              • RuntimeSpinner
              • RuntimeSplitPane
              • RuntimeTabPanel
              • RuntimeTextArea
              • RuntimeTextField
              • RuntimeWebComponent
        • JS Lib
          • Array
          • BigInt
          • Boolean
          • Date
          • Function
          • IterableValue
          • Iterator
          • JSON
          • Map
          • Set
          • Math
          • Namespace
          • Number
          • Object
          • Promise
          • QName
          • RegExp
          • Special Operators
          • Statements
          • String
          • XML
          • XMLList
        • Application
          • APPLICATION_TYPES
          • CLIENTDESIGN
          • DRAGNDROP
          • ELEMENT_TYPES
          • LOGGINGLEVEL
          • NGCONSTANTS
          • UICONSTANTS
          • CSSPosition
          • JSDimension
          • JSDNDEvent
          • JSEvent
          • JSLogger
          • JSLogBuilder
          • JSPoint
          • JSUpload
          • JSWindow
          • JSBounds
          • Renderable
          • UUID
        • SolutionModel
          • ALIGNMENT
          • ANCHOR
          • BEVELTYPE
          • CURSOR
          • DEFAULTS
          • FONTSTYLE
          • MEDIAOPTION
          • PAGEORIENTATION
          • PRINTSLIDING
          • SCROLLBAR
          • TITLEJUSTIFICATION
          • TITLEPOSITION
          • UNITS
          • JSBean
          • JSButton
          • JSCalculation
          • JSComponent
          • JSDataSourceNode
          • JSField
          • JSForm
          • JSLabel
          • JSMedia
          • JSMethod
          • JSPart
          • JSPortal
          • JSRelation
          • JSRelationItem
          • JSStyle
          • JSTab
          • JSTabPanel
          • JSValueList
          • JSVariable
          • JSTitle
          • JSChecks
          • JSCombobox
          • JSHeader
          • JSInsetList
          • JSList
          • JSPassword
          • JSRadios
          • JSText
          • JSTextArea
          • JSWebComponent
          • JSLayoutContainer
        • Database Manager
          • QUERY_COLUMN_TYPES
          • SQL_ACTION_TYPES
          • JSColumn
          • JSDataSet
          • JSBaseRecord
          • JSBaseSqlRecord
          • JSBaseFoundset
          • JSBaseSQLFoundset
          • JSFoundSet
          • JSFoundSetUpdater
          • JSRecord
          • JSRecordMarker
          • JSRecordMarkers
          • JSTable
          • JSTableFilter
          • MenuFoundSet
          • MenuItemRecord
          • QBAggregate
          • QBAggregates
          • QBCase
          • QBCaseWhen
          • QBColumn
          • QBColumns
          • QBCondition
          • QBFunction
          • QBFunctions
          • QBGroupBy
          • QBJoin
          • QBJoins
          • QBLogicalCondition
          • QBParameter
          • QBParameters
          • QBPart
          • QBResult
          • QBSearchedCaseExpression
          • QBSelect
          • QBSort
          • QBSorts
          • QBTableClause
          • QBWhereCondition
          • ViewFoundSet
          • ViewRecord
        • Events Manager
          • EVENTS_AGGREGATION_TYPES
          • EventType
        • Menus
          • JSMenu
          • JSMenuItem
        • JSMenuDatasource
        • Utils
        • Client Utils
          • JSBlobLoaderBuilder
        • History
        • Security
        • i18n
        • ServoyException
          • DataException
        • JSUnit
        • Datasources
          • DBDataSource
          • DBDataSourceServer
          • JSConnectionDefinition
          • JSDataSource
          • MemDataSource
          • MenuDataSource
          • SPDataSource
          • SPDataSourceServer
          • ViewDataSource
        • JSViewDatasource
        • servoyDeveloper
        • enum
    • Extensions
      • UI Components
        • Buttons and Text
          • Badge
          • Button
          • Data Label
          • Drop Down
          • Image
          • Label
        • Form Containers
          • Accordion Panel
          • Collapse
          • Form Container
          • Form Component Container
          • List Form Component
          • Default Loading Indicator
          • Error Bean
          • Portal
          • Responsive Container
          • Servoy Default Navigator
          • Slider
          • Split Pane
          • TabPanel
        • Grids
          • Data Grid
          • Power Grid
          • Table
        • Input Controls
          • Calendar
          • Calendar Inline
          • Checkbox
          • Choice Group
          • Combobox
          • Floatinglabel Calendar
          • Floatinglabel Combobox
          • Floatinglabel Textarea
          • Floatinglabel Textbox
          • Floatinglabel Type Ahead
          • Group Buttons
          • Html Area
          • Input Group
          • Rating
          • Select2tokenizer
          • Slider
          • Spinner
          • Switch
          • TextArea
          • TextBox
          • TextBox Group
          • Type Ahead
        • Media
          • Carousel
          • Embedded YouTube
          • File upload
          • Image label
          • Lightbox Gallery
          • MultiFile Upload
          • PDF JS Viewer
          • PDF Viewer
        • Mobile
          • Native Data List
          • Native Select
        • Navigation
          • Breadcrumbs
          • Navbar
          • sidenav
        • SmartDocEditor
          • Smart Document Editor
        • Visualization
          • Canvas
          • Chart
          • Custom List
          • DBTreeview
          • Foundset List
          • Fullcalendar
          • Gauge
          • Google Maps
          • Kanban
          • Progress Bar
          • Treeview
      • Server Plugins
        • amortization
          • AmortizationCalculation
          • Polynomial
        • clientmanager
          • Broadcaster
          • JSClientInformation (cm)
        • excelxport
        • file
          • JSFile
          • JSProgressMonitor
        • headlessclient
          • JSClient
        • http
          • HTTP_STATUS
          • Cookie
          • DeleteRequest
          • GetRequest
          • HeadRequest
          • HttpClient
          • HttpClientConfig
          • OptionsRequest
          • PostRequest
          • PutRequest
          • Response
          • TraceRequest
          • PatchRequest
          • JSFileUpload
        • images
          • JSImage
        • jwt
          • Algorithm
          • Builder
          • JWTClaims
        • mail
          • Attachment
          • MailMessage
        • maintenance
          • JSClientInformation
          • JSColumnObject
          • JSServer
          • JSTableObject
        • mobileservice
          • OfflineDataDescription
        • oauth
          • ClientAuthentication
          • CustomApiBuilder
          • OAuthProviders
          • OAuthRequest
          • OAuthResponse
          • OAuthResponseBinary
          • OAuthResponseJSON
          • OAuthResponseText
          • OAuthService
          • OAuthServiceBuilder
          • OAuthTokenExtractors
          • RequestType
        • pdf_output
        • rawSQL
        • RestWs plugin
        • rest_ws
          • WsContents
          • WsCookie
          • WsRequest
          • WsResponse
        • scheduler
        • serialize
        • textxport
          • DataProviderExport
          • TabExporter
        • udp
          • JSPacket
        • XmlReader
          • XmlNode
      • Browser Plugins
        • Block UI
        • Block UI (ref)
        • Dialogs Plugin
        • Idle
        • Idle (ref)
        • Key Listener
        • Key Listener (ref)
        • NGDesktop File
        • NGDesktop File (ref)
        • NGDesktop UI (ref)
        • NGDesktop Utils (ref)
        • NG Utils (ref)
        • Office Javascript API for Servoy
        • Phonegap
        • Web Notifications (Native)
        • Web Notifications (Toastr)
        • Window Plugin
        • Font Awesome
      • Modules
        • Smart Doc Editor Utils
        • svyAPI
          • Getting Started
        • svyLookup
          • Custom Templates
          • API Documentation
          • svyLookup v1
            • API Documentation v1.0.0
            • Base Form svyLookupTable v1.0.0
            • Base Form AbstractLookup v1.0.0
        • svyLookupExample
        • svyNavigation
          • API Documentation
            • API svyNavigation
            • API svyNavigationHistory
            • API svyNavigationUX
        • svyNavigationUX
        • svyNavigationUXSample
        • svyPopupFilter
          • Simple Filter Pickers
          • Custom Templates
          • API Documentation
            • API svyToolbarFilter
            • API svyPopupFilter
          • API Documentation v1
            • API svyToolbarFilter v1
            • API svyPopupFilter v1
        • svyProperties
        • svySearch
        • svySecurity
          • Overview
          • Token-based Auth and SSO (NEW!)
          • API Documentation
          • Getting Started
          • Tenant replication
          • Security Management Console
            • Classic Security Management Console
          • svySecurityUX
          • svyProperties
          • API Doc svyProperties
        • svySecurityConsole
        • svySecurityUX
        • svyUtils
          • Log Manager
          • Log Manager Appenders
          • Smart Doc Editor Utils
          • Custom Dialogs
          • Excel Utils
          • Full API Reference
          • Crypto Utils
        • svyUtils$Excel
        • svyUtils$NGClient
        • svyUtils$customDialogs
        • svyUtils$logManagerAppenders
        • svyUtils$tableGrid
      • Layout
        • Boostrap 12grid layout
          • Collapsible Container
          • Simple Collapsible
          • Center Container
          • Inline Group Container
          • Flexbox Layout
      • Solutions
        • Sample Application
          • Tutorial Part 1
          • Tutorial Part 2
      • Packages
        • UI Component Packages
          • Advanced Renderers
          • Bootstrap Components
          • Bootstrap Extra Components
          • Canvas
          • Chart JS
          • Fullcalendar Component
          • googlemaps
          • kanban
          • Servoy Core
          • Servoy Extra Components
          • Servoy NG-Grids
          • Servoy PDF Viewer
          • smartDocumentEditor
        • Browser Plugin Packages
          • Block UI
          • Core NG only Services
          • Key Listener
          • NGDesktop File
          • NGDesktop UI
          • NGDesktop Utils
          • Web Notifications
          • Idle Web Service
    • Servoy Developer
      • Menu
        • File
        • Edit
        • Source
        • Refactor
        • Navigate
        • Search
        • Project
        • Actions
        • Run
        • Window
        • Help
      • Toolbar
      • Solution Explorer
        • Resources
          • Database Servers
            • Database Server
              • Procedures
              • Tables
              • Views
          • Security
          • i18n
        • All Solutions
          • Solution
          • Active Solution
            • Scopes
              • Scope
                • Variables
            • Forms
              • Working Set
              • Form
                • Controller
                • Variables
                • Elements
                • Relations
            • Form Components
              • Form Component
            • Relations
              • Relation
            • ValueLists
              • ValueList
            • Menus
              • Menu
                • MenuItem
            • Media
              • Folder
              • File
            • DataSources
              • In Memory DataSources
                • In Memory DataSource
              • View Foundsets DataSources
                • View Foundset DataSources
            • Servoy Packages
              • Package
            • Modules
              • Module
        • Solution Explorer Contextual List
      • Views
        • Command Console
        • Console
        • Problems
        • Tasks
        • Bookmarks
        • Search
        • Form Hierarchy
        • Help
        • JUnit
        • Outline
        • Profiler
        • Properties
        • Project Explorer
        • Call Hierarchy
      • Editors and Wizards
        • Property configurator for columns
        • Relation Editor
        • Text Format Editor
        • Date Format Editor
        • Number Format Editor
        • Database Synchronization Wizard
        • Security Editor
        • SQL Editor
        • i18n Editor
        • File Import Wizard
        • File Export Wizard
        • WAR Export Wizard
        • NGDesktop Export Wizard
        • Table Editor
        • Metadata Synchronization Wizard
        • Database Server Connection Editor
        • Text Property Editor
        • Valuelist Editor
        • Form Editor
          • Parts of the Form Editor
          • Designing a Form
          • Layout Tools
          • Using Containers
          • Creating and Using Forms
          • Using Servoy Beans
          • Using Shapes
          • Form Editor Subtabs
          • [Tips and Shortcuts][reference/servoy-developer/object-editors/form-editor-tips_and_shortcuts.md]
          • Editong a Responsive LayoutForm
          • CSS Positioning
        • Form Hierarchy
        • Component Properties Editor
        • Variable Editor
        • Method Selection Wizard
        • New Solution Wizard
        • Application Event Types Editor
        • New Form Wizard
        • Form Dataproviders Configurator
        • Servoy Resource Locator
        • Datasource Selection Wizard
        • Sorting Fields Wizard
        • Scripting Editor
          • Getting Started-Overview of Script Editor
          • Code Writing Features
          • Code Navigation
          • Code Rewriting Tools
          • Refactoring
          • Code Formatting
          • Script Editor Tips and Shortcuts
          • Unit Tests
        • Theme Editor
          • General Properties
          • Sidenav Properties
          • Navbar Properties
          • Tabs Properties
          • Windows Properties
          • Dialogs Properties
          • Tables Properties
          • Breadcrumb specific style Properties
          • Brand colors Properties
          • Validations Properties
          • Margins and Padding Properties
        • Editor Selection
        • Run Configurations
        • Debug Configurations
        • Externalize Strings Wizard
        • Font Chooser Wizard
        • Color Chooser Wizard
        • Project Properties Configurator
        • Move Wizard
        • External Tools Configurations
        • About Servoy Developer
        • Servoy Developer Installation Details
        • Eclipse Marketplace Wizard
        • Install Available Software Wizard
        • Cheat Sheet Selection Wizard
        • Servoy Developer Help Wizard
        • Switch to Editor Wizard
        • Find Actions Wizard
        • Customize Perspective Configurator
        • Quick Search Wizard
        • Search Wizard
        • Encoding Wizard
        • Task Wizard
        • Find - Replace Wizard
        • Properties Editor
        • New Project Wizard
        • New Method Wizard
        • New Menu Wizard
          • New MenuItem Wizard
        • Menu Editor
        • ServoyMenu Selection Wizard
        • JSMenu compatible component selector
        • Permissions Configuration Dialog
      • Project File Structure
        • Servoy Installation Directory
          • servoy.properties
        • Workspace Folder
          • Resources Directory
            • Database Information (.dbi) Files
          • Solution Folder
      • Package Manager
      • Preferences
      • Property Types for components / services
      • Debugger
        • Debug Explorer
        • Breakpoints
          • Breakpoint Properties
        • Variables
        • Expressions
        • Interactive Console
    • Application Server
    • Servoy Cloud
      • Cloud Control Center
        • Home
          • Setup Namespace
          • User profile
            • My Profile
            • Support
        • Download IDE
        • Application Overview
          • Applications
            • Pipelines
              • Jobs
                • Packages
                  • Commits
                  • Artifacts
                  • Configuration
                  • Quality reports
                  • Build markers
                • Job Configuration
                  • Build and Deploy or Build
                  • Mobile
                  • Desktop
            • Environments
              • Metrics
                • Users
                • Databases
                  • Metrics
                • System Health
                • Log Activity
                • App performance
                • Query performance
              • Cloud reporting
            • Security
              • Permissions
              • Tenants
            • Reports
            • Security Login Designer
              • Single Sign-On
                • Sign in with Google
                • Sign in with Microsoft
          • Code Repositories
        • Project Management
          • Tickets
          • Backlog
          • Active Sprints
        • User Management
          • Users
          • Roles
        • Administration
          • Security
            • ServoyCloud Roles
          • Credentials
          • Settings
        • Add-Ons
      • Database Backup
      • E2E Cypress Testing
        • Using Cypress
      • On-Premise Deployment
      • Privacy policy (ServoyAI)
      • FAQ
      • Migrate to Servoy Cloud
    • Extensions Developement
      • Component and Services
        • Component Development
        • Service Development
        • Tools and Dev Tips to use for Component/Service developement
        • Manifest (.mf file)
        • Specification (.spec file)
          • Property Types
            • Array property types
            • Custom object property types
            • Findmode property type
            • Foundset property type
            • Tags
        • Directives And Filters
          • Sablotabsequence
        • Console (serverside)
        • ServoyApi (serverside)
      • Serverside Plugins
        • Data Convertors and Validators
        • UI Convertors
  • Release notes
    • Release notes
      • 2025.03
      • 2024.03 (LTS)
      • 2023.03 (LTS)
      • 2025.03 (Servoy Cloud)
      • 2024.12
      • 2024.12 (Servoy Cloud)
      • 2024.09
      • 2024.09 (Servoy Cloud)
      • 2024.06
      • 2024.06 (Servoy Cloud)
      • 2024.03 (Servoy Cloud)
      • 2023.12
      • 2023.12 (Servoy Cloud)
      • 2023.09
      • 2023.09 (Servoy Cloud)
      • 2023.06
      • 2022.03 (LTS)
      • 2022.12 What's new
      • 2022.12
      • 2022.09 What's new
      • 2022.09
      • 2022.06 What's new
      • 2022.06
      • 2021.03.3 (LTS)
Powered by GitBook
On this page
  • Properties
  • animationOptions
  • borderOptions
  • colorOptions
  • fontOptions
  • gaugeType
  • highlights
  • linearGaugeOptions
  • maxValue
  • minValue
  • needleOptions
  • radialGaugeOptions
  • ticks
  • title
  • units
  • value
  • valueBoxOptions
  • Types
  • AnimationOptions
  • BorderOptions
  • ColorOptions
  • FontOptions
  • Highlight
  • LinearGaugeOptions
  • NeedleOptions
  • RadialGaugeOptions
  • TickOptions
  • TitleOptions
  • ValueBoxOptions

Was this helpful?

  1. Reference
  2. Extensions
  3. UI Components
  4. Visualization

Gauge

PreviousFullcalendarNextGoogle Maps

Last updated 1 month ago

Was this helpful?

(part of package '') Extends designtime/SolutionModel: Extends runtime:

This is a reference page; many components have detailed usage guides .

Properties

animationOptions

Animation options for the gauge. Configures behavior such as duration, animation rule, and animated value settings. Type:


borderOptions

Border options for the gauge. Configures the widths and styles of the gauge borders. Type:


colorOptions

Color options for the gauge. Defines colors for the gauge plate, ticks, needle, borders, and other elements. Type:


fontOptions

Font options for the gauge. Defines fonts for tick numbers, title, units, and the value text. Type:


gaugeType


highlights


linearGaugeOptions


maxValue


minValue


needleOptions


radialGaugeOptions


ticks


title


units


value


valueBoxOptions


Types

AnimationOptions

Represents animation settings for the gauge, such as duration and animation behavior. scripting type: CustomType<servoyextra-gauge.AnimationOptions>

  • animateOnInit

    • Flag to indicate if the guage should be animated on first draw

    • Default Value: true

  • animatedValue

    • Flag to indicate if the value should be constantly updated during the animation

    • Default Value: false

  • animation

    • Flag to indicate if animations are enabled

    • Default Value: true

  • animationDuration

    • Time in milliseconds of the animation duration

    • Default Value: 500

  • animationRule

    • The type of animation behaviour for the guage

    • Default Value: "linear"

BorderOptions

Represents configuration options for the gauge borders. scripting type: CustomType<servoyextra-gauge.BorderOptions>

  • borderInnerWidth

    • Sets the inner width of the border in pixels. If 0, then no border will be drawn

  • borderMiddleWidth

    • Sets the middle width of the border in pixels. If 0, then no border will be drawn

  • borderOuterWidth

    • Sets the outer width of the border in pixels. If 0, then no border will be drawn

  • borderShadowWidth

    • Sets the width of the outer border drop shadow. If 0, then no shadow will be drawn

  • borders

    • Flag to indicate if borders should be drawn

    • Default Value: true

ColorOptions

Represents color configuration for various gauge elements. scripting type: CustomType<servoyextra-gauge.ColorOptions>

  • colorBar

    • Defines the background color of the bar

  • colorBarProgress

    • Defines the color of the progress bar

  • colorBarStroke

    • Defines the color of the bar stroke

  • colorBorderInner

    • Defines the color of the inner border for the gauge plate

  • colorBorderInnerEnd

    • This value and the main border outer colour can be used to specify a gradient for the inner border

  • colorBorderMiddle

    • Defines the color of the middle border for the gauge plate

  • colorBorderMiddleEnd

    • This value and the main border middle colour can be used to specify a gradient for the middle border

  • colorBorderOuter

    • Defines the color of the outer border for the gauge plate

  • colorBorderOuterEnd

    • This value and the main border outer colour can be used to specify a gradient for the outer border

  • colorMajorTicks

    • Color of the major tick marks

    • Default Value: "#444"

  • colorMinorTicks

    • Color of the minor tick marks

    • Default Value: "#666"

  • colorNeedle

    • Color of the needle

    • Default Value: "rgba(240,128,128,1)"

  • colorNeedleEnd

    • This value and the main needle colour can be used to specify a gradient for the needle

    • Default Value: "rgba(255,160,122,.9)"

  • colorNeedleShadowDown

    • Defines the lower half of the needle shadow color

  • colorNeedleShadowUp

    • Defines the upper half of the needle shadow color

  • colorNumbers

    • Color of the numbers on the ticks

    • Default Value: "#444"

  • colorPlate

    • The background color for the gauge

    • Default Value: "#fff"

  • colorPlateEnd

    • The end background color for the gauge. If specified will give a gradient effect to the gauge

  • colorTitle

    • Color of the title

    • Default Value: "#888"

  • colorUnits

    • Color of the units

  • colorValueBoxBackground

    • Defines the color of the background for the value box

  • colorValueBoxRect

    • Defines the color of the value box rectangle stroke

  • colorValueBoxRectEnd

    • This value and the main value box rectangle colour can be used to specify a gradient for the value box rectangle

  • colorValueBoxShadow

    • Defines the color of the shadow for the value box. If not specified then there will be no shadow

  • colorValueText

    • Color of the value text

    • Default Value: "#444"

  • colorValueTextShadow

    • Color of the value text shadow. If not specified then there will be no shadow

    • Default Value: "rgba(0,0,0,0.3)"

FontOptions

Represents font configuration options for gauge elements. scripting type: CustomType<servoyextra-gauge.FontOptions>

  • fontNumbers

    • The font family to be used for the tick numbers

  • fontNumbersSize

    • The font size to be used for the tick numbers in relative units

  • fontNumbersStyle

    • The font style to be used for the tick numbers

    • Default Value: "normal"

  • fontNumbersWeight

    • The font weight to be used for the tick numbers

    • Default Value: "normal"

  • fontTitle

    • The font family to be used for the title text

  • fontTitleSize

    • The font size to be used for the title in relative units

  • fontTitleStyle

    • The font style to be used for the title

    • Default Value: "normal"

  • fontTitleWeight

    • The font weight to be used for the title

    • Default Value: "normal"

  • fontUnits

    • The font family to be used for the units

  • fontUnitsSize

    • The font size to be used for the units in relative units

  • fontUnitsStyle

    • The font style to be used for the units

    • Default Value: "normal"

  • fontUnitsWeight

    • The font weight to be used for the units

    • Default Value: "normal"

  • fontValue

    • The font family to be used for the value

  • fontValueSize

    • The font size to be used for the value in relative units

  • fontValueStyle

    • The font style to be used for the value

    • Default Value: "normal"

  • fontValueWeight

    • The font weight to be used for the value

    • Default Value: "normal"

Highlight

Represents a gauge highlight range with starting and ending values and a specific color. scripting type: CustomType<servoyextra-gauge.Highlight>

  • color

    • The color to be used for the highlight range.

  • from

    • The starting value of the highlight range.

    • Default Value: 0

  • to

    • The ending value of the highlight range.

    • Default Value: 0

LinearGaugeOptions

Represents configuration options specific to a linear gauge layout. scripting type: CustomType<servoyextra-gauge.LinearGaugeOptions>

  • barBeginCircle

    • Defines if a gauge bar should start with a circle element imitating flask view of the bar. If set to zero it won’t be drawn at all

  • barLength

    • Defines bar length (in percent) in relation to overall gauge length

  • borderRadius

    • The radius for rounded corners of the gauge plate and its borders

  • colorBarEnd

    • If given, bar background will be drawn as gradient. If null or undefined, bar color will be solid

  • colorBarProgressEnd

    • If given, progress bar background will be drawn as gradient. If null or undefined, progress bar color will be solid

  • needleSide

    • Defines a side on which the needle should be drawn

    • Default Value: "both"

  • numbersSide

    • Defines a side on which the numbers should be drawn

    • Default Value: "both"

  • tickSide

    • Defines a side on which ticks bar should be drawn

    • Default Value: "both"

  • ticksPadding

    • Defines a padding used for drawing ticks out of a bar, in relative units

  • ticksWidth

    • Defines a length of major ticks width in relative units

  • ticksWidthMinor

    • Defines a length of minor tick lines width in relative units

NeedleOptions

Represents configuration options for the gauge needle. scripting type: CustomType<servoyextra-gauge.NeedleOptions>

  • needle

    • Flag to indicate if the needle should be drawn

    • Default Value: true

  • needleShadow

    • Flag to indicate if the needle shadow should be drawn

    • Default Value: true

  • needleType

    • Can be either 'line' or 'arrow'

    • Default Value: "arrow"

RadialGaugeOptions

Represents configuration options specific to a radial gauge layout. scripting type: CustomType<servoyextra-gauge.RadialGaugeOptions>

  • animationTarget

    • Defines which part of the gauge should be animated when changing the value

    • Default Value: "needle"

  • barStartPosition

    • Enable anti-clockwise progress bars and middle start point progress bars

    • Default Value: "left"

  • colorNeedleCircleInner

    • Defines a color which should be used to draw inner decorative circle element at the middle of the gauge

  • colorNeedleCircleInnerEnd

    • : If defined, inner decorative circle gauge element will be drawn as gradient. If falsy - inner circle will be drawn using solid color

  • colorNeedleCircleOuter

    • Defines a color which should be used to draw outer decorative circle element at the middle of the gauge

  • colorNeedleCircleOuterEnd

    • : If defined, outer decorative circle gauge element will be drawn as gradient. If falsy - outer circle will be drawn using solid color

  • needleCircleInner

    • Turns on/off inner decorative circle element drawing

    • Default Value: true

  • needleCircleOuter

    • Turns on/off outer decorative circle element drawing

    • Default Value: true

  • needleCircleSize

    • Defines the size in relative units of the decorative circles element of the gauge

    • Default Value: 45

  • startAngle

    • Defines a start angle for the start of the ticks bar

    • Default Value: 45

  • ticksAngle

    • Defines a max angle for ticks bar

    • Default Value: 270

  • useMinPath

    • Applicable only to radial gauges which have full 360-degree ticks plate. If set to true, the gauge will rotate needle/plate by a minimal rotation path

    • Default Value: true

TickOptions

Represents configuration options for gauge ticks including major and minor tick settings. scripting type: CustomType<servoyextra-gauge.TickOptions>

  • exactTicks

    • Flag indicating whether the provided major tick values should be used exactly as specified.

    • Default Value: false

  • highlightsWidth

    • Sets the width of highlights area in relative units

    • Default Value: 15

  • majorTicks

    • An array of numeric or string values which will be displayed on a gauge bar as major ticks. This array values define the labels for the ticks. The length of the array defines a number of sections on a ticks bar.

    • Default Value: ["0","20","40","60","80","100"]

  • majorTicksDec

    • The Number of digits for the decimal part of the tick number

  • majorTicksInt

    • The Number of digits for the integer part of the tick number

  • minorTicks

    • How many divisions to draw between two neighbour major ticks.

    • Default Value: 10

  • strokeTicks

    • Should the ticks bar of the gauge be stroked or not

    • Default Value: true

TitleOptions

Represents configuration options for the gauge title. scripting type: CustomType<servoyextra-gauge.TitleOptions>

  • dataProviderID

    • A data provider for dynamic title content.

  • displaysTags

    • Determines if formatting tags are applied to the title text.

  • format

    • Specifies the formatting rules for the title text.

  • text

    • The title text to display on the gauge.

ValueBoxOptions

Represents configuration options for the gauge value box. scripting type: CustomType<servoyextra-gauge.ValueBoxOptions>

  • valueBox

    • Flag to indicate if the value box should be shown or not

    • Default Value: true

  • valueDec

    • Number of digits for the decimal part of the value

    • Default Value: 2

  • valueInt

    • Number of digits for the integer part of the value

    • Default Value: 3


The type of gauge to display. A linear gauge is similar to a thermometer and a radial gauge is like a speedometer Type: Default Value: "radial"

An array of highlight definitions, specifying ranges to be emphasized on the gauge. Type:

Options specific to a linear gauge layout, such as bar length and tick placement. Type:

The maximum value for the gauge Type: Default Value: 100

The minimum value for the gauge Type: Default Value: 0

Needle options for the gauge. Configures the appearance and behavior of the gauge needle. Type:

Options specific to a radial gauge layout, such as angles and circular configurations. Type:

Tick options for the gauge. Defines major and minor ticks along the gauge scale. Type:

The title configuration for the gauge, including text, font, and styling options. Type:

The unit of measurement displayed on the gauge (e.g., °C, %, etc.). Type:

The current value displayed on the gauge, bound to a data provider. Type:

Options for the value box, which displays the gauge's value with optional formatting. Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

Type:

String
Number
Number
String
boolean
boolean
boolean
int
string
int
int
int
int
boolean
string
int
string
string
string
int
string
string
string
int
string
string
string
int
string
string
int
int
int
int
int
int
int
string
string
string
int
int
int
boolean
boolean
string
string
string
boolean
boolean
int
int
int
boolean
boolean
int
string[]
int
int
int
boolean
boolean
string
boolean
int
int
Servoy Extra Components
JSWebComponent
RuntimeWebComponent
here
CustomType<servoyextra-gauge.AnimationOptions>
CustomType<servoyextra-gauge.BorderOptions>
CustomType<servoyextra-gauge.ColorOptions>
CustomType<servoyextra-gauge.FontOptions>
Array<CustomType<servoyextra-gauge.Highlight>>
CustomType<servoyextra-gauge.LinearGaugeOptions>
CustomType<servoyextra-gauge.NeedleOptions>
CustomType<servoyextra-gauge.RadialGaugeOptions>
CustomType<servoyextra-gauge.TickOptions>
CustomType<servoyextra-gauge.TitleOptions>
CustomType<servoyextra-gauge.ValueBoxOptions>
Dataprovider
color
color
color
color
color
color
color
color
color
color
color
color
color
color
color
color
color
color
color
color
color
color
color
color
color
color
color
color
color
color
color
dataprovider
format