Customizable ETS line chart
Add-ons
Plugin description: Built using the ECharts framework. Every property can be adjusted independently to meet your requirements. The code includes comprehensive comments and is easy to understand.
Last updated: 2019-10-11 01:06:40
Usage
css
Everything is displayed on the page. The width can be adjusted to fit the screen and adapt the chart accordingly.
html
1 2 3 4 5 6 7 8 | <div class="main"> <div id="layer04" class="layer" data-ydata="48, 52, 45, 46, 89, 120, 110,100,88,96,88,45,78,67,89,103,104,56,45,104"> <div id="layer04_left" class="layer04-panel"> <div id="layer04_left_label" class="layer04-panel-label">Daily Average Line Chart Trend</div> <div id="layer04_left_chart" class="layer04-panel-chart"></div> </div> </div></div> |
js
1 2 3 | $(function(){ renderLayer04Left();}); |
Include Files
1 2 3 | <script src="jquery-3.1.0.min.js"></script><script src="echarts_4.1.0.rc2_echarts.min.js"></script><script src="monitor.js"></script> |
Finally: The code is thoroughly commented, and all settings can be adjusted in monitor.js. If you need to add other properties, please refer to the official ECharts documentation:
评论