Drone Dashboard

SigmaDroneChart is a customizable GaugeChart.

This chart allows you to add specific indicators, such as WiFi, Battery or Altimetre.

	Image
Usage example

Chart configuration parameters can be either invariants or dynamic. Invariants are those related to the appearance or configuration of the chart content, e.g. color, height, fontSize etc. The parameters here are those that change over time and must be updated on the chart when the attributes of a StreamPoint are updated. These parameters are denoted by paramOr... and can be configured with numeric, string or array values ​​or can be configured to retrieve data from the StreamPoint collection.

Example of configuration by values:

       paramOrValue = 9,

Example of configuration by parameter (StreamPoint attribute):

       paramOrValue = "${batteryLevel}"

Where batteryLevel is an attribute of a StreamPoint element in the StreamPoint collection.

Indicators on the center panel

WiFi:

	Image
WiFiIndicator

       wifiIndicator = new WiFiIndicator()
       {
           paramOrLevel = "${wifiLevel}",                                 //0 to 3
           size = 10
       },

Battery:

	Image
BatteryIndicator

        batteryIndicator = new BatteryIndicator()
        {
            paramOrLevel = "${battery}"                                 //0 to 10
        },

Altimeter:

	Image
AltitudeIndicator

        altitudeIndicator = new AltitudeIndicator()
        {
            paramOrAltitude = "${altitude}",
            maximumAltitude = 300,
        },

Crown indicators

These are indicators hosted by the circular crown of the Gauge chart. An unlimited number of Crown Indicators can be configured.

         public IEnumerable<SigmaDroneObject> crownIndicators { get; set; }

1. SigmaDroneCrownScale

   public class SigmaDroneCrownScale : SigmaDroneObject
   {
       public string label { get; set; }
       public double valueStart { get; set; }
       public double valueStop { get; set; }
       public object paramOrValue { get; set; }
   }
   

2. SigmaDroneCrownDiscrete

   public class SigmaDroneCrownDiscrete : SigmaDroneObject
   {
       public string label { get; set; }
       public int[]? percentageValues { get; set; }
       public string[]? colors { get; set; }
       public string[]? labels { get; set; }
       public object? paramOrIndex { get; set; }
       public bool haloText { get; set; }
   }
   

3. SigmaDroneCrownPercent

   public class SigmaDroneCrownPercent : SigmaDroneObject
   {
       public string label { get; set; }
       public int valueStart { get; set; }
       public int valueStop { get; set; }
       public object? paramOrValue { get; set; }
       public string backgroundColor { get; set; } = "white";
       public string fillColor { get; set; } = "red";
       public bool haloText { get; set; }
   }
   

SigmaDroneCrownDiscrete class

	Image
SigmaDroneCrownDiscrete class

         new SigmaDroneCrownDiscrete()
         {
             label  = "Fuel",
             colors = new List<string>() { "red", "orange", "yellow", "green" }.ToArray(),
             percentageValues = new List<int>() { 33, 33, 33, 33 }.ToArray(),
             paramOrIndex = "${fuel}",
             labels = new List<string>() { "critical", "low", "range", "full" }.ToArray(),
             percentageOfTheEntireCrown = 100,
             backgroundColor = "lightgray",
             haloText = true,
         },

SigmaDroneCrownScale class

	Image
SigmaDroneCrownScale

        new SigmaDroneCrownScale()
        {
            label = "x 1 km/h",
            valueStart = 0,
            valueStop = 120,
            paramOrValue = "${speed}",
            percentageOfTheEntireCrown = 100,
            backgroundColor = "#f8f8ff"
        },

SigmaDroneCrownPercent class

	Image
SigmaDroneCrownPercent

          new SigmaDroneCrownPercent()
         {
             label = "fuel",
             valueStart = 0,
             valueStop = 10,
             paramOrValue = 3,
             percentageOfTheEntireCrown = 100,
             backgroundColor = "lime",
             fillColor = "orange",
             haloText = true
         },