The Design And Development Of Cross-platform Graph Configuration Based On HTML5 And SVG

The most popular and advanced front-end development technology is HTML5. As a collection of some independent characteristic, HTML5 is the next generation of web standard. The graphic configuration software is the core of the configuration software, now there is no cross-platform configuration software which supports wireless application. The application of HTML5 technology in configuration software is a novel thing.In order to meet the needs of new graphical configuration which edit and real-time operate by different platforms, firstly, we analyzed several graphics technology, select HTML5 and SVG as the technical basis for software development, then we talked about the used framework, combined with the functional requirements of industrial graphic configuration software, designed a production based on HTML5 and SVG, users can supervise and control through computer, phone and other platforms. The graphics configuration has three main features:modularization, based on WEB, cross-platform. The work focus on configuration edit part, graphical editor can direct play in PC webpage, and real-time monitor in PC/Mobile browser.For the configuration editor, using HTML5 standard and SVG technology and the object-oriented design idea, designed and implementation of graphics editing interface, while completed a configuration editor support by a variety of PC browsers; display part use HTML5<canvas> technology and RGraph drawing controller, drawing trends pictures and statistical charts at the client level, improved the real-time performance and convenience. The designed production draw the monitor trends and statistics charts without the browser download plugins, providing support for the configuration and operation of the data storage module. Since development for the browser, the browsers of different platforms will be able to achieve real-time monitoring and historical data querying.