VizEx View HTML5 Workshop
0 likes261 views
The document outlines a technology workshop on Vizex View HTML5, presenting a new tool for rendering CGM files without the need for plugins like ActiveX. It highlights the advantages of HTML5, including multimedia integration and compatibility across various devices, while providing details on the workshop agenda, background on computer graphics standards, and an evaluation program for implementation. The session concludes with a Q&A and invitations to join the feedback program for developers.
VizEx View HTML5 Workshop
- 1. Presenter Don Larson – CEO Moderator Dave Manock Technology Workshop VizEx View HTML5 February 23rd-25th 2016
- 2. Workshop - VizEx View – CGM HTML5 • The muting and unmuting of delegates will be supervised by the the organizers • Live questions will be taken in Q&A • Please click the ‘Raise Hand’ button • You can also Post questions during webinar using Questions panel • If you experience problems when joining the webinar please use the questions function to communicate • VOIP is the recommended audio option • Handouts can be downloaded during the presentation • Audio Q&A sessions will be available during the presentation www.cgmlarson.com Copyright Larson Software Technology (c) 2016
- 3. Agenda • Technology Introduction • VizEx View HTML5 Demonstration • Q&A • Implementation of the Product • Supporting Documentation (SDK) • Resources • Evaluation Program • Final Q&A session and Closing remarks www.cgmlarson.com Copyright Larson Software Technology (c) 2016
- 4. Background (1) - Overview Computer Graphics Metafile ISO (International Organization for Standardization) standard for vector and composite vector/raster picture definition since 1987. HyperText Markup Language The cornerstone of the W3C's open web platform; a framework designed to foster innovation and develop the full potential the web has to offer. Web Graphics Library A JavaScript API for rendering interactive 3D computer graphics and 2D graphics within any compatible web browser without the use of plug-ins. www.cgmlarson.com Copyright Larson Software Technology (c) 2016
- 5. Background (2) – HTML5 • HyperText Markup Language (HTML) • Core technology of the Internet used for structuring and presenting content on the World Wide Web • Not owned, non-proprietary • HTML5 adds many new syntactic features including: • <video>, <audio> and <canvas> elements • Additionally the integration of the SVG graphics format • The new features are primarily designed to enable multimedia delivery without using plug-ins • Device-independent design to work on broad array of devices PCs, smartphones and tablets • Introduces several application programming interfaces (APIs) for complex web applications www.cgmlarson.com Copyright Larson Software Technology (c) 2016
- 6. Background (3) – WebGL • JavaScript API for rendering interactive 3D and 2D graphics • Designed and maintained by the non-profit Khronos Group • Completely integrated into all the web standards of the browser permitting GPU acceleration. • No plug-in required in a compatible web browser • WebGL is widely supported in modern browsers. www.cgmlarson.com Copyright Larson Software Technology (c) 2016
- 7. • ActiveX weaknesses • Has to be installed on the target computer • Strongly criticized for security problems • ActiveX Browser Support • Microsoft Edge browser - Support dropped • Good indication the technology will phased out • Chrome and Firefox still support ActiveX • Future strategy unknown • A solution without the reliance on a plug-in will be beneficial New Technology ActiveX alternative? www.cgmlarson.com Copyright Larson Software Technology (c) 2016
- 8. VizEx View HTML5 Live Demo www.cgmlarson.com Copyright Larson Software Technology (c) 2015
- 9. How it works Code server (VizExView.js and License file) Hosted for evaluations on cgmlarson.com Desktop clients (Windows, Linux, Macs) Tablets (Android, iOS, Windows) Document server (html, cgms, images)
- 10. • VizEx View HTML5 Evaluation page • Getting started document • API Document • Live Examples Getting Started
- 11. Migrating ActiveX to HTML5 ActiveX HTML code: <HTML> <HEAD> </HEAD> <BODY> <OBJECT TYPE=“image/cgm “ ID="cgm" WIDTH=“100%" HEIGHT=“800" > <PARAM NAME="SRC" value="ALLELM01.cgm"> </OBJECT> </BODY> </HTML> HTML5 code : <!DOCTYPE html> <html> <head> </head> <body> <canvas id="cgm" width="100%" height=“800px"></canvs> <script> var Module = { canvas: document.getElementById('cgm') , src: ="ALLELM01.cgm"}; </script> <script src="http://www.cgmlarson.com/demos/jsViewer/VizExView.js"></script> </body> </html> * No changes to CGM is required
- 12. Customizing the Toolbar <div class="toolbar" id="toolbar"> <img id="openfile" src="images/Open.png" alt="HTML5" onclick="document.getElementById('fileInput').click()“ title="Open a CGM file from your local machine." /> <img id="opennetfile" src="images/Net_open.png" alt="HTML5" onclick="Module.promptURLFile()“ title="Open a CGM file from the server" /> <img id="scale2fit" src="images/Scale_to_fit.png" alt="HTML5" onclick="getWebCGMDocument().setMapping(0)“ title="Scale to fit." /> <img id="scale2width" src="images/Scale_to_width.png" alt="HTML5" onclick="getWebCGMDocument().setMapping(1)“ title="Scale to width." /> <img id="scale2-100" src="images/Scale_to_100.png" alt="HTML5" onclick="getWebCGMDocument().setMapping(3)“ title="Scale to actual size." /> <img id="zoommode" src="images/Zoom_mode.png" alt="HTML5" onclick="getWebCGMDocument().setZoomPanMode(0)“ title="Zoom to selected rectangle." /> <img id="zoomin" src="images/Zoom_in.png" alt="HTML5" onclick="getWebCGMDocument().setZoomPanMode(2)“ title="Zoom in." /> <img id="zoomout" src="images/Zoom_out.png" alt="HTML5" onclick="getWebCGMDocument().setZoomPanMode(3)" title="Zoom out." /> <img id="panmode" src="images/Pan_mode.png" alt="HTML5" onclick="getWebCGMDocument().setZoomPanMode(1)“ title="Pan zoomed image." /> <img id="toggleHots" src="images/Show_hotspots.png" alt="HTML5" onclick="toggleHighlightsFunc()“ title="Toggle highlight on and off." /> <img id="about" src="images/About-trans.png" alt="HTML5" onclick="Module.about()“ title="Information about VizEx View HTML5." /> </div>
- 13. Q&A www.cgmlarson.com Copyright Larson Software Technology (c) 2016
- 14. • The benefits of the new technology are significant: • Full CGM support • Fast and quality rendering • No Plug-in required • No software installation required • Easily accessible • Configurable toolbar offering full control over the graphic display • S1000D and ATA iSpec 2200 compliant The Benefits www.cgmlarson.com Copyright Larson Software Technology (c) 2016
- 15. • Join the program • High Level - Candidate Criteria: • Have a real-life application for technology implementation • Possess the expertise to implement • Designate Evaluation Contact person • Provide product feedback • Access to product developer Join the Evaluation Program www.cgmlarson.com Copyright Larson Software Technology (c) 2016
- 16. • The new Larson technology will change the way CGM files are displayed on the web and IETP’s • ActiveX plug-in issues will be eliminated • IT departments will be your friend • Apply for the program and become part of the Evolution of CGM Viewing Q&A and Final remarks www.cgmlarson.com Copyright Larson Software Technology (c) 2016
- 17. Closing Information Thank you for attending • Supporting Information • VizEx View - HTML5 Product Datasheet • CGM Infographic • www.slideshare.com/donlarson1 • Upcoming Larson Events • Webinar March 30th 11am Eastern • Previewing VizEdit Version 11.00 • New Drawing and CAD Import functions • Registration opening soon Follow Us www.cgmlarson.com Copyright Larson Software Technology (c) 2015