From 0fda2ba3ff49bdc1ffc6833f658e2164af187008 Mon Sep 17 00:00:00 2001
From: Roy Ben-Shabat <Roy@Twine-s.com>
Date: Tue, 16 Jan 2018 12:17:10 +0200
Subject: Embedded RealTimeGraphEx library to solution. Added graphs to
 technician view. Implemented simple sensors data test using Machine Emulator.

---
 .../FastGraphs/RealTimeGraphExLineScroll.cs        | 251 +++++++++++++++++++++
 1 file changed, 251 insertions(+)
 create mode 100644 Software/Visual_Studio/SideChains/RealTimeGraphEx/FastGraphs/RealTimeGraphExLineScroll.cs

(limited to 'Software/Visual_Studio/SideChains/RealTimeGraphEx/FastGraphs/RealTimeGraphExLineScroll.cs')

diff --git a/Software/Visual_Studio/SideChains/RealTimeGraphEx/FastGraphs/RealTimeGraphExLineScroll.cs b/Software/Visual_Studio/SideChains/RealTimeGraphEx/FastGraphs/RealTimeGraphExLineScroll.cs
new file mode 100644
index 000000000..216683d39
--- /dev/null
+++ b/Software/Visual_Studio/SideChains/RealTimeGraphEx/FastGraphs/RealTimeGraphExLineScroll.cs
@@ -0,0 +1,251 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using System.Windows;
+using System.Windows.Media;
+using System.Windows.Media.Imaging;
+using System.Windows.Threading;
+using RealTimeGraphEx.Models;
+using RealTimeGraphEx.DataSeries;
+using RealTimeGraphEx.Controllers;
+using System.Runtime.ExceptionServices;
+
+namespace RealTimeGraphEx.FastGraphs
+{
+    /// <summary>
+    /// Represents a real-time graph with a single scrollable line.
+    /// </summary>
+    public class RealTimeGraphExLineScroll : RealTimeGraphExBase
+    {
+        #region Protected Fields
+
+        protected ConcurrentpointsList graphPolygon;
+        protected int updateCounter;
+
+        #endregion
+
+        #region Cross Thread Fields
+
+        protected GraphController _graphController;
+        protected int _maxPoints;
+        protected double _scaleFactor;
+        protected Color _stroke;
+        protected Color _fill;
+        protected bool _fillGraph;
+        protected List<double> _markers;
+
+        #endregion
+
+        #region Properties
+
+        /// <summary>
+        /// Gets or sets the maximum vectorsCollection to display on the graph (default 1000, affects performance).
+        /// </summary>
+        public int MaxPoints
+        {
+            get { return (int)GetValue(MaxPointsProperty); }
+            set { SetValue(MaxPointsProperty, value); }
+        }
+        public static readonly DependencyProperty MaxPointsProperty =
+            DependencyProperty.Register("MaxPoints", typeof(int), typeof(RealTimeGraphExLineScroll), new PropertyMetadata(1000, new PropertyChangedCallback(CrossModelChanged)));
+
+
+        /// <summary>
+        /// Gets or sets the graph fill color.
+        /// </summary>
+        public Color Stroke
+        {
+            get { return (Color)GetValue(StrokeProperty); }
+            set { SetValue(StrokeProperty, value); }
+        }
+        public static readonly DependencyProperty StrokeProperty =
+            DependencyProperty.Register("Stroke", typeof(Color), typeof(RealTimeGraphExLineScroll), new PropertyMetadata(Colors.Black, new PropertyChangedCallback(CrossModelChanged)));
+
+        /// <summary>
+        /// Gets or sets the graph fill color.
+        /// </summary>
+        public Color Fill
+        {
+            get { return (Color)GetValue(FillProperty); }
+            set { SetValue(FillProperty, value); }
+        }
+        public static readonly DependencyProperty FillProperty =
+            DependencyProperty.Register("Fill", typeof(Color), typeof(RealTimeGraphExLineScroll), new PropertyMetadata(Colors.Gray, new PropertyChangedCallback(CrossModelChanged)));
+
+        /// <summary>
+        /// Gets or sets whether the graph will be rendered using the Fill color property.
+        /// </summary>
+        public bool FillGraph
+        {
+            get { return (bool)GetValue(FillGraphProperty); }
+            set { SetValue(FillGraphProperty, value); }
+        }
+        public static readonly DependencyProperty FillGraphProperty =
+            DependencyProperty.Register("FillGraph", typeof(bool), typeof(RealTimeGraphExLineScroll), new PropertyMetadata(false, new PropertyChangedCallback(CrossModelChanged)));
+
+
+        /// <summary>
+        /// Gets or sets the IDataSeries used to push data vectorsCollection to the graph.
+        /// </summary>
+        public GraphController Controller
+        {
+            get { return (GraphController)GetValue(ControllerProperty); }
+            set { SetValue(ControllerProperty, value); }
+        }
+        public static readonly DependencyProperty ControllerProperty =
+            DependencyProperty.Register("Controller", typeof(GraphController), typeof(RealTimeGraphExLineScroll), new PropertyMetadata(null, new PropertyChangedCallback(GraphControllerChanged)));
+        private static void GraphControllerChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
+        {
+            var control = d as RealTimeGraphExLineScroll;
+
+            if (control.Controller != null)
+            {
+                control.Controller.RegisterMethods(control.ClearGraph, control.StartPushThread, control.SetPaused, control.ChangeRenderMode, control.OnPushMarker);
+                control._graphController = control.Controller;
+            }
+        }
+
+        #endregion
+
+        #region Constructors
+
+        public RealTimeGraphExLineScroll()
+            : base()
+        {
+            graphPolygon = new ConcurrentpointsList();
+            _markers = new List<double>();
+        }
+
+        #endregion
+
+        #region Override Methods
+
+        protected override void OnSizeChanged(object sender, SizeChangedEventArgs e)
+        {
+            OnSetCrossThreadFields();
+        }
+
+        protected override void OnSetCrossThreadFields()
+        {
+            base.OnSetCrossThreadFields();
+
+            this.Dispatcher.Invoke(() =>
+            {
+                _maxPoints = MaxPoints;
+                _scaleFactor = _width / _maxPoints;
+                _graphController = Controller;
+                _stroke = Stroke;
+                _fillGraph = FillGraph;
+                _fill = Fill;
+
+            }, DispatcherPriority.Send);
+        }
+
+        protected override void OnClearGraph()
+        {
+            base.OnClearGraph();
+            _graphController.dataSeries.ClearPoints();
+            graphPolygon.Clear();
+        }
+
+        protected internal override void OnRenderGraph()
+        {
+            if (_graphController != null && _graphController.dataSeries.Points != null && _graphController.dataSeries.Points.Count > 0 && _width > 1 && _height > 1)
+            {
+                var points = _graphController.dataSeries.Points.GetAndClearAllPoints();
+
+                if (!_isPaused)
+                {
+
+                    for (int i = 0; i < points.Count; i++)
+                    {
+                        double value = points[i];
+                        NormalizeValue(ref value);
+
+                        graphPolygon.Add(value);
+
+                        xValueCounter += _scaleFactor;
+                    }
+
+                    if (graphPolygon.Count > _maxPoints + 1)
+                    {
+                        xValueCounter -= (_scaleFactor * (graphPolygon.Count - (_maxPoints + 1)));
+                        graphPolygon.RemoveFromStart(graphPolygon.Count - (_maxPoints + 1));
+                    }
+                }
+
+                updateCounter++;
+
+                if (updateCounter >= 1)
+                {
+                    updateCounter = 0;
+
+                    if (!_disableRendering)
+                    {
+                        WriteableBitmap bmp = BitmapFactory.New((int)_mainWidth, (int)_mainHeight);
+                        bmp.Clear(Colors.Transparent);
+
+                        OnDrawVisuals(bmp);
+
+                        bmp.Freeze();
+
+                        img.Dispatcher.BeginInvoke(new Action(() =>
+                        {
+                            img.Source = bmp;
+                        }), System.Windows.Threading.DispatcherPriority.Send);
+                    }
+                }
+            }
+        }
+
+        protected override void OnZoomingComplete(Point transformOrigin, double scaleX, double scaleY)
+        {
+            base.OnZoomingComplete(transformOrigin, scaleX, scaleY);
+        }
+
+        #endregion
+
+        #region Virtual Methods
+
+        protected virtual void OnPushMarker()
+        {
+            
+        }
+
+        /// <summary>
+        /// Calculate the scaling factor for the current graph width.
+        /// </summary>
+        /// <returns></returns>
+        protected virtual double GetPolygonScaleFactor()
+        {
+            return _width / (graphPolygon.Count - 1);
+        }
+
+        /// <summary>
+        /// Draw the actual polygon on the image.
+        /// </summary>
+        /// <param name="bmp"></param>
+        [HandleProcessCorruptedStateExceptions]
+        protected virtual void OnDrawVisuals(WriteableBitmap bmp)
+        {
+            Color stroke = _graphController.dataSeries.GetStrokeColor() != null ? _graphController.dataSeries.GetStrokeColor().Value : _stroke;
+            Color fill = _graphController.dataSeries.GetFillColor() != null ? _graphController.dataSeries.GetFillColor().Value : _fill;
+
+            double scale = GetPolygonScaleFactor();
+
+            OnBeforeRenderingVisuals(bmp, scale);
+
+            if (_fillGraph) //Fill Graph
+            {
+                bmp.FillPolygon(graphPolygon.ToPolygonPointsFill(_offSetX, _offSetY, _mainWidth, _mainHeight, scale, ConvertYToImageYFliped), fill);
+            }
+
+            DrawPolyline(bmp, graphPolygon.ToPolygonPoints(_offSetX, _offSetY, scale, ConvertYToImageYFliped), stroke);
+
+            OnAfterRenderingVisuals(bmp, scale);
+        }
+        #endregion
+    }
+}
-- 
cgit v1.3.1


From d36a5ab7115ec53405622e4437cd3f8f615d515d Mon Sep 17 00:00:00 2001
From: Roy Ben-Shabat <Roy@Twine-s.com>
Date: Wed, 24 Jan 2018 19:32:14 +0200
Subject: Added support for multi sensor frame on developer module graph.

---
 Software/DB/Tango.mdf                              | Bin 75497472 -> 75497472 bytes
 Software/DB/Tango_log.ldf                          | Bin 8388608 -> 8388608 bytes
 .../ViewModels/MainViewVM.cs                       |  44 +++++++--
 .../Controls/IRealTimeGraph.cs                     |  48 +++++++++
 .../Controls/RealTimeGraphControl.xaml             |   2 +-
 .../Controls/RealTimeGraphControl.xaml.cs          |  15 ++-
 .../Controls/RealTimeGraphMultiControl.xaml        |  95 ++++++++++++++++++
 .../Controls/RealTimeGraphMultiControl.xaml.cs     | 107 +++++++++++++++++++++
 .../Resources/MaterialDesign.xaml                  |  40 ++++++++
 .../Tango.MachineStudio.Common.csproj              |   8 ++
 .../FastGraphs/RealTimeGraphExLineScroll.cs        |  12 ---
 .../RealTimeGraphEx/RealTimeGraphExBase.cs         |  11 +++
 .../RealTimeGraphEx/RealTimeGraphExMultiBase.cs    |  12 ---
 .../Tango.Core/Helpers/ColorHelper.cs              |  11 +++
 14 files changed, 370 insertions(+), 35 deletions(-)
 create mode 100644 Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Controls/IRealTimeGraph.cs
 create mode 100644 Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Controls/RealTimeGraphMultiControl.xaml
 create mode 100644 Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Controls/RealTimeGraphMultiControl.xaml.cs

(limited to 'Software/Visual_Studio/SideChains/RealTimeGraphEx/FastGraphs/RealTimeGraphExLineScroll.cs')

diff --git a/Software/DB/Tango.mdf b/Software/DB/Tango.mdf
index 27da03f9b..875b88771 100644
Binary files a/Software/DB/Tango.mdf and b/Software/DB/Tango.mdf differ
diff --git a/Software/DB/Tango_log.ldf b/Software/DB/Tango_log.ldf
index bdff96627..3a65c84fa 100644
Binary files a/Software/DB/Tango_log.ldf and b/Software/DB/Tango_log.ldf differ
diff --git a/Software/Visual_Studio/MachineStudio/Modules/Tango.MachineStudio.Developer/ViewModels/MainViewVM.cs b/Software/Visual_Studio/MachineStudio/Modules/Tango.MachineStudio.Developer/ViewModels/MainViewVM.cs
index 590474f9d..dc3ba0ec5 100644
--- a/Software/Visual_Studio/MachineStudio/Modules/Tango.MachineStudio.Developer/ViewModels/MainViewVM.cs
+++ b/Software/Visual_Studio/MachineStudio/Modules/Tango.MachineStudio.Developer/ViewModels/MainViewVM.cs
@@ -1,10 +1,13 @@
 using GalaSoft.MvvmLight.Ioc;
+using RealTimeGraphEx.Controllers;
+using RealTimeGraphEx.DataSeries;
 using System;
 using System.Collections.Generic;
 using System.Collections.ObjectModel;
 using System.Linq;
 using System.Text;
 using System.Threading.Tasks;
+using System.Windows.Media;
 using Tango.Core.Commands;
 using Tango.DAL.Observables;
 using Tango.MachineStudio.Common.Controls;
@@ -124,11 +127,11 @@ namespace Tango.MachineStudio.Developer.ViewModels
             set { _availableSensors = value; RaisePropertyChangedAuto(); }
         }
 
-        private ObservableCollection<RealTimeGraphControl> _graphs;
+        private ObservableCollection<IRealTimeGraph> _graphs;
         /// <summary>
         /// Gets or sets the collection of displayed graph controls.
         /// </summary>
-        public ObservableCollection<RealTimeGraphControl> Graphs
+        public ObservableCollection<IRealTimeGraph> Graphs
         {
             get { return _graphs; }
             set { _graphs = value; RaisePropertyChangedAuto(); }
@@ -180,7 +183,7 @@ namespace Tango.MachineStudio.Developer.ViewModels
                 AvailableSensors = Adapter.Sensors.ToObservableCollection();
             }
 
-            Graphs = new ObservableCollection<RealTimeGraphControl>();
+            Graphs = new ObservableCollection<IRealTimeGraph>();
         }
 
         /// <summary>
@@ -338,16 +341,39 @@ namespace Tango.MachineStudio.Developer.ViewModels
         {
             if (Graphs.Count < 8)
             {
-                RealTimeGraphControl graphControl = new RealTimeGraphControl();
+                IRealTimeGraph graphControl = null;
+
+                if (!sensor.MultiChannel)
+                {
+                    graphControl = new RealTimeGraphControl();
+                }
+                else
+                {
+                    graphControl = new RealTimeGraphMultiControl();
+                    GraphMultiController controller = new GraphMultiController();
+
+                    for (int i = 0; i < sensor.ChannelCount; i++)
+                    {
+                        controller.AddSeries(new DataYSeries()
+                        {
+                            Name = sensor.Description.First().ToString() + (i + 1),
+                            UseFillAndStroke = true,
+                            Stroke = new SolidColorBrush(Core.Helpers.ColorHelper.GetRandomColor())
+                        });
+                    }
+
+                    graphControl.Controller = controller;
+                }
+
                 graphControl.Tag = sensor;
                 graphControl.SensorName = sensor.Description;
                 graphControl.SensorUnits = sensor.Units;
-                graphControl.Graph.Minimum = sensor.Min;
-                graphControl.Graph.Maximum = sensor.Max;
-                graphControl.Graph.MaxPoints = Common.Helpers.GraphsHelper.GetMaxPoints(sensor.PointsPerFrame);
+                graphControl.InnerGraph.Minimum = sensor.Min;
+                graphControl.InnerGraph.Maximum = sensor.Max;
+                graphControl.InnerGraph.MaxPoints = Common.Helpers.GraphsHelper.GetMaxPoints(sensor.PointsPerFrame);
                 graphControl.GraphRemoveButtonPressed += (sender, __) =>
                 {
-                    RemoveGraph(sender as RealTimeGraphControl);
+                    RemoveGraph(sender as IRealTimeGraph);
                 };
                 Graphs.Add(graphControl);
                 AvailableSensors.Remove(sensor);
@@ -362,7 +388,7 @@ namespace Tango.MachineStudio.Developer.ViewModels
         /// Removes the graph.
         /// </summary>
         /// <param name="graph">The graph.</param>
-        public void RemoveGraph(RealTimeGraphControl graph)
+        public void RemoveGraph(IRealTimeGraph graph)
         {
             Graphs.Remove(graph);
             AvailableSensors.Insert(0, graph.Tag as Sensor);
diff --git a/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Controls/IRealTimeGraph.cs b/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Controls/IRealTimeGraph.cs
new file mode 100644
index 000000000..5ca930c91
--- /dev/null
+++ b/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Controls/IRealTimeGraph.cs
@@ -0,0 +1,48 @@
+using RealTimeGraphEx;
+using RealTimeGraphEx.Controllers;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace Tango.MachineStudio.Common.Controls
+{
+    public interface IRealTimeGraph
+    {
+        /// <summary>
+        /// Gets or sets the name of the sensor.
+        /// </summary>
+        String SensorName { get; set; }
+
+        /// <summary>
+        /// Gets or sets the tag.
+        /// </summary>
+        Object Tag { get; set; }
+
+        /// <summary>
+        /// Gets or sets the sensor units.
+        /// </summary>
+        String SensorUnits { get; set; }
+
+        /// <summary>
+        /// Occurs when the graph remove button has been pressed.
+        /// </summary>
+        event EventHandler GraphRemoveButtonPressed;
+
+        /// <summary>
+        /// Occurs when the graph full screen button has been pressed.
+        /// </summary>
+        event EventHandler GraphFullScreenButtonPressed;
+
+        /// <summary>
+        /// Gets or sets the inner real-time graph control.
+        /// </summary>
+        RealTimeGraphExBase InnerGraph { get; set; }
+
+        /// <summary>
+        /// Gets or sets the inner graph controller.
+        /// </summary>
+        GraphControllerBase Controller { get; set; }
+    }
+}
diff --git a/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Controls/RealTimeGraphControl.xaml b/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Controls/RealTimeGraphControl.xaml
index 687bc6030..449cea493 100644
--- a/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Controls/RealTimeGraphControl.xaml
+++ b/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Controls/RealTimeGraphControl.xaml
@@ -67,7 +67,7 @@
                     </StackPanel>
                 </Border>
                 <Border Grid.Column="1" BorderThickness="1" BorderBrush="{StaticResource borderBrush}" Background="{DynamicResource graphBackground}" Margin="5 0 0 0">
-                    <graphEx:RealTimeGraphExLineErase x:Name="Graph" x:FieldModifier="public" Antialiased="True" RefreshRate="30" MarkerColor="{StaticResource graphsMarkerColor}" FillGraph="False" Stroke="DodgerBlue">
+                    <graphEx:RealTimeGraphExLineErase x:Name="Graph" x:FieldModifier="public" Controller="{Binding RelativeSource={RelativeSource AncestorType=UserControl},Path=Controller}" Antialiased="True" RefreshRate="30" MarkerColor="{StaticResource graphsMarkerColor}" FillGraph="False" Stroke="DodgerBlue">
                         <graphEx:RealTimeGraphExLineErase.Components>
                             <components:MouseValueToolTip ToolTipTemplate="{StaticResource graphTooltipTemplate}" />
                             <components:GridLines Rows="4" Columns="6" GridBrush="{DynamicResource graphGridLinesBrush}"></components:GridLines>
diff --git a/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Controls/RealTimeGraphControl.xaml.cs b/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Controls/RealTimeGraphControl.xaml.cs
index 6396ab91a..359e52823 100644
--- a/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Controls/RealTimeGraphControl.xaml.cs
+++ b/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Controls/RealTimeGraphControl.xaml.cs
@@ -14,13 +14,15 @@ using System.Windows.Media.Animation;
 using System.Windows.Media.Imaging;
 using System.Windows.Navigation;
 using System.Windows.Shapes;
+using RealTimeGraphEx;
+using RealTimeGraphEx.Controllers;
 
 namespace Tango.MachineStudio.Common.Controls
 {
     /// <summary>
     /// Interaction logic for RealTimeGraphControl.xaml
     /// </summary>
-    public partial class RealTimeGraphControl : UserControl
+    public partial class RealTimeGraphControl : UserControl, IRealTimeGraph
     {
         #region Properties
 
@@ -46,6 +48,15 @@ namespace Tango.MachineStudio.Common.Controls
         public static readonly DependencyProperty SensorUnitsProperty =
             DependencyProperty.Register("SensorUnits", typeof(String), typeof(RealTimeGraphControl), new PropertyMetadata(null));
 
+        /// <summary>
+        /// Gets or sets the inner real-time graph control.
+        /// </summary>
+        public RealTimeGraphExBase InnerGraph { get; set; }
+
+        /// <summary>
+        /// Gets or sets the inner graph controller.
+        /// </summary>
+        public GraphControllerBase Controller { get; set; }
 
         #endregion
 
@@ -59,6 +70,8 @@ namespace Tango.MachineStudio.Common.Controls
         public RealTimeGraphControl()
         {
             InitializeComponent();
+            InnerGraph = Graph;
+            Controller = new GraphController();
         }
 
         private void OnGraphFullScreen(object sender, RoutedEventArgs e)
diff --git a/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Controls/RealTimeGraphMultiControl.xaml b/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Controls/RealTimeGraphMultiControl.xaml
new file mode 100644
index 000000000..23573e574
--- /dev/null
+++ b/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Controls/RealTimeGraphMultiControl.xaml
@@ -0,0 +1,95 @@
+<UserControl x:Class="Tango.MachineStudio.Common.Controls.RealTimeGraphMultiControl"
+             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
+             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
+             xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
+             xmlns:graphEx="clr-namespace:RealTimeGraphEx.FastGraphs;assembly=RealTimeGraphEx"
+             xmlns:components="clr-namespace:RealTimeGraphEx.Components;assembly=RealTimeGraphEx"
+             xmlns:converters="clr-namespace:Tango.MachineStudio.Common.Converters"
+             xmlns:local="clr-namespace:Tango.MachineStudio.Common.Controls"
+             mc:Ignorable="d" 
+             d:DesignHeight="150" d:DesignWidth="300">
+
+    <UserControl.Resources>
+        <ResourceDictionary>
+            <ResourceDictionary.MergedDictionaries>
+                <!--RealTimeGraphEx-->
+                <ResourceDictionary Source="pack://application:,,,/RealTimeGraphEx;component/Resources/Resources.xaml"></ResourceDictionary>
+                <ResourceDictionary Source="../Resources/MaterialDesign.xaml"></ResourceDictionary>
+
+                <ResourceDictionary>
+                    <Style TargetType="ContentControl" x:Key="graphContent">
+                        <Style.Setters>
+                            <Setter Property="ContentTemplate">
+                                <Setter.Value>
+                                    <DataTemplate>
+                                        <Grid MouseEnter="Graph_MouseEnter" MouseLeave="Graph_MouseLeave" ClipToBounds="True">
+                                            <ContentControl Content="{Binding}"></ContentControl>
+                                            <Grid Opacity="0.8" HorizontalAlignment="Stretch" VerticalAlignment="Top" ClipToBounds="True" Height="35" Margin="0 -35 0 0">
+                                                <StackPanel Orientation="Horizontal" Margin="5" HorizontalAlignment="Right" VerticalAlignment="Top">
+                                                    <Button Margin="0 0 5 0" Click="OnGraphFullScreen" ToolTip="Full Screen" Width="24" Height="24" BorderBrush="Transparent" Background="{StaticResource AccentColorBrush}" Style="{StaticResource MaterialDesignFloatingActionAccentButton}" >
+                                                        <materialDesign:PackIcon Kind="Fullscreen" HorizontalAlignment="Right" Width="20" Height="20" Foreground="{StaticResource WhiteBrush}" />
+                                                    </Button>
+                                                    <Button Click="OnGraphRemove" ToolTip="Remove" Width="24" Height="24" BorderBrush="Transparent" Background="#FF7777" Style="{StaticResource MaterialDesignFloatingActionAccentButton}" >
+                                                        <materialDesign:PackIcon Kind="CloseCircle" HorizontalAlignment="Right" Width="20" Height="20" Foreground="{StaticResource WhiteBrush}" />
+                                                    </Button>
+                                                </StackPanel>
+                                            </Grid>
+                                        </Grid>
+                                    </DataTemplate>
+                                </Setter.Value>
+                            </Setter>
+                        </Style.Setters>
+                    </Style>
+                </ResourceDictionary>
+
+                <ResourceDictionary>
+                    <converters:SecondsToGraphPointsConverter x:Key="secondsToPoints"></converters:SecondsToGraphPointsConverter>
+                </ResourceDictionary>
+            </ResourceDictionary.MergedDictionaries>
+        </ResourceDictionary>
+    </UserControl.Resources>
+
+    <Grid>
+        <!--Temperature-->
+        <ContentControl Style="{StaticResource graphContent}" Margin="0 0 5 5" MinHeight="5">
+            <Grid>
+                <Grid.ColumnDefinitions>
+                    <ColumnDefinition Width="40"/>
+                    <ColumnDefinition Width="438*"/>
+                </Grid.ColumnDefinitions>
+
+                <Border BorderBrush="{StaticResource AccentColorBrush}" BorderThickness="1 1 0 1">
+                    <StackPanel Orientation="Horizontal">
+                        <components:YAxisScroll Interval="6" Graph="{Binding ElementName=Graph}" Width="35" Foreground="{StaticResource MaterialDesignLightForeground}" VerticalOffset="-5" FontSize="8" StringFormat="#0.0"></components:YAxisScroll>
+                        <components:YAxisTicks SmallTickTemplate="{StaticResource graphTicksTemplate}" Width="5" SmallTicks="6" Foreground="{StaticResource MaterialDesignLightForeground}" BigTicks="10" Graph="{Binding ElementName=Graph}"></components:YAxisTicks>
+                    </StackPanel>
+                </Border>
+                <Border Grid.Column="1" BorderThickness="1" BorderBrush="{StaticResource borderBrush}" Background="{DynamicResource graphBackground}" Margin="5 0 0 0">
+                    <graphEx:RealTimeGraphExMultiLineErase x:Name="Graph" x:FieldModifier="public" Controller="{Binding RelativeSource={RelativeSource AncestorType=UserControl},Path=Controller}" Antialiased="True" RefreshRate="30" MarkerColor="{StaticResource graphsMarkerColor}" FillGraph="False" Stroke="DodgerBlue">
+                        <graphEx:RealTimeGraphExMultiLineErase.Components>
+                            <components:MouseValueToolTip ToolTipTemplate="{StaticResource graphTooltipTemplate}" />
+                            <components:GridLines Rows="4" Columns="6" GridBrush="{DynamicResource graphGridLinesBrush}"></components:GridLines>
+                        </graphEx:RealTimeGraphExMultiLineErase.Components>
+                        <graphEx:RealTimeGraphExMultiLineErase.InnerContent>
+                            <Grid>
+                                <Label Style="{StaticResource graphLabel}">
+                                    <StackPanel Orientation="Horizontal">
+                                        <TextBlock VerticalAlignment="Center" Text="{Binding RelativeSource={RelativeSource AncestorType=UserControl,AncestorLevel=2},Path=SensorName,FallbackValue='Dispensers Motors'}"></TextBlock>
+                                        <TextBlock Foreground="Gray" Margin="10 0 0 0" FontFamily="Sylfaen Regular" VerticalAlignment="Center" Text="{Binding RelativeSource={RelativeSource AncestorType=UserControl,AncestorLevel=2},Path=SensorUnits,FallbackValue='(hz)'}"></TextBlock>
+                                    </StackPanel>
+                                </Label>
+                            </Grid>
+                        </graphEx:RealTimeGraphExMultiLineErase.InnerContent>
+                    </graphEx:RealTimeGraphExMultiLineErase>
+                </Border>
+
+                <Border Grid.Column="2" Margin="5 0 0 0" HorizontalAlignment="Right" Opacity="0.8">
+                    <components:YAxisLegends VerticalAlignment="Center" Margin="0 0 5 0" Graph="{Binding ElementName=Graph}" Width="70" FlowDirection="RightToLeft" LegendTemplate="{StaticResource graphLegendTemplate}">
+                    </components:YAxisLegends>
+                </Border>
+            </Grid>
+        </ContentControl>
+    </Grid>
+</UserControl>
diff --git a/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Controls/RealTimeGraphMultiControl.xaml.cs b/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Controls/RealTimeGraphMultiControl.xaml.cs
new file mode 100644
index 000000000..5cb69b786
--- /dev/null
+++ b/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Controls/RealTimeGraphMultiControl.xaml.cs
@@ -0,0 +1,107 @@
+using RealTimeGraphEx;
+using RealTimeGraphEx.Controllers;
+using System;
+using System.Collections.Generic;
+using System.ComponentModel;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using System.Windows;
+using System.Windows.Controls;
+using System.Windows.Data;
+using System.Windows.Documents;
+using System.Windows.Input;
+using System.Windows.Media;
+using System.Windows.Media.Animation;
+using System.Windows.Media.Imaging;
+using System.Windows.Navigation;
+using System.Windows.Shapes;
+
+namespace Tango.MachineStudio.Common.Controls
+{
+    /// <summary>
+    /// Interaction logic for RealTimeGraphControl.xaml
+    /// </summary>
+    public partial class RealTimeGraphMultiControl : UserControl , IRealTimeGraph
+    {
+        #region Properties
+
+        /// <summary>
+        /// Gets or sets the name of the sensor.
+        /// </summary>
+        public String SensorName
+        {
+            get { return (String)GetValue(SensorNameProperty); }
+            set { SetValue(SensorNameProperty, value); }
+        }
+        public static readonly DependencyProperty SensorNameProperty =
+            DependencyProperty.Register("SensorName", typeof(String), typeof(RealTimeGraphMultiControl), new PropertyMetadata(null));
+
+        /// <summary>
+        /// Gets or sets the sensor units.
+        /// </summary>
+        public String SensorUnits
+        {
+            get { return (String)GetValue(SensorUnitsProperty); }
+            set { SetValue(SensorUnitsProperty, value); }
+        }
+        public static readonly DependencyProperty SensorUnitsProperty =
+            DependencyProperty.Register("SensorUnits", typeof(String), typeof(RealTimeGraphMultiControl), new PropertyMetadata(null));
+
+        /// <summary>
+        /// Gets or sets the inner real-time graph control.
+        /// </summary>
+        public RealTimeGraphExBase InnerGraph { get; set; }
+
+        /// <summary>
+        /// Gets or sets the inner graph controller.
+        /// </summary>
+        public GraphControllerBase Controller { get; set; }
+
+        #endregion
+
+        #region Events
+
+        public event EventHandler GraphRemoveButtonPressed;
+        public event EventHandler GraphFullScreenButtonPressed;
+
+        #endregion
+
+        public RealTimeGraphMultiControl()
+        {
+            InitializeComponent();
+            InnerGraph = Graph;
+            Controller = new GraphMultiController();
+        }
+
+        private void OnGraphFullScreen(object sender, RoutedEventArgs e)
+        {
+            GraphFullScreenButtonPressed?.Invoke(this, new EventArgs());
+        }
+
+        private void Graph_MouseEnter(object sender, MouseEventArgs e)
+        {
+            Grid mainGrid = sender as Grid;
+            var headerGrid = mainGrid.Children.OfType<Grid>().ToList().First();
+            ThicknessAnimation ani = new ThicknessAnimation();
+            ani.To = new Thickness(0, 0, 0, 0);
+            ani.Duration = TimeSpan.FromSeconds(0.2);
+            headerGrid.BeginAnimation(Grid.MarginProperty, ani);
+        }
+
+        private void Graph_MouseLeave(object sender, MouseEventArgs e)
+        {
+            Grid mainGrid = sender as Grid;
+            var headerGrid = mainGrid.Children.OfType<Grid>().ToList().First();
+            ThicknessAnimation ani = new ThicknessAnimation();
+            ani.To = new Thickness(0, -35, 0, 0);
+            ani.Duration = TimeSpan.FromSeconds(0.2);
+            headerGrid.BeginAnimation(Grid.MarginProperty, ani);
+        }
+
+        private void OnGraphRemove(object sender, RoutedEventArgs e)
+        {
+            GraphRemoveButtonPressed?.Invoke(this, new EventArgs());
+        }
+    }
+}
diff --git a/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Resources/MaterialDesign.xaml b/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Resources/MaterialDesign.xaml
index cc18c31c5..8c5464930 100644
--- a/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Resources/MaterialDesign.xaml
+++ b/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Resources/MaterialDesign.xaml
@@ -267,6 +267,46 @@
                 </Border>
             </DataTemplate>
 
+            <!--Graph Legend Template-->
+            <DataTemplate x:Key="graphLegendTemplate">
+                <Border Width="20" Height="20" Margin="2">
+                    <Grid>
+                        <ToggleButton IsChecked="{Binding IsVisible}" Padding="0" Margin="0" Background="Transparent" BorderBrush="{x:Null}" BorderThickness="0">
+                            <ToggleButton.Style>
+                                <Style TargetType="ToggleButton">
+                                    <Setter Property="Template">
+                                        <Setter.Value>
+                                            <ControlTemplate>
+                                                <Grid Background="Transparent">
+                                                    <Grid>
+                                                        <Ellipse HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Fill="{StaticResource graphLegendBackground}" StrokeThickness="1">
+                                                            <Ellipse.Style>
+                                                                <Style TargetType="Ellipse">
+                                                                    <Style.Triggers>
+                                                                        <DataTrigger Binding="{Binding IsVisible}" Value="True">
+                                                                            <Setter Property="Stroke" Value="{Binding Stroke}"></Setter>
+                                                                        </DataTrigger>
+                                                                        <DataTrigger Binding="{Binding IsVisible}" Value="False">
+                                                                            <Setter Property="Stroke" Value="Transparent"></Setter>
+                                                                        </DataTrigger>
+                                                                    </Style.Triggers>
+                                                                </Style>
+                                                            </Ellipse.Style>
+                                                        </Ellipse>
+                                                        <TextBlock FontSize="8" Text="{Binding Name}" VerticalAlignment="Center" Foreground="Black" FontWeight="DemiBold" HorizontalAlignment="Center"></TextBlock>
+                                                    </Grid>
+                                                </Grid>
+                                            </ControlTemplate>
+                                        </Setter.Value>
+                                    </Setter>
+                                </Style>
+                            </ToggleButton.Style>
+                        </ToggleButton>
+                    </Grid>
+                </Border>
+            </DataTemplate>
+            <!--Graph Legend Template-->
+
             <!--Extensions-->
 
         </ResourceDictionary>
diff --git a/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Tango.MachineStudio.Common.csproj b/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Tango.MachineStudio.Common.csproj
index b89ec2e09..bc7f00d58 100644
--- a/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Tango.MachineStudio.Common.csproj
+++ b/Software/Visual_Studio/MachineStudio/Tango.MachineStudio.Common/Tango.MachineStudio.Common.csproj
@@ -71,6 +71,10 @@
     <Reference Include="PresentationFramework" />
   </ItemGroup>
   <ItemGroup>
+    <Compile Include="Controls\IRealTimeGraph.cs" />
+    <Compile Include="Controls\RealTimeGraphMultiControl.xaml.cs">
+      <DependentUpon>RealTimeGraphMultiControl.xaml</DependentUpon>
+    </Compile>
     <Compile Include="Controls\RealTimeGraphControl.xaml.cs">
       <DependentUpon>RealTimeGraphControl.xaml</DependentUpon>
     </Compile>
@@ -103,6 +107,10 @@
     <Compile Include="Navigation\INavigationManager.cs" />
     <Compile Include="Navigation\NavigationView.cs" />
     <Compile Include="Notifications\INotificationProvider.cs" />
+    <Page Include="Controls\RealTimeGraphMultiControl.xaml">
+      <Generator>MSBuild:Compile</Generator>
+      <SubType>Designer</SubType>
+    </Page>
     <Page Include="Controls\RealTimeGraphControl.xaml">
       <SubType>Designer</SubType>
       <Generator>MSBuild:Compile</Generator>
diff --git a/Software/Visual_Studio/SideChains/RealTimeGraphEx/FastGraphs/RealTimeGraphExLineScroll.cs b/Software/Visual_Studio/SideChains/RealTimeGraphEx/FastGraphs/RealTimeGraphExLineScroll.cs
index 216683d39..a2260030c 100644
--- a/Software/Visual_Studio/SideChains/RealTimeGraphEx/FastGraphs/RealTimeGraphExLineScroll.cs
+++ b/Software/Visual_Studio/SideChains/RealTimeGraphEx/FastGraphs/RealTimeGraphExLineScroll.cs
@@ -40,18 +40,6 @@ namespace RealTimeGraphEx.FastGraphs
 
         #region Properties
 
-        /// <summary>
-        /// Gets or sets the maximum vectorsCollection to display on the graph (default 1000, affects performance).
-        /// </summary>
-        public int MaxPoints
-        {
-            get { return (int)GetValue(MaxPointsProperty); }
-            set { SetValue(MaxPointsProperty, value); }
-        }
-        public static readonly DependencyProperty MaxPointsProperty =
-            DependencyProperty.Register("MaxPoints", typeof(int), typeof(RealTimeGraphExLineScroll), new PropertyMetadata(1000, new PropertyChangedCallback(CrossModelChanged)));
-
-
         /// <summary>
         /// Gets or sets the graph fill color.
         /// </summary>
diff --git a/Software/Visual_Studio/SideChains/RealTimeGraphEx/RealTimeGraphExBase.cs b/Software/Visual_Studio/SideChains/RealTimeGraphEx/RealTimeGraphExBase.cs
index cf8d6c0fe..c1ed37474 100644
--- a/Software/Visual_Studio/SideChains/RealTimeGraphEx/RealTimeGraphExBase.cs
+++ b/Software/Visual_Studio/SideChains/RealTimeGraphEx/RealTimeGraphExBase.cs
@@ -349,6 +349,17 @@ namespace RealTimeGraphEx
         public static readonly DependencyProperty ZoomDirectionProperty =
             DependencyProperty.Register("ZoomDirection", typeof(ZoomDirectionEnum), typeof(RealTimeGraphExBase), new PropertyMetadata(ZoomDirectionEnum.Both));
 
+        /// <summary>
+        /// Gets or sets the maximum points to display on the graph (default 1000).
+        /// </summary>
+        public int MaxPoints
+        {
+            get { return (int)GetValue(MaxPointsProperty); }
+            set { SetValue(MaxPointsProperty, value); }
+        }
+        public static readonly DependencyProperty MaxPointsProperty =
+            DependencyProperty.Register("MaxPoints", typeof(int), typeof(RealTimeGraphExBase), new PropertyMetadata(1000, new PropertyChangedCallback(CrossModelChanged)));
+
         #endregion
 
         #region Cross Thread Fields
diff --git a/Software/Visual_Studio/SideChains/RealTimeGraphEx/RealTimeGraphExMultiBase.cs b/Software/Visual_Studio/SideChains/RealTimeGraphEx/RealTimeGraphExMultiBase.cs
index d9edc478e..108ff4ea3 100644
--- a/Software/Visual_Studio/SideChains/RealTimeGraphEx/RealTimeGraphExMultiBase.cs
+++ b/Software/Visual_Studio/SideChains/RealTimeGraphEx/RealTimeGraphExMultiBase.cs
@@ -22,18 +22,6 @@ namespace RealTimeGraphEx
 
         #region Properties
 
-        /// <summary>
-        /// Gets or sets the maximum points to display on the graph (default 1000).
-        /// </summary>
-        public int MaxPoints
-        {
-            get { return (int)GetValue(MaxPointsProperty); }
-            set { SetValue(MaxPointsProperty, value); }
-        }
-        public static readonly DependencyProperty MaxPointsProperty =
-            DependencyProperty.Register("MaxPoints", typeof(int), typeof(RealTimeGraphExMultiBase), new PropertyMetadata(1000, new PropertyChangedCallback(CrossModelChanged)));
-
-
         /// <summary>
         /// Gets or sets the collection of data series to display on the graph.
         /// </summary>
diff --git a/Software/Visual_Studio/Tango.Core/Helpers/ColorHelper.cs b/Software/Visual_Studio/Tango.Core/Helpers/ColorHelper.cs
index c5ebc7474..3d0532985 100644
--- a/Software/Visual_Studio/Tango.Core/Helpers/ColorHelper.cs
+++ b/Software/Visual_Studio/Tango.Core/Helpers/ColorHelper.cs
@@ -12,6 +12,8 @@ namespace Tango.Core.Helpers
     /// </summary>
     public static class ColorHelper
     {
+        private static Random rnd = new Random();
+
         /// <summary>
         /// Converts the specified color to integer.
         /// </summary>
@@ -36,5 +38,14 @@ namespace Tango.Core.Helpers
             byte b = (byte)(integer >> 0);
             return Color.FromArgb(a, r, g, b);
         }
+
+        /// <summary>
+        /// Returns a random color.
+        /// </summary>
+        /// <returns></returns>
+        public static Color GetRandomColor()
+        {
+            return Color.FromRgb((byte)rnd.Next(256), (byte)rnd.Next(256), (byte)rnd.Next(256));
+        }
     }
 }
-- 
cgit v1.3.1