CN110533746B - Method, device and equipment for generating response type hotspot view and storage medium - Google Patents
Method, device and equipment for generating response type hotspot view and storage medium Download PDFInfo
- Publication number
- CN110533746B CN110533746B CN201910736358.3A CN201910736358A CN110533746B CN 110533746 B CN110533746 B CN 110533746B CN 201910736358 A CN201910736358 A CN 201910736358A CN 110533746 B CN110533746 B CN 110533746B
- Authority
- CN
- China
- Prior art keywords
- view
- hotspot
- hot spot
- generating
- equipment
- 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.)
- Active
Links
- 238000000034 method Methods 0.000 title claims abstract description 32
- 230000004044 response Effects 0.000 title abstract description 10
- 238000004590 computer program Methods 0.000 claims description 11
- 230000000694 effects Effects 0.000 claims description 8
- 239000000725 suspension Substances 0.000 claims description 8
- 230000006870 function Effects 0.000 claims description 6
- 238000009795 derivation Methods 0.000 claims description 2
- 238000010586 diagram Methods 0.000 abstract description 10
- 230000009286 beneficial effect Effects 0.000 abstract description 2
- 230000001944 accentuation Effects 0.000 description 1
- 238000005516 engineering process Methods 0.000 description 1
- 230000005012 migration Effects 0.000 description 1
- 238000013508 migration Methods 0.000 description 1
- 230000000750 progressive effect Effects 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/451—Execution arrangements for user interfaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T11/00—2D [Two Dimensional] image generation
- G06T11/60—Editing figures and text; Combining figures or text
Abstract
The invention discloses a method for generating a response type hot spot view of a storage device, which comprises the following steps: receiving a vector drawing instruction and a device view, wherein the device view is a picture obtained by shooting a device component; generating lines for delineating a hot spot area of the equipment view on the equipment view to obtain a hot spot view with the equipment view as a background; and naming the hot point view according to a preset naming rule according to the device component type corresponding to the device view contained in the vector drawing instruction, and exporting the hot point view in the SVG format. According to the method and the device, a vector diagram drawing tool is adopted to obtain the hot spot view with the real image of the device component as the background, when a user zooms the hot spot view, the relative positioning of the hot spot image can be achieved, and the problem that the hot spot image is offset in positioning is avoided. The application also provides a device and equipment for generating the response type hot spot view of the storage equipment and a computer readable storage medium, and the device and the equipment have the beneficial effects.
Description
Technical Field
The present invention relates to the field of computer technologies, and in particular, to a method, an apparatus, a device, and a computer-readable storage medium for generating a responsive hotspot view of a storage device.
Background
In the storage management software, various key components of the storage device, such as a controller, a fan, a battery, various ports and the like, are presented for a user more intuitively; the device view may be presented to the user on a display interface for reference by the user. When a mouse hovers or clicks on a device view of a part, the part can be highlighted by adding a special accentuation pattern and a response event can be added to it.
However, when a mouse is hovered or clicked, if the whole image is zoomed, the hot spot offset is disordered, so that the user has difficulty in accurately selecting the hot spot region.
Disclosure of Invention
The invention aims to provide a method, a device, equipment and a computer readable storage medium for generating a response type hotspot view of storage equipment, which solve the problem that a user is difficult to accurately select a hotspot area when the hotspot view of the equipment is zoomed.
In order to solve the above technical problem, the present invention provides a method for generating a responsive hotspot view of a storage device, including:
receiving a vector drawing instruction and a device view, wherein the device view is a picture obtained by shooting a device component;
generating lines for delineating a hot spot area of the equipment view on the equipment view to obtain a hot spot view with the equipment view as a background;
naming the hot spot view according to a preset naming rule according to the device component type corresponding to the device view contained in the vector drawing instruction, and exporting the hot spot view in an SVG format.
Wherein the pixel width of the device view is 1600PX or more.
Wherein the generating a line on the device view that circumscribes a hotspot region of the device view comprises:
and identifying an edge line of the device view, and generating a line for delimiting the hot spot region along the edge line of the device view.
Wherein, after deriving the hotspot view in SVG format, the method further comprises:
identifying the hotspot view according to the name of the hotspot view;
and binding the identified hotspot view with a corresponding event and the suspension and click effects of the hotspot image.
The present application further provides an apparatus for generating a responsive hotspot view of a storage device, including:
the instruction receiving module is used for receiving a vector drawing instruction and a device view, wherein the device view is a picture obtained by shooting a device component;
the view generation module is used for generating lines for delineating a hot spot area of the equipment view on the equipment view to obtain a hot spot view with the equipment view as a background;
and the name deriving module is used for naming the hot spot view according to a preset naming rule and deriving the hot spot view in an SVG format according to the device component type corresponding to the device view contained in the vector drawing instruction.
Wherein, include:
the instruction receiving module receives the pixel width of the device view as 1600PX or more.
The view generating module is specifically configured to identify an edge line of the device view, and generate a line that defines the hot spot region along the edge line of the device view.
The system comprises a hot view module, a function binding module and a function binding module, wherein the function binding module is used for identifying the hot view according to the name of the hot view; and binding the identified hotspot view with a corresponding event and the suspension and click effects of the hotspot image.
The application also provides a device for generating a response type hotspot view of a storage device, which comprises:
a memory for storing a computer program;
a processor for executing the computer program to implement the steps of the method for generating a responsive hotspot view of a storage device as described in any one of the above.
A computer-readable storage medium is also provided, on which a computer program is stored, which, when being executed by a processor, implements the steps of the method for generating a responsive hotspot view of a storage device according to any one of the above.
The invention provides a method for generating a response type hot spot view of a storage device, which comprises the following steps: receiving a vector drawing instruction and a device view, wherein the device view is a picture obtained by shooting a device component; generating lines for delineating a hot spot area of the equipment view on the equipment view to obtain a hot spot view taking the equipment view as a background; and naming the hot point view according to a preset naming rule according to the device component type corresponding to the device view contained in the vector drawing instruction, and exporting the hot point view in the SVG format.
According to the method, a vector diagram drawing tool is adopted to draw a hot spot region on a device view to obtain the hot spot view with the device view as a background picture, wherein the device view is an image obtained by shooting a device component, when a user zooms the hot spot view, the relative positioning of the hot spot image can be realized, and the problem that the hot spot image is offset in positioning is avoided; meanwhile, an image shot by the equipment part is used as a background, so that the identification of the hotspot view by a user is facilitated, the readability of the hotspot view is enhanced, the operation of the user is facilitated, and the use experience of the user is improved.
The application also provides a device and equipment for generating the response type hot spot view of the storage equipment and a computer readable storage medium, and the device and the equipment have the beneficial effects.
Drawings
In order to more clearly illustrate the embodiments or technical solutions of the present invention, the drawings used in the description of the embodiments or the prior art will be briefly described below, and it is obvious that the drawings in the following description are only some embodiments of the present invention, and it is obvious for those skilled in the art that other drawings can be obtained based on these drawings without creative efforts.
Fig. 1 is a schematic flowchart of a method for generating a responsive hotspot view of a storage device according to an embodiment of the present invention;
fig. 2 is a block diagram of a structure of an apparatus for generating a responsive hotspot view of a storage device according to an embodiment of the present invention;
fig. 3 is a schematic structural diagram of a device for generating a responsive hotspot view of a storage device according to an embodiment of the present invention.
Detailed Description
The core of the invention is to provide a method, a device and equipment for generating a response type hotspot view of a storage device and a computer readable storage medium, which solve the problem of inaccurate positioning after the hotspot view is zoomed.
In order that those skilled in the art will better understand the disclosure, the invention will be described in further detail with reference to the accompanying drawings and specific embodiments. It is to be understood that the described embodiments are merely exemplary of the invention, and not restrictive of the full scope of the invention. All other embodiments, which can be derived by a person skilled in the art from the embodiments given herein without making any creative effort, shall fall within the protection scope of the present invention.
As shown in fig. 1, fig. 1 is a schematic flowchart of a method for generating a responsive hotspot view of a storage device according to an embodiment of the present invention, where the method may include:
step S11: a vector drawing instruction and a device view are received.
Specifically, when the user draws the hotspot view, the user can directly input the device view after starting the vector drawing tool. The vector drawing tool may be Adobe Illustrator drawing software or coreldaw drawing software.
The device view in this embodiment is a picture obtained by shooting a device component, and the device component may specifically be a controller, a fan, a battery, and the like.
It should be noted that the device view in the present application may also be a picture drawn by a drawing tool, and may even be a simplified diagram of a device component. However, in order to reduce the drawing difficulty when drawing pictures with a drawing tool, a diagram of a device component or a symbolic diagram representing the device component is often drawn, and when a user reads the device component represented by an identification picture, the user needs to have relatively high professional knowledge or be familiar with the symbolic diagram, otherwise it is difficult to quickly know the device component represented by each picture, which obviously reduces the user experience.
In the embodiment, the picture obtained by shooting the actual equipment component is used as the equipment view, so that the reality is higher, and a user can easily identify the component represented by each equipment view directly according to the contrast equipment component, thereby facilitating the operation of the user.
In view of the fact that the subsequent user needs to scale the generated hotspot view, in order to avoid the unclear picture of the scaled hotspot view, the device view in this embodiment may further use an image with an image pixel width of 1600PX or more. Therefore, the hotspot view generated according to the device view has higher definition no matter zooming is carried out by a user or on display screens with different resolutions, and the use experience of the user is improved.
Step S2: and generating a line for delineating a hot spot area of the equipment view on the equipment view to obtain the hot spot view taking the equipment view as a background.
Specifically, by taking the device view as a background picture, a hot spot area is circled on the device view, and then the hot spot view in the SVG format can be generated. When the user zooms in and out of the hotspot view, the device view and the size of the hotspot area are zoomed in and out synchronously. The positioning of the hot spot view in the SVG format on the display screen is relatively positioning, the position of the pixel point on the display screen covered by the hot spot view is correspondingly changed along with the zooming of the hot spot view, and the positioning of the hot spot view in the SVG format is relatively changed synchronously.
At present, a conventional hotspot view generally adopts pictures in a format such as JPG (java graphics page) and the like, and the pictures in the format are positioned absolutely through bitmaps. When a user zooms the hotspot view, although the size of the hotspot view displayed to the user is changed, the hotspot region location of the hotspot view is not changed along with the migration, and when the user clicks the hotspot region, the hotspot region is operated according to the zoomed hotspot view, so that the hotspot region displayed on the display screen and the hotspot region actually positioned on the display screen are shifted, and the user fails to execute the corresponding functional operation based on the hotspot region.
The hot spot view in the SVG format is positioned in a relative positioning mode, and when the hot spot view is zoomed, the positioning position of the hot spot view can be changed, so that a user can accurately operate a hot spot area according to the zoomed hot spot view, and the problem of hot spot deviation is avoided.
Optionally, the specific process of drawing the hotspot region on the device view may include:
and identifying an edge line of the device view, and generating a line for delimiting the hot spot region along the edge line of the device view.
In order to maximize coverage of the device view by the hotspot region, lines may be drawn along the edges of the device view, forming a closed region along the edges of the device view, thereby generating the hotspot view.
Step S3: and naming the hot point view according to a preset naming rule according to the device component type corresponding to the device view contained in the vector drawing instruction, and exporting the hot point view in the SVG format.
Specifically, the naming of each hotspot view (represented as ID attribute in the derived svg format picture) is to ensure that different component types and identifications, such as fan-3, are distinguished, representing the 3 rd fan component. I.e., devices of the same type may be named using the same phase of shorthand letters plus a serial number.
And after the hot spot area is drawn, exporting the graph in the format of SVG, specifically, establishing an SVG database specially storing the hot spot view, and introducing the SVG database when a page of the hot spot view of the storage device needs to be displayed. For page introduction of the hotspot view, reference may be made to the following steps S4 and S5.
Step S4: identifying the hotspot view according to the name of the hotspot view;
step S5: and binding the identified hotspot view with a corresponding event, and the suspension and click effects of the hotspot image.
Specifically, a dom element (usually a path element) of the hotspot area is obtained by using js (or svg class library), the component type and the identification are identified according to the element ID and the naming rule, and accordingly, events are respectively bound to realize suspension and click effects, and the realization of the hotspot is completed.
For example: (1) determining a webpage needing to introduce graphics, and introducing svg pictures (namely hot spot views) in an svg library (such as Snap. svg) according to specific conditions, so that the programming of the svg pictures is facilitated;
(2) introducing the drawn svg picture into html in a mode: < embed >, < object >, or < iframe >;
(3) the size of the svg picture is set through css (absolute positioning), the svg picture can be set to be percentage (for example, the width is 80%), and the display proportion is consistent under displays with different resolutions;
(4) and acquiring a dom element (usually a path element) of the hot spot region by using js (or svg class library), identifying the type and the identification of the component according to the element ID and the naming rule, and respectively binding events to realize suspension and click effects so as to finish the realization of the hot spot.
According to the method and the device, the image actually shot by the device component is used as the device view, so that the user can conveniently identify the hot spot view when operating the hot spot view, and the user experience is improved; and the hot spot area is drawn through a vector drawing tool on the basis of the equipment view, the hot spot view in the SVG format is generated, the problem of positioning offset caused by zooming of the hot spot view is avoided, and a user can accurately operate the hot spot area conveniently.
The following describes a device for generating a responsive hotspot view of a storage device according to an embodiment of the present invention, and the device for generating a responsive hotspot view of a storage device described below and the method for generating a responsive hotspot view of a storage device described above may be referred to correspondingly.
Fig. 2 is a block diagram of a structure of a device for generating a responsive hotspot view of a storage device according to an embodiment of the present invention, where the device for generating a responsive hotspot view of a storage device according to fig. 2 may include:
the instruction receiving module 100 is configured to receive a vector drawing instruction and a device view, where the device view is a picture obtained by taking a device component;
a view generating module 200, configured to generate a line that circumscribes a hot spot area of the device view on the device view, and obtain a hot spot view with the device view as a background;
and a name derivation module 300, configured to name the hotspot view according to a predetermined naming rule according to the device component type corresponding to the device view included in the vector drawing instruction, and derive the hotspot view in an SVG format.
Optionally, in another specific embodiment of the present invention, the method may further include:
the pixel width of the device view imported by the instruction receiving module 100 is 1600PX or more.
Optionally, in another specific embodiment of the present invention, the view generating module 300 is specifically configured to identify an edge line of the device view, and generate a line that defines the hot spot region along the edge line of the device view.
Optionally, in another specific embodiment of the present invention, the system may further include a function binding module, configured to identify the hotspot view according to the name of the hotspot view; and binding the identified hotspot view with a corresponding event, and the suspension and click effects of the hotspot image.
Therefore, the specific implementation manner of the generating apparatus of the responsive hotspot view of the storage device may be seen in the foregoing embodiment parts of the generating method of the responsive hotspot view of the storage device, for example, the instruction receiving module 100, the view generating module 200, the name deriving module 300, which are respectively used to implement steps S1, S2, and S3 in the foregoing method, and the function binding module which is used to implement steps S4 and S5 in the foregoing method. Therefore, the detailed description thereof may refer to the description of the corresponding partial embodiments, which is not repeated herein.
As shown in fig. 3, fig. 3 is a schematic structural diagram of a device for generating a responsive hotspot view of a storage device according to an embodiment of the present invention, where the device includes:
a memory 11 for storing a computer program;
a processor 12 for executing the computer program to implement the steps of the method for generating a responsive hotspot view of a storage device as described in any of the embodiments above.
A computer-readable storage medium is also provided in the present application, having a computer program stored thereon, where the computer program, when being executed by a processor, implements the steps of the method for generating a responsive hotspot view of a storage device as set forth in any of the above embodiments.
In particular, the computer-readable storage medium may be Random Access Memory (RAM), memory, Read Only Memory (ROM), electrically programmable ROM, electrically erasable programmable ROM, registers, hard disk, a removable disk, a CD-ROM, or any other form of storage medium known in the art.
Those of skill would further appreciate that the various illustrative elements and algorithm steps described in connection with the embodiments disclosed herein may be implemented as electronic hardware, computer software, or combinations of both, and that the various illustrative components and steps have been described above generally in terms of their functionality in order to clearly illustrate this interchangeability of hardware and software. Whether such functionality is implemented as hardware or software depends upon the particular application and design constraints imposed on the implementation. Skilled artisans may implement the described functionality in varying ways for each particular application, but such implementation decisions should not be interpreted as causing a departure from the scope of the present invention.
The embodiments are described in a progressive manner, each embodiment focuses on differences from other embodiments, and the same or similar parts among the embodiments are referred to each other. The device disclosed by the embodiment corresponds to the method disclosed by the embodiment, so that the description is simple, and the relevant points can be referred to the method part for description.
Claims (8)
1. A method for generating a responsive hotspot view of a storage device, comprising:
receiving a vector drawing instruction and a device view, wherein the device view is a picture obtained by shooting a device component;
generating lines for delineating a hot spot area of the equipment view on the equipment view to obtain a hot spot view with the equipment view as a background;
naming the hot spot view according to a preset naming rule according to the device component type corresponding to the device view contained in the vector drawing instruction, and exporting the hot spot view in an SVG format;
identifying the hotspot view according to the name of the hotspot view;
binding the identified hotspot view with a corresponding event and the suspension and click effects of the hotspot image;
the positioning of the hot spot view in the SVG format on the display screen is relatively positioning, the position of the pixel point on the display screen covered by the hot spot view is correspondingly changed along with the zooming of the hot spot view, and the positioning of the hot spot view in the SVG format is relatively changed synchronously.
2. The method for generating a responsive hotspot view of claim 1, wherein the device view has a pixel width of 1600PX or more.
3. The method for generating a responsive hotspot view of claim 1, wherein generating a line on the device view that circumscribes a hotspot region of the device view comprises:
and identifying an edge line of the device view, and generating a line for delimiting the hot spot region along the edge line of the device view.
4. An apparatus for generating a responsive hotspot view of a storage device, comprising:
the instruction receiving module is used for receiving a vector drawing instruction and a device view, wherein the device view is a picture obtained by shooting a device component;
the view generating module is used for generating lines for delineating a hot spot area of the equipment view on the equipment view to obtain a hot spot view taking the equipment view as a background;
the naming derivation module is used for naming the hot spot view according to a preset naming rule according to the device component type corresponding to the device view contained in the vector drawing instruction and deriving the hot spot view in an SVG format;
the function binding module is used for identifying the hotspot view according to the name of the hotspot view; binding the identified hotspot view with a corresponding event and the suspension and click effects of the hotspot image;
the positioning of the hot spot view in the SVG format on the display screen is relatively positioning, the position of the pixel point on the display screen covered by the hot spot view is correspondingly changed along with the zooming of the hot spot view, and the positioning of the hot spot view in the SVG format is relatively changed synchronously.
5. The apparatus for generating a responsive hotspot view of a storage device of claim 4, comprising:
the instruction receiving module receives the pixel width of the device view as 1600PX or more.
6. The apparatus for generating a responsive hotspot view of a storage device according to claim 4, wherein the view generation module is specifically configured to identify an edge line of the device view, and generate a line that circumscribes the hotspot region along the edge line of the device view.
7. A device for generating a responsive hotspot view of a storage device, comprising:
a memory for storing a computer program;
a processor for executing the computer program to implement the steps of the method for generating a responsive hotspot view of a storage device according to any one of claims 1 to 3.
8. A computer-readable storage medium, characterized in that a computer program is stored thereon, which computer program, when being executed by a processor, carries out the steps of a method for generating a responsive hotspot view of a storage device according to any one of claims 1 to 3.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201910736358.3A CN110533746B (en) | 2019-08-09 | 2019-08-09 | Method, device and equipment for generating response type hotspot view and storage medium |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201910736358.3A CN110533746B (en) | 2019-08-09 | 2019-08-09 | Method, device and equipment for generating response type hotspot view and storage medium |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN110533746A CN110533746A (en) | 2019-12-03 |
| CN110533746B true CN110533746B (en) | 2022-07-08 |
Family
ID=68662267
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201910736358.3A Active CN110533746B (en) | 2019-08-09 | 2019-08-09 | Method, device and equipment for generating response type hotspot view and storage medium |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN110533746B (en) |
Citations (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN107203453A (en) * | 2017-05-23 | 2017-09-26 | 郑州云海信息技术有限公司 | A kind of generation method of device view, device and electronic equipment |
| CN107391140A (en) * | 2017-07-25 | 2017-11-24 | 郑州云海信息技术有限公司 | The method and system that a kind of picture of storage device is shown |
-
2019
- 2019-08-09 CN CN201910736358.3A patent/CN110533746B/en active Active
Patent Citations (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN107203453A (en) * | 2017-05-23 | 2017-09-26 | 郑州云海信息技术有限公司 | A kind of generation method of device view, device and electronic equipment |
| CN107391140A (en) * | 2017-07-25 | 2017-11-24 | 郑州云海信息技术有限公司 | The method and system that a kind of picture of storage device is shown |
Also Published As
| Publication number | Publication date |
|---|---|
| CN110533746A (en) | 2019-12-03 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US20200104041A1 (en) | System for capturing and replaying screen gestures | |
| CN106502659B (en) | A kind of layout method and system of mobile device webpage single-page | |
| US11551392B2 (en) | Graphic drawing method and apparatus, device, and storage medium | |
| CN110765015B (en) | Method for testing tested application and electronic equipment | |
| CN111144078B (en) | Method, device, server and storage medium for determining positions to be marked in PDF (portable document format) file | |
| CN110489312A (en) | Data correlation method and device for control trigger data acquisition | |
| CN106648571B (en) | Method and device for calibrating application interface | |
| CN111399831A (en) | Page display method and device, storage medium and electronic device | |
| JP5334338B2 (en) | Terminal device and drawing display program for terminal device | |
| CN108037904B (en) | Visual data pushing method and system | |
| CN108984070B (en) | Method, apparatus, electronic device and readable medium for thermodynamic diagram imaging | |
| CN110443772B (en) | Picture processing method and device, computer equipment and storage medium | |
| CN111913566A (en) | Data processing method and device, electronic equipment and computer storage medium | |
| CN112445693A (en) | Page update detection method, device, equipment and storage medium | |
| US9298709B2 (en) | Computer system to visualize data from an IP rights database | |
| CN111223155A (en) | Image data processing method, image data processing device, computer equipment and storage medium | |
| CN110533746B (en) | Method, device and equipment for generating response type hotspot view and storage medium | |
| CN110019037A (en) | A kind of pdf document methods of exhibiting, device, equipment and storage medium | |
| CN109522429A (en) | Method and apparatus for generating information | |
| CN106155455B (en) | Method and device for controlling objects in interface | |
| CN112328940A (en) | Method and device for embedding transition page into webpage, computer equipment and storage medium | |
| CN113496454A (en) | Image processing method and device, computer readable medium and electronic equipment | |
| CN111243763B (en) | Mark display method, device, equipment and computer storage medium | |
| CN106095734B (en) | Text display method and device | |
| CN114153363B (en) | Map display control method and device and electronic equipment |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |