Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
SVG in Data Acquisition and     Control Systems          Tao Jiang       Boston Scientific                              1
Jet Engine Test Cells and        Data Acquisition System• Most software are custom made just like a web site.• Highly conf...
New Data Acquisition and Control            System• Browser based interface• Remotely monitoring and controlling Capabilit...
Architecture OverviewClient Layer  Excel Reporting   Java Applet/Application       User Configurable         .NET Applicat...
Presentation Layer• Excel reporting system: is a test report design  and generation system built on the top of  Microsoft ...
SVG based displays using Adobe        SVG Viewer                                   Browser Based Web Client               ...
Custom GUI Components•   Create reusable user interface component in SVG.•   Define new SVG tag for reusable component.•  ...
Data Binding                                                                                        Display 1             ...
GUI editor supporting custom GUI Components•   Works similar to using    Microsoft Visio.•   Select widget from the    lib...
Create Displays•   Add background    image can make    better looking    displays.•   Add a half transparent    rectangle ...
Customize Widget•   Select the widget first.•   Press Edit Widget    button on toolbar.•   Item Properties dialog    (XML ...
System Performance on SVG            Approach• Pure browser based solution cannot achieve the  desirable performance for J...
Conclusion• Turn a traditional data acquisition and  control system into an open platform and  building a presentation fra...
Upcoming SlideShare
Loading in …5
×

SVG in Data Acquisition and Control Systems

700 views

Published on

A real life example of using SVG in data acquisition and control system domain. The system is currently being used by various airline and engine maintenance companies around the world. The major challenges involve:

1. GUI widget creation using SVG.
2. GUI editor supporting SVG component.
3. Fast SVG rendering with continuously data updating (>20HZ) (not just fast initial loading)
4. Real time enhancement on JFreeChart.

Published in: Technology
  • Be the first to comment

  • Be the first to like this

SVG in Data Acquisition and Control Systems

  1. 1. SVG in Data Acquisition and Control Systems Tao Jiang Boston Scientific 1
  2. 2. Jet Engine Test Cells and Data Acquisition System• Most software are custom made just like a web site.• Highly configurable on hardware configuration, control logic, calculating engine test data and user interface.• Need to be field-programmable during system installation. 2
  3. 3. New Data Acquisition and Control System• Browser based interface• Remotely monitoring and controlling Capability• Live real-time test data updating at least 10 frames/second• Easily Configured 3
  4. 4. Architecture OverviewClient Layer Excel Reporting Java Applet/Application User Configurable .NET Application System for standard displays Displays in SVG (DVR) TV Monitor HTTP/HTTPS Video Playback Web Service Layer Web Service for Data Retrieved Web Service for Web Service for Real time test Engine Test and Test Report Plot Analysis data Streamer Calibration History UNIX domain socket (aka. Named Pipe) Multi-chanel DVR records test process Data Processing and Control Layer Test Data Test Control Data and Limits Calibration Calculations Logic Event Logging Oracle Database Device Driver Layer External MPI Driver for PSI Driver for DTS Driver for Continuous Fanuc PLC Controller Vibration Pressure Temperature Data Logging Driver Driver Data Data Data Transient Data Logging 4
  5. 5. Presentation Layer• Excel reporting system: is a test report design and generation system built on the top of Microsoft Excel.• .NET application for DVR playback: is used to playback test data in-sync with multi-channel video recording on the engine test process.• User configurable displays in SVG: are displays specially ordered by customer and they can be changed in the field or even during the engine test in progress. 5
  6. 6. SVG based displays using Adobe SVG Viewer Browser Based Web Client SVG GUI Adobe SVG Viewer SVG based Displays Component library. Updating SVG Response DOM User Interaction JavaScript Decoded binary Make SOAP stream Call Invisible Java Applet Web Service for Real time test Engine Test and data Streamer Calibration 6
  7. 7. Custom GUI Components• Create reusable user interface component in SVG.• Define new SVG tag for reusable component.• There is no need to do JavaScript programming because GUI components behavior is controlled through its parameters value.• All components are absolutely positioned and No need to do layout. Resizing the page will resize each components proportionally.<ui:momentarybutton enabled="1" height="70" icon="" id="ui:momentarybutton315" set_value="1“ tooltiptext="Momentary Push Button" transform="matrix(1 0 0 1 472.52470204846236 -9)" value="0" visible="1“ width="75" x="174" y="583" buttonStyle="3"> <parameter name="IDGDisc_MB" value="0"/> <text_style font="Arial" fontstyle="bold" font-size="14"/> <label_config> <offlabel color="green" label="IDGnDisconnect" text-color="black"/> <onlabel color="orange" label="IDGnDisconnect" text-color="black"/> </label_config> <interlock>lockexp</interlock> <waitforcondition>waitexp</waitforcondition></ui:momentarybutton> 7
  8. 8. Data Binding Display 1 Streaming Data Local Data A Objects C B SOAP Command Global Data Data Processing Objects Display 2 SOAP Command Local Data D Objects F E Streaming Data• Each GUI component has one or more data objects (parameters), representing the component data value, attributes, etc.• The application framework takes care of issuing SOAP command and distributing streaming data to GUI components. The client side developer only needs to take care of assembling GUI component and parameter mapping. 8
  9. 9. GUI editor supporting custom GUI Components• Works similar to using Microsoft Visio.• Select widget from the library listed on left hand side. Click the tab to choose different group of library.• Click on drawing board to put widget.• Click on the widget to select it. A rectangle toolbox will surround it. Use tools to spin, resize, and move.• Once widget is selected. It can be deleted as well. 9
  10. 10. Create Displays• Add background image can make better looking displays.• Add a half transparent rectangle to shade the background image in order to make the front widgets stand out.• Widgets can be tilted or skewed to have special effect. 10
  11. 11. Customize Widget• Select the widget first.• Press Edit Widget button on toolbar.• Item Properties dialog (XML Editor) pops up.• Widget’s properties are stored in a XML structure. It can be customized by setup node and attribute values accordingly.• Navigate the tree structure of the selected item properties and choose attributes to configure. 11
  12. 12. System Performance on SVG Approach• Pure browser based solution cannot achieve the desirable performance for Jet engine testing.• Batik SVG Toolkit isn’t fast enough.• Finally, a simple special purpose SVG rendering engine is created.• Most custom GUI components are implemented by creating a custom UI delegate for a surrogate host in Java Swing component. SVG rendering engine is used to paint each state. 12
  13. 13. Conclusion• Turn a traditional data acquisition and control system into an open platform and building a presentation framework based on SVG has been proven to be successful.• Until now, Cencos new data acquisition and control system has been installed and in production use in Germany, India, Saudi Arabia, Egypt, China and growing. 13

×