Description of Requirement
Echarts is an open source JavaScript implementation of visualization library, which provides intuitive, interactive rich, highly personalized custom data visualization charts. Echarts new version will add some new features for users to choose to use, the updated version of the official website after echarts, how to synchronize the updated version of the tool in a report echarts it?
problem analysis
echarts as a third-party chart Run Dry statements introduced, so just need to echarts core files into the corresponding directory on it.
Specific operation
1, echarts official website to download the file
Access https://www.echartsjs.com/zh/download.html
in accordance with Method II Download the complete echarts compiled file from GitHub, to download the 4.4.0 version, for example, as follows:
Click on 4.4.0 back Dist will enter into the following interface:
Then click the parent directory, go to the home directory echarts:
Finally, click clone or download the file for a complete echarts.
2, Run Dry Reporting Configuration
The acquired after unpack the archive and the incubator-echarts-4.4.0 entire folder into the demo \ under raqsoft, where you can rename it folder: echarts4.4 to distinguish between versions.
Note: If you need to use echarts2 version, do not delete the built-in echarts2 folder and its contents below.
3, showing test
When the various versions of the test echarts reports show normal, indicating that the upgrade has been successful.
The following is a description of each version of the test.
1) echarts2 test version
<1> echarts2 template:
<div ID = '$ {ID}' style = "width: $ {} PX width; height: height $ {} PX"> </ div> <Script type = "text / JavaScript"> // Data preprocessing may here complete the require ( [ 'echarts', 'echarts / Chart / Line' // load module needed ], function (EC) { var myChart = ec.init (document.getElementById ( '$ {ID}')); option = {var // copy downloaded from the official website html option portion disposed }; myChart.setOption (option); } ); </ Script>
<2> echarts2 exemplary report files
2) echarts3 above test
<1> echarts3 above template:
<div ID = '$ {ID}' style = "width: $ {} PX width; height: height $ {} PX"> </ div> <Script type = "text / JavaScript"> // Data preprocessing may done here var $ {} _dom ID = document.getElementById ( '$ {ID}'); var = myChart echarts.init ($ {ID} _dom); var Option = { // copy downloaded from the official web portion html configuration option }; myChart.setOption (option); </ Script>
<2> echarts3 exemplary report files
<3> echarts4 exemplary report files