CN103559353A - Design method of dynamic behavior format in picture configuration of monitoring system based on SVG (scalable vector graphics) - Google Patents
Design method of dynamic behavior format in picture configuration of monitoring system based on SVG (scalable vector graphics) Download PDFInfo
- Publication number
- CN103559353A CN103559353A CN201310549766.0A CN201310549766A CN103559353A CN 103559353 A CN103559353 A CN 103559353A CN 201310549766 A CN201310549766 A CN 201310549766A CN 103559353 A CN103559353 A CN 103559353A
- Authority
- CN
- China
- Prior art keywords
- dynamic behaviour
- svg
- animation
- type
- picture configuration
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Granted
Links
Abstract
The invention discloses a design method of a dynamic behavior format in picture configuration of a monitoring system based on SVG (scalable vector graphics). The design method comprises a message registration mechanism and format design step, and a dynamic behavior concluding and format design step. The design method has the advantages that through analyzing various drawing operations and dynamic behaviors in the picture configuration of the monitoring system, the required dynamic behaviors in the monitored picture configuration are concluded and summarized, and then, through expanding SVG marks, the expressions of various dynamic behaviors are formatted into XML (extensive markup language) elements to be merged into the SVG.
Description
Technical field
The design is by various mapping operations and dynamic behaviour in picture configuration in analysis monitoring system, after dynamic behaviour required in monitored picture configuration is concluded and is summed up, by expansion SVG mark, the expression format of various dynamic behaviours is turned to XML element, be dissolved in SVG.The real-time pictures assembly of supervisory system is by reading the primitive information in SVG file, and the dynamic behaviour information that depends on pel, reconstruct real-time pictures.Reconstruct both can be still based on SVG form, also can be specific to the realization of different real-time pictures assemblies.
Background technology
SVG(Scalable Vector Graphics, scalable vector graphics) based on extend markup language (XML), for describing a kind of graphical format of two-dimension vector graphics.It strictly defers to XML grammer, and carrys out Description Image content with the descriptive language of text formatting, is a kind of and the irrelevant vector graphics format of image resolution ratio.SVG is formulated by W3C, is an open standard, has obtained the support of each main flow browser at present.Web developer only need be directly embedded into the SVG code of the vector image of being made by SVG drawing tool in XHTML and just can in browser, show image.Because SVG is the same with XHTML, be all strict XML form, therefore developer can operate element and attribute wherein by Web front end scripts such as JavaScript, SVG image Display Realization in browser is dynamically controlled, be aided with again the means of communication between the Web clients such as AJAX, WebSocket and server, by the message informing from server, triggered the execution of Web front end script function, just can realize the SCADA function based on Web.
Even if do not need a set of SCADA system based on Web technology, also can define a set of SCADA picture configuration instrument with SVG.Use the advantage of a set of like this picture configuration instrument to be:
1) the SVG graphic making instrument of existing many moneys maturation at present, and a lot of instrument is still increased income.If we need the picture configuration assembly in a set of SCADA tool software, the picture configuration assembly of the SVG graphic making too development SCADA system based on such can save a lot of workloads;
2) SVG carrys out Description Image content with the descriptive language of text formatting, readable strong, even if also can not understand implication wherein by instrument;
3) SVG form is formulated by W3C, standard and being widely known by the people.Different SCADA producers can be according to the adapter of the picture configuration file of SCADA product customization SVG form separately, picture configuration is translated as to the form that SCADA product can be identified separately, the achievement of multiplexing SCADA picture configuration, reduces the workload of bringing due to replacing system.
Yet, the SVG standard of W3C issue comprises is only the contents such as the drafting of X-Y scheme and animation operation, for SVG can be used in SCADA field, should add the common required support details of dynamic change in some SCADA pictures supervision, the present invention has carried out detailed design to this partial content, by the expansion to SVG standard, realized the perfect adaptation of SVG and SCADA picture configuration.
Summary of the invention
For the problem of prior art existence, the present invention proposes the method for designing of dynamic behaviour form in a kind of supervisory system picture configuration based on SVG.The content of invention mainly comprises: the conclusion of message login mechanism and form design procedure and dynamic behaviour and form design procedure.Described message registration is the foundation of obtaining the dynamic change of picture image state, and in SCADA system, picture image state variation is used for reflecting the variation of real time data value, and therefore, message registration is exactly that specify image state variation is by the real time data of foundation; The conclusion of described dynamic behaviour comprises: Fill Color, line color, line style, live width, observability, word content, rotation, directions X convergent-divergent, Y-direction convergent-divergent, directions X translation, Y-direction translation, colour switching animation, rotation animation, displacement animation and convergent-divergent animation; The conclusion of described dynamic behaviour is different according to the mode of logical definition, can be divided into again: selection type dynamic behaviour, proportional-type dynamic behaviour and the dynamic behaviour of animation type; Wherein, the feature of described selection type dynamic behaviour is that the real time data value of variation is joined in an expression formula and calculated, the result that this expression formula is calculated is the value of this dynamic behaviour association attributes, comprises Fill Color, line color, line style, live width, observability and word content; The feature of described proportional-type dynamic behaviour is by pre-defined two class values of user, one group is the variation range of real time data, another group is the variation range of dynamic behaviour correlation attribute value, comprises rotation, directions X convergent-divergent, Y-direction convergent-divergent, directions X translation and Y-direction translation; The expression formula of described animation type dynamic behaviour is to return to logical truth or logical falsehood, and the dynamic behaviour of animation type need define the information such as stepping, variation range, comprises colour switching animation, rotation animation, convergent-divergent animation and displacement animation.
Beneficial effect: the present invention is by various mapping operations and dynamic behaviour in picture configuration in analysis monitoring system, after dynamic behaviour required in monitored picture configuration is concluded and is summed up, by expansion SVG mark, the expression format of various dynamic behaviours is turned to XML element, be dissolved in SVG.The present invention is directed to the design of the required support details of dynamic change common in the supervision of SCADA picture, by the expansion to SVG standard, realized the perfect adaptation of SVG and SCADA picture configuration.
Embodiment
Below in conjunction with specific embodiment, the present invention is further elaborated.
In order to make SVG can support the dynamic behaviour in SCADA monitored picture, need to notify by registration message, also need to calculate the content of message informing, then result is applied in SVG primitive attribute.The present embodiment comprises conclusion and the format design of message login mechanism and format design and dynamic behaviour, in addition, also have some other contents, such as descriptor, module title, affiliated classification etc., also should be included in SVG, but these contents do not belong to Core Feature, so the present embodiment is not described.
1) message login mechanism and format design
Message registration is the foundation of obtaining the dynamic change of picture image state, and in SCADA system, picture image state variation is used for reflecting the variation of real time data value, and therefore, message registration is exactly that specify image state variation is by the real time data of foundation.
Here, in order to make the image of definition can be farthest in addition multiplexing, applicant has used for reference the parameter of function and the concept of argument in programming language, when defining, image only specifies the type of its associated real time data, and do not specify concrete real time data, this image instantiation in real-time pictures time again row specify.
User must specify this image by type and the quantity of associated real time data type when definition image, then with the XML tag of expansion, content is added in SVG, and the DTD that describes this part extending marking is as follows:
<!ELEMENT?svg(schematicconfiguration,…)>
<!ELEMENT?schematicconfiguration(runtimedatapointer+)>
<!ELEMENT?runtimedatapointer(#PCDATA)>
<!ATTLIST?runtimedatapointer?id?ID#REQUIRED>
<!ATTLIST?runtimedatapointer?label?CDATA#REQUIRED>
<!ATTLIST?runtimedatapointer?datatype?CDATA#REQUIRED>。
This paragraph format has defined real time data quantity and the type with SVG file association, in form, and the global information in schematicconfiguration element definition SVG file, its father node is the root node of SVG file; Schematicconfiguration element can have a plurality of runtimedatapointer elements as its child node, and the quantity of its lower runtimedatapointer node has defined the quantity of the real time data of SVG file association; Runtimedatapointer element definition real time data information, because a SVG file can have the real time data of a plurality of same types, so its id attribute is the unique identification of the different runtimedatapointer of difference, by system, automatically generated; Label attribute, as sign defined by the user, is identified for user appearing in follow-up dynamic behaviour definition and the instantiation of real time data pointer, can be regarded as the variable name of function parameter; Datatype attribute definition the data type of this real time data.
2) conclusion of dynamic behaviour and format design
Dynamic behaviour is concluded
The variation of the variforms such as shape by pel of SCADA real-time pictures monitoring, color, observability, position, size, line style embodies the variation of real time data, pel form in SVG is defined jointly by many attributes, in client shows, these property values can be revised by script, thereby the variation of pel form is controlled subtly.Obviously can be to the control of pel form far beyond the generally requirement of SCADA picture configuration in SVG, by comparing a plurality of SCADA configuration softwares, and in conjunction with the primitive attribute definition in SVG, the present embodiment is summarized as follows the required dynamic behaviour of SCADA picture configuration:
observability.Whether pel is visible.
convergent-divergent animation.To specify stepping designated centers constantly to change pel size, realize and expanding or atrophy effect.
Above-mentioned dynamic behaviour is changed to foundation with associated real time data, and user need define when real time data changes, the logic of pel form dynamic change.Different according to the mode of logical definition, above-mentioned dynamic behaviour can be divided into judgement type, proportional-type and animation type again.
Selection type dynamic behaviour
The feature of selection type dynamic behaviour is that the real time data value of variation is joined in an expression formula and calculated, and the result that this expression formula is calculated is the value of this dynamic behaviour association attributes; The dynamic behaviour of this type comprises Fill Color, line color, line style, live width, observability, word content.
User should specify the real time data of dynamic behaviour association, consequent constant when the dynamic behaviour of configuration selection type, an and expression statement, wherein consequent constant can be that constant is directly measured, also can be the variable of quoting certain constant of being scheduled to by user, the DTD that describes this part extending marking be as follows:
<!ELEMENT?dynamic(variable+,script)>
<!ELEMENT?variable(#PCDATA)>
<!ELEMENT?script(#PCDATA)>
<!ATTLIST?variable?label?CDATA#REQUIRED>
<!ATTLIST?variable?type?CDATA#REQUIRED>
<!ATTLIST?variable?refid?CDATA#REQUIRED>
<!ATTLIST?variable?refvalue?CDATA#REQUIRED>
<!ATTLIST?variable?id?ID#REQUIRED>
<!ATTLIST?script?content?CDATA#REQUIRED>
<!ATTLIST?dynamic?id?ID#REQUIRED>
<!ATTLIST?dynamic?label?CDATA#REQUIRED>
<!ATTLIST?dynamic?dyncode?CDATA#REQUIRED>。
Proportional-type dynamic behaviour
The feature of proportional-type dynamic behaviour is by pre-defined two class values of user, one group is the variation range of real time data, another group is the variation range of dynamic behaviour correlation attribute value, this two class value is mutually corresponding, in monitoring in real time, according to the real time data value changing, calculate the correlation attribute value of dynamic behaviour, the dynamic behaviour of this type comprises rotation, directions X convergent-divergent, Y-direction convergent-divergent, directions X translation, Y-direction translation; The DTD that describes this part extending marking is as follows:
<!ELEMENT?dynamic(runtimedata,lowrange,highrange,lowscale,highscale,center)>
<!ELEMENT?runtimedata(#PCDATA)>
<!ELEMENT?lowrange(#PCDATA)>
<!ELEMENT?highrange(#PCDATA)>
<!ELEMENT?lowscale(#PCDATA)>
<!ELEMENT?highscale(#PCDATA)>
<!ELEMENT?center(#PCDATA)>
<!ATTLIST?dynamic?id?ID#REQUIRED>
<!ATTLIST?dynamic?label?CDATA#REQUIRED>
<!ATTLIST?dynamic?dyncode?CDATA#REQUIRED>
<!ATTLIST?runtimedata?id?ID#REQUIRED>
<!ATTLIST?runtimedata?type?CDATA#IMPLIED>
<!ATTLIST?runtimedata?refid?CDATA#REQUIRED>
<!ATTLIST?runtimedata?refvalue?CDATA#REQUIRED>
<!ATTLIST?lowrange?id?ID#REQUIRED>
<!ATTLIST?lowrange?attrib?CDATA#IMPLIED>
<!ATTLIST?lowrange?const?CDATA#IMPLIED>
<!ATTLIST?highrange?id?ID#REQUIRED>
<!ATTLIST?highrange?attrib?CDATA#IMPLIED>
<!ATTLIST?highrange?const?CDATA#IMPLIED>
<!ATTLIST?lowscale?id?ID#REQUIRED>
<!ATTLIST?lowscale?value?CDATA#REQUIRED>
<!ATTLIST?highscale?id?ID#REQUIRED>
<!ATTLIST?highscale?value?CDATA#REQUIRED>
<!ATTLIST?center?id?ID#REQUIRED>
<!ATTLIST?center?value?CDATA#REQUIRED>。
The dynamic behaviour of animation type
Animation type dynamic behaviour definition mode and selection type are similar, difference is that the expression formula of animation type dynamic behaviour always returns to logical truth or logical falsehood, in addition, each animation behavior also needs to define the information such as stepping, variation range, and the dynamic behaviour of this type comprises colour switching animation, rotation animation, convergent-divergent animation, displacement animation; The DTD that describes this part extending marking is as follows:
<!ELEMENT?dynamic(color+,step,xrange,yrange,variable+,script)>
<!ELEMENT?color(#PCDATA)>
<!ELEMENT?step(#PCDATA)>
<!ELEMENT?xrange(#PCDATA)>
<!ELEMENT?yrange(#PCDATA)>
<!ELEMENT?variable(#PCDATA)>
<!ELEMENT?script(#PCDATA)>
<!ATTLIST?dynamic?id?ID#REQUIRED>
<!ATTLIST?dynamic?label?CDATA#REQUIRED>
<!ATTLIST?dynamic?dyncode?CDATA#REQUIRED>
<!ATTLIST?variable?label?CDATA#REQUIRED>
<!ATTLIST?variable?type?CDATA#REQUIRED>
<!ATTLIST?variable?refid?CDATA#REQUIRED>
<!ATTLIST?variable?refvalue?CDATA#REQUIRED>
<!ATTLIST?variable?id?ID#REQUIRED>
<!ATTLIST?script?content?CDATA#REQUIRED>
<!ATTLIST?color?id?ID#REQUIRED>
<!ATTLIST?color?value?CDATA#REQUIRED>
<!ATTLIST?step?value?CDATA#REQUIRED>
<!ATTLIST?xrange?value?CDATA#REQUIRED>
<!ATTLIST?yrange?value?CDATA#REQUIRED>。
Wherein, color element only occurs in the definition of colour switching animation, and step, xrange, yrange element are meaningless in the definition of colour switching animation.
The above, such scheme of the present invention all can only think explanation of the present invention can not limit the present invention, claims have been pointed out scope of the present invention, and scope of the present invention is not pointed out in above-mentioned explanation, therefore, any change in the suitable implication of claims of the present invention and scope, all should think to be included in the scope of claims.
Claims (5)
1. a method for designing for dynamic behaviour form in the supervisory system picture configuration based on SVG, is characterized in that: it comprises: the conclusion of message login mechanism and form design procedure, dynamic behaviour and form design procedure.
2. the method for designing of dynamic behaviour form in the supervisory system picture configuration based on SVG according to claim 1, it is characterized in that: in described message login mechanism and form design procedure, message registration is to specify image state to change the real time data of foundation, user must specify this image by type and the quantity of associated real time data type when definition image, then with the XML tag of expansion, content is added in SVG.
3. the method for designing of dynamic behaviour form in the supervisory system picture configuration based on SVG according to claim 1, is characterized in that: the conclusion of described dynamic behaviour comprises: Fill Color, line color, line style, live width, observability, word content, rotation, directions X convergent-divergent, Y-direction convergent-divergent, directions X translation, Y-direction translation, colour switching animation, rotation animation, displacement animation and convergent-divergent animation.
4. the method for designing of dynamic behaviour form in the supervisory system picture configuration based on SVG according to claim 1, it is characterized in that: the conclusion of described dynamic behaviour is different according to the mode of logical definition, is divided into: selection type dynamic behaviour, proportional-type dynamic behaviour and the dynamic behaviour of animation type.
5. the method for designing of dynamic behaviour form in the supervisory system picture configuration based on SVG according to claim 4, it is characterized in that: the feature of described selection type dynamic behaviour is that the real time data value of variation is joined in an expression formula and calculated, the result that this expression formula is calculated is the value of this dynamic behaviour association attributes, comprises Fill Color, line color, line style, live width, observability and word content; The feature of described proportional-type dynamic behaviour is by pre-defined two class values of user, one group is the variation range of real time data, another group is the variation range of dynamic behaviour correlation attribute value, comprises rotation, directions X convergent-divergent, Y-direction convergent-divergent, directions X translation and Y-direction translation; The expression formula of described animation type dynamic behaviour is to return to logical truth or logical falsehood, and the dynamic behaviour of animation type need define the information such as stepping, variation range, comprises colour switching animation, rotation animation, convergent-divergent animation and displacement animation.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201310549766.0A CN103559353B (en) | 2013-11-07 | 2013-11-07 | A kind of method for designing based on dynamic behaviour form in the monitoring system picture configuration of SVG |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201310549766.0A CN103559353B (en) | 2013-11-07 | 2013-11-07 | A kind of method for designing based on dynamic behaviour form in the monitoring system picture configuration of SVG |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN103559353A true CN103559353A (en) | 2014-02-05 |
| CN103559353B CN103559353B (en) | 2016-11-09 |
Family
ID=50013599
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201310549766.0A Active CN103559353B (en) | 2013-11-07 | 2013-11-07 | A kind of method for designing based on dynamic behaviour form in the monitoring system picture configuration of SVG |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN103559353B (en) |
Cited By (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN106095471A (en) * | 2016-08-22 | 2016-11-09 | 国家电网公司 | The graphic configuration method and system of on-line monitoring |
| CN108447108A (en) * | 2018-03-21 | 2018-08-24 | 上海振华重工(集团)股份有限公司 | Pier facilities monitored picture analysis system and method |
| CN109445891A (en) * | 2018-10-09 | 2019-03-08 | 北京国电智深控制技术有限公司 | Picture configuration and methods of exhibiting, device, computer readable storage medium |
| CN110662105A (en) * | 2019-10-16 | 2020-01-07 | 广州华多网络科技有限公司 | Animation file generation method and device and storage medium |
| CN112231608A (en) * | 2020-10-30 | 2021-01-15 | 三峡机电工程技术有限公司 | Method for realizing embedded Web configuration graphics primitive |
| CN113515284A (en) * | 2021-08-11 | 2021-10-19 | 上海电气自动化设计研究所有限公司 | Menu design and deployment method of urban rail transit comprehensive monitoring system |
Citations (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN103226471A (en) * | 2013-03-21 | 2013-07-31 | 南京工业大学 | Design method of firmware GUI based on SVG |
-
2013
- 2013-11-07 CN CN201310549766.0A patent/CN103559353B/en active Active
Patent Citations (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN103226471A (en) * | 2013-03-21 | 2013-07-31 | 南京工业大学 | Design method of firmware GUI based on SVG |
Non-Patent Citations (2)
| Title |
|---|
| 李艳艳，徐京: "SVG及Eclipse RCP 技术在地面站设备监控软件中的应用", 《航天器工程》, vol. 19, no. 4, 31 July 2010 (2010-07-31), pages 74 - 79 * |
| 杨斌,张利欣,章立军,时鹏: "基于SVG的Web远程实时监测客户端研究", 《计算机应用研究》, vol. 27, no. 6, 30 June 2010 (2010-06-30), pages 2144 - 2146 * |
Cited By (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN106095471A (en) * | 2016-08-22 | 2016-11-09 | 国家电网公司 | The graphic configuration method and system of on-line monitoring |
| CN108447108A (en) * | 2018-03-21 | 2018-08-24 | 上海振华重工(集团)股份有限公司 | Pier facilities monitored picture analysis system and method |
| CN109445891A (en) * | 2018-10-09 | 2019-03-08 | 北京国电智深控制技术有限公司 | Picture configuration and methods of exhibiting, device, computer readable storage medium |
| CN109445891B (en) * | 2018-10-09 | 2022-08-12 | 北京国电智深控制技术有限公司 | Picture configuration and display method, device and computer readable storage medium |
| CN110662105A (en) * | 2019-10-16 | 2020-01-07 | 广州华多网络科技有限公司 | Animation file generation method and device and storage medium |
| CN112231608A (en) * | 2020-10-30 | 2021-01-15 | 三峡机电工程技术有限公司 | Method for realizing embedded Web configuration graphics primitive |
| CN112231608B (en) * | 2020-10-30 | 2023-01-03 | 三峡机电工程技术有限公司 | Method for realizing embedded Web configuration graphics primitive |
| CN113515284A (en) * | 2021-08-11 | 2021-10-19 | 上海电气自动化设计研究所有限公司 | Menu design and deployment method of urban rail transit comprehensive monitoring system |
Also Published As
| Publication number | Publication date |
|---|---|
| CN103559353B (en) | 2016-11-09 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN103559353A (en) | Design method of dynamic behavior format in picture configuration of monitoring system based on SVG (scalable vector graphics) | |
| CN104216691B (en) | A kind of method and device for creating application | |
| CN101796543B (en) | Data system and method | |
| US8527943B1 (en) | System and method of application development | |
| US8451275B2 (en) | Method of animating vector graphics | |
| US20030174165A1 (en) | System and method for rendering a directed graph | |
| US7962895B2 (en) | Language for binding scalable vector graphics elements to java classes | |
| KR101494844B1 (en) | System for Transforming Chart Using Metadata and Method thereof | |
| TWI682645B (en) | Hybrid rendering hmi (human machine interface) terminal device | |
| CN111459501B (en) | SVG-based Web configuration picture storage and display system, method and medium | |
| CN103617505A (en) | Dynamic analysis and display system and method for enterprise flow chart | |
| CN103970750A (en) | Method and device for generating HTML (Hypertext Markup Language) web pages | |
| Neumann | Web mapping and web cartography | |
| CN112464119A (en) | Web-end-based SCADA (supervisory control and data acquisition) online configuration editing method | |
| CN107391743A (en) | A kind of mobile GIS method for visualizing based on dynamic map symbol | |
| CN109255046A (en) | The dynamic realizing method of vector graphical element | |
| CN113742530A (en) | System, method, device, processor and storage medium for realizing generation and processing of digital poster picture based on SVG | |
| US20030023639A1 (en) | Application generator for creating web pages | |
| CN106126779A (en) | It is applied to the configuration multiplexing method in SVG picture configuration | |
| CN113282697A (en) | Dojo-based GIS (geographic information System) for realizing multi-platform heterogeneous compatibility and design and deployment methods thereof | |
| CN108984175A (en) | The power grid SVG line chart methods of exhibiting of object-oriented suitable for mobile device | |
| CN114661286A (en) | Large-screen visual code generation method, system and storage medium | |
| Neumann et al. | Time for SVG—towards high quality interactive web-maps | |
| CN111324381B (en) | Development system, development method, development apparatus, computer device, and storage medium | |
| CN107832460A (en) | The graphical page control method of real-time display Satellite TT data based on SVG |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| C06 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| C14 | Grant of patent or utility model | ||
| GR01 | Patent grant |