Echarts
A powerful, interactive charting and visualization library for browser
EChart documentationsJavascript
<script src="assets/lib/echarts/echarts.min.js"></script>
Line Chart
<div class="echart-line-total-sales" style="min-height: 300px;" data-echart-responsive="true"></div>
Bar Chart
<div class="echart-bar-top-products" style="height: 300px;" data-echart-responsive="true"></div>
Doughnut Chart
<div class="d-flex justify-content-center">
<div class="echart-doughnut" style="height: 242px; width: 242px;" data-echart-responsive="true"></div>
</div>
World Map
<div class="echart-world-map" style="height: 300px;" data-echart-responsive="true"></div>
World.js
Echarts doesn't include map data by default. You need to import world.js
in your html file.
<script src="assets/lib/echarts/world.js"></script>
Responsive
To responsive Echarts just add data-echart-responsive="true"
in your dom element. Falcon will take the true
value and will resize the charts when container size changes.