CN109739489A - Method and device for generating data chart by using JavaScript - Google Patents
Method and device for generating data chart by using JavaScript Download PDFInfo
- Publication number
- CN109739489A CN109739489A CN201711047192.1A CN201711047192A CN109739489A CN 109739489 A CN109739489 A CN 109739489A CN 201711047192 A CN201711047192 A CN 201711047192A CN 109739489 A CN109739489 A CN 109739489A
- Authority
- CN
- China
- Prior art keywords
- rendering
- javascript
- task
- data
- rendering task
- 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.)
- Pending
Links
Landscapes
- Stored Programmes (AREA)
Abstract
The invention discloses a method and a device for generating a data chart by utilizing JavaScript, which comprises the following steps: step one, loading a JavaScript code into an application program; step two, instantiating a webview component object, and loading the url address of the JavaScript code by using the webview component object; step three, initializing rendering service of the application program; step four, the resource data and the callback method are submitted to the rendering service, packaged into rendering tasks, added to a rendering task queue and waiting for execution; step five, performing rendering operation on the rendering task positioned at the head of the rendering task queue, and generating chart data; and sixthly, receiving the chart data, executing the call-back method and sending the chart data.
Description
Technical field
The present invention relates to data drawing lists to generate field more particularly to a kind of side that data drawing list is generated using JavaScript
Method and device.
Background technique
Currently, in the application of data visualization class, usually across multi-platform, browser, App etc., in order to guarantee to apply
The data drawing list generated in program format, in terms of and browser platform be consistent, while improving code reuse degree,
Development cycle and cost are reduced, characteristic is supported to the height of Javascript using in application program, is embedded in the application
(or being downloaded by network) Javascript chart rendering engine, is called by the Navtive code of application program
The correlation function that Javascript rendering engine provides, generates the picture of data drawing list, and support the customized of picture format,
The corresponding library Javascript is needed to be supported.
In existing application program, the rendering of picture is usually all completed in server-side, in the normal situation of network, is not had
Problematic, if user's local environment does not have network, picture Rendering operations just cannot be executed normally completely.
For the problems of in the prior art, provide it is a kind of using JavaScript generate data drawing list method and
Device is of great significance.
Summary of the invention
To solve the above problems, the present invention provides a kind of method and device for generating data drawing list using JavaScript.
To achieve the above object, the method for the invention for generating data drawing list using JavaScript, specifically includes following
Step: JavaScript code is loaded into application program by step 1；Step 2 instantiates webview component object, and utilizes
The webview component object loads the address url of the JavaScript code；Step 3 initializes the application program
Rendering service；Resource data and callback method are committed to the rendering and serviced, be packaged into rendering task and add by step 4
To rendering task queue, wait pending；Step 5 executes rendering behaviour to the rendering task for being located at the rendering task queue head
Make, and generates chart data；Step 6 receives the chart data, and executes the callback method and send the chart data；
Further, the webview component object can be UIWebView component object or WKWebView component pair
As；
Further, in the step 4, after being packaged into rendering task and being added to rendering task queue, waiting is held
It before row, further include, according to the number of executions of task and the priority of task in presently described rendering task queue, adjusting task
Position in the rendering task queue；
Further, the step 5 can also be to execute to the rendering task for being located at the rendering task queue head
Rendering operations generate corresponding chart according to the resource data and configuration, and by event mode, chart data are packaged into
Event object；
Further, the step 6 can also be to receive the event object, from the event object described in acquisition
Chart data, and corresponding callback method is searched according to the event object, it executes the callback method and sends the chart
Data；
Further, the application program is the application program based on IOS operating system；
The present invention also provides a kind of devices that data drawing list is generated based on JavaScript, including rendering task scheduler
With rendering kernel, the rendering task scheduler for dispatch rendering task, keep rendering task queue, receive rendering result,
Execute callback method and adjustment rendering task queue sequence；The rendering kernel operates in the webview component object, institute
Rendering kernel is stated for receiving resource data, the resource data is rendered, and rendering result is returned into rendering task
Scheduler；
It further, further include exception handler and abnormal scheduler；The exception handler is used for the wash with watercolours according to processing
The anomalous event generated when dye；The exception scheduler is used to receive anomalous event when rendering, and the anomalous event is mentioned
Give the exception handler.
The method and device that data drawing list is generated using JavaScript of the invention, has the advantage that 1, Neng Gou
Without under network environment, picture still can be normally rendered；2, processing that can be cross-platform is not limited only to iOS platform, can apply
It is convenient and efficient in any platform for supporting Javascript operation；3, reduce the data traffic consumption of picture transfer；4 drops
It is low because picture Rendering operations give server-side bring pressure.
Detailed description of the invention
Fig. 1 is the flow diagram of the method for the invention；
Fig. 2 is the structural schematic diagram of device of the present invention.
Specific embodiment
In the following, being further described in conjunction with attached drawing to structure and working principle etc. of the invention.
As shown in FIG. 1, FIG. 1 is a kind of processes of method for generating data drawing list using JavaScript of the present invention to show
It is intended to, the method for generating data drawing list using JavaScript, specifically includes the following steps:
JavaScript code is loaded into application program by step 1 S1；In the preferred embodiment of the invention, the application
Program is the application program based on IOS operating system；Meanwhile the application program is also not limited to IOS operating system, it can be with
The platform cross-platform, any support Javascript code is supported to run is realized, including windows, Android etc.；It is logical
Javascript code and resource data can be embedded in primary code in actual operation by Chang Di, and execution allows to pass through network
Related resource is loaded, and is cached, the size of the installation kit of native applications program can be significantly reduced in this mode；
Step 2 S2 instantiates webview component object, and using described in webview component object load
The address url of JavaScript code；In the preferred embodiment of the invention, the webview component object can be
UIWebView component object or WKWebView component object；It, can by instantiation webview component object described in step 2
To keep its reference before the closing application program, prevent from recycling the object when operation, the webview component pair held at this time
As not needing to be exposed to UI, that is, do not need to show in the operation display of user, only as the resident backstage of backstage rendering service；Institute
The position that is locally stored that the address url is usually Javascript code is stated, in special circumstances, or the caching of related resource
Position；
Step 3 S3 initializes the rendering service of the application program；In the preferred embodiment of the invention, initializing
After the rendering service of the application program, following resource: rendering task scheduler can be kept, the rendering task scheduler is used for
It dispatches rendering task, keep rendering task queue, receive rendering result, execution callback method and adjust rendering task queue suitable
Sequence；Kernel is rendered, the rendering kernel operates in the webview component object, and the rendering kernel is for receiving resource
Data render the resource data, and rendering result are returned to rendering task scheduler；Exception handler, it is described
Exception handler is used for the anomalous event generated when the rendering according to processing；Abnormal scheduler, the exception scheduler is for connecing
Anomalous event when rendering is received, and the anomalous event is submitted into the exception handler；
Resource data and callback method are committed to the rendering and serviced, be packaged into rendering task and add by step 4 S4
To rendering task queue, wait pending；In the preferred embodiment of the invention, appoint being packaged into rendering task and being added to rendering
Be engaged in queue after, wait it is pending before, further include, according to the number of executions and task of task in presently described rendering task queue
Priority, adjust position of the task in the rendering task queue；
Step 5 S5 executes Rendering operations to the rendering task for being located at the rendering task queue head, and generates chart
Data；Normally, the chart data includes the related contents such as picture, the chart by rendering；
Step 6 S6 receives the chart data, and executes the callback method and send the chart data；Normally,
The callback method is specially that the chart data is sent to UI, and the UI receives the picture and chart by rendering, and
User is shown at the end UI.
In the preferred embodiment of the invention, the step 5 and step 6 can be with are as follows: step 5: to being located at the wash with watercolours
The rendering task for contaminating task queue stem executes Rendering operations, generates corresponding chart according to the resource data and configuration, and
By event mode, chart data is packaged into event object；Step 6: receiving the event object, from the event object
It is middle to obtain the chart data, and corresponding callback method is searched according to the event object, execute the callback method hair
Send the chart data.It can make sending and receiving in such a way that each chart data is packaged into event object in this way
The scattered processing of Shi Buzai, so that integrated operation is more stable and efficient.
The present invention also provides a kind of devices that data drawing list is generated based on JavaScript, as shown in Fig. 2, Fig. 2 is this
The structural schematic diagram of invention described device, including rendering task scheduler 1 and rendering kernel 2, the rendering task scheduler 1 are used
In scheduling rendering task, it is suitable that rendering task queue is kept, rendering result, execution callback method are received and adjusts rendering task queue
Sequence；The rendering kernel 2 operates in the webview component object, and the rendering kernel is for receiving resource data, to institute
It states resource data to be rendered, and rendering result is returned into rendering task scheduler；
A kind of device generating data drawing list based on JavaScript of the present invention, further includes 3 He of exception handler
Abnormal scheduler 4；The exception handler 3 is used for the anomalous event generated when the rendering according to processing；The exception scheduler 4
For receiving anomalous event when rendering, and the anomalous event is submitted into the exception handler.
More than, schematic description only of the invention, it will be recognized by those skilled in the art that without departing from work of the invention
On the basis of making principle, a variety of improvement can be made to the present invention, this is all belonged to the scope of protection of the present invention.
Claims (8)
1. a kind of method for generating data drawing list using JavaScript, which is characterized in that specifically includes the following steps:
JavaScript code is loaded into application program by step 1；
Step 2 instantiates webview component object, and loads the JavaScript using the webview component object
The address url of code；
Step 3 initializes the rendering service of the application program；
Resource data and callback method are committed to the rendering and serviced, be packaged into rendering task and be added to rendering by step 4
Task queue waits pending；
Step 5 executes Rendering operations to the rendering task for being located at the rendering task queue head, and generates chart data；
Step 6 receives the chart data, and executes the callback method and send the chart data.
2. the method for generating data drawing list using JavaScript as described in claim 1, which is characterized in that described
Webview component object can be UIWebView component object or WKWebView component object.
3. the method for generating data drawing list using JavaScript as described in claim 1, which is characterized in that the step 4
In, after being packaged into rendering task and being added to rendering task queue, wait it is pending before, further include, according to presently described
The priority of the number of executions of task and task in rendering task queue adjusts position of the task in the rendering task queue
It sets.
4. the method for generating data drawing list using JavaScript as described in claim 1, which is characterized in that the step 5
Can also be that Rendering operations are executed to the rendering task for being located at the rendering task queue head, according to the resource data and
Configuration generates corresponding chart, and by event mode, chart data is packaged into event object.
5. the method for generating data drawing list using JavaScript as claimed in claim 3, which is characterized in that the step 6
It can also be to receive the event object, the chart data be obtained from the event object, and according to the event object
Corresponding callback method is searched, the callback method is executed and sends the chart data.
6. the method for generating data drawing list using JavaScript as described in claim 1, which is characterized in that described to apply journey
Sequence is the application program based on IOS operating system.
7. a kind of device for generating data drawing list based on JavaScript, which is characterized in that including rendering task scheduler and wash with watercolours
Kernel is contaminated,
The rendering task scheduler is for dispatching rendering task, holding rendering task queue, reception rendering result, executing readjustment
Method and adjustment rendering task queue sequence；
The rendering kernel operates in the webview component object, and the rendering kernel is for receiving resource data, to institute
It states resource data to be rendered, and rendering result is returned into rendering task scheduler.
8. the device of data drawing list is generated based on JavaScript as claimed in claim 6, which is characterized in that further include exception
Processor and abnormal scheduler；
The exception handler is used for the anomalous event generated when the rendering according to processing；
The exception scheduler is used to receive anomalous event when rendering, and the anomalous event is submitted to the abnormality processing
Device.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201711047192.1A CN109739489A (en) | 2017-10-31 | 2017-10-31 | Method and device for generating data chart by using JavaScript |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201711047192.1A CN109739489A (en) | 2017-10-31 | 2017-10-31 | Method and device for generating data chart by using JavaScript |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN109739489A true CN109739489A (en) | 2019-05-10 |
Family
ID=66354194
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201711047192.1A Pending CN109739489A (en) | 2017-10-31 | 2017-10-31 | Method and device for generating data chart by using JavaScript |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN109739489A (en) |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN113760252A (en) * | 2020-11-16 | 2021-12-07 | 北京沃东天骏信息技术有限公司 | Data visualization method, device, computer system and readable storage medium |
Citations (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20130246944A1 (en) * | 2012-03-19 | 2013-09-19 | Mohan Kumar Pandiyan | Systems and methods for providing user interfaces for management applications |
| CN106209925A (en) * | 2015-04-29 | 2016-12-07 | 阿里巴巴集团控股有限公司 | Page loading method, client and system |
| CN107274470A (en) * | 2017-06-15 | 2017-10-20 | 深圳市彬讯科技有限公司 | It is a kind of based on rendering parallel multipriority queue dispatching method offline in real time |
-
2017
- 2017-10-31 CN CN201711047192.1A patent/CN109739489A/en active Pending
Patent Citations (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20130246944A1 (en) * | 2012-03-19 | 2013-09-19 | Mohan Kumar Pandiyan | Systems and methods for providing user interfaces for management applications |
| CN106209925A (en) * | 2015-04-29 | 2016-12-07 | 阿里巴巴集团控股有限公司 | Page loading method, client and system |
| CN107274470A (en) * | 2017-06-15 | 2017-10-20 | 深圳市彬讯科技有限公司 | It is a kind of based on rendering parallel multipriority queue dispatching method offline in real time |
Non-Patent Citations (1)
| Title |
|---|
| MRYAO10: "Android调用echart图表，实现牛逼的效果", 《CSDN》 * |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN113760252A (en) * | 2020-11-16 | 2021-12-07 | 北京沃东天骏信息技术有限公司 | Data visualization method, device, computer system and readable storage medium |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US10133597B2 (en) | Intelligent GPU scheduling in a virtualization environment | |
| EP2875486B1 (en) | Deferred preemption techniques for scheduling graphics processing unit command streams | |
| CN106096030B (en) | The method and apparatus that browser execution is optimized | |
| CN105164644B (en) | Hook frame | |
| CN107943577B (en) | Method and device for scheduling tasks | |
| US10970129B2 (en) | Intelligent GPU scheduling in a virtualization environment | |
| US10242420B2 (en) | Preemptive context switching of processes on an accelerated processing device (APD) based on time quanta | |
| US20180246770A1 (en) | Resource Scheduling System and Method under Graphics Processing Unit Virtualization Based on Instant Feedback of Application Effect | |
| KR102338849B1 (en) | Method and system for providing stack memory management in real-time operating systems | |
| US20150363239A1 (en) | Dynamic task scheduling method for dispatching sub-tasks to computing devices of heterogeneous computing system and related computer readable medium | |
| CN108965471B (en) | Method for improving browser memory on smart television | |
| US11681507B2 (en) | Composable context menus | |
| US20110219373A1 (en) | Virtual machine management apparatus and virtualization method for virtualization-supporting terminal platform | |
| US20120254355A1 (en) | System and method for migrating an application | |
| CN108196946A (en) | A kind of subregion multinuclear method of Mach | |
| CN107704315A (en) | A kind of timed task dispatch service framework and method based on Quartz | |
| CN111090431A (en) | Data processing method and device | |
| CN112784200A (en) | Page data processing method, device, equipment, medium and computer program product | |
| US10761904B2 (en) | Method and system for synchronizing and joining multiple calls to the same asynchronous code segment | |
| CN110955503B (en) | Task scheduling method and device | |
| CN109739489A (en) | Method and device for generating data chart by using JavaScript | |
| US10303523B2 (en) | Method and apparatus to migrate stacks for thread execution | |
| CN101349975B (en) | Method for implementing interrupt bottom semi-section mechanism in embedded operation system | |
| CN117573371B (en) | Scheduling method and device for service running based on graphic processor | |
| CN115202818A (en) | Jenkins-based construction task processing method and device, electronic equipment and medium |
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 | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20190510 |
|
| RJ01 | Rejection of invention patent application after publication |