⚡ Angular Gauges Real Data

• App to display data using an Angular component wrapper ng-canvas-gauges for the open-source Javascript biacsics/ng-canvas-gauges v6 library.
• Note: to open web links in a new window use: ctrl+click on link

📄 Table of contents

• ⚡ Angular Gauges Real Data
  • 📄 Table of contents
  • 📚 General info
  • 📷 Screenshots
  • 📶 Technologies
  • 💾 Setup
  • 💻 Code Examples
  • 🆒 Features
  • 📋 Status & To-Do List
  • 👏 Inspiration
  • 📁 License
  • ✉️ Contact

📚 General info

• Data displayed on analogue gauges - examples from CANVAS GAUGES USER GUIDE

📷 Screenshots

📶 Technologies

• Angular framework v17
• biacsics/ng-canvas-gauges v6. Published 3 years ago. Works with Angular 9+

💾 Setup

• Install dependencies with npm i
• Run ng serve for a dev server.
• Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

💻 Code Examples

• app.component.html - extract - defines some of the qualities of the analogue gauge

<radial-gauge
  [value]="(value$ | async)"
  title="Turbine Velocity"
  units="rpm"
  width="500"
  height="500"

  min-value="0"
  max-value="120"
  major-ticks="0, ,20, ,40, ,60, ,80, ,100, ,120"
  minor-ticks="2"
  font-numbers-size="25"

🆒 Features

• Canvas Gauges website includes extensive User Documentation.

📋 Status & To-Do List

• Status: Working
• To-Do: Nothing

👏 Inspiration

• CANVAS GAUGES USER GUIDE

📁 License

• This project is licensed under the terms of the MIT license.

✉️ Contact

• Repo created by ABateman, email: gomezbateman@gmail.com