ECharts是一個(gè)基于JavaScript的可視化庫,歐洲疫情圖等著名圖表示例就是通過ECharts實(shí)現(xiàn)的。同時(shí),jQuery是一個(gè)流行的JavaScript庫,被廣泛應(yīng)用在Web開發(fā)中,它簡化了處理HTML文檔、事件處理、動(dòng)畫效果等多方面操作。那么,ECharts是否支持jQuery呢?
答案是肯定的。ECharts官方文檔明確說明,它兼容jQuery和Zepto,并提供了與這兩個(gè)庫一起使用的示例。
// 引入jQuery和ECharts <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script> <script src="https://cdn.staticfile.org/echarts/4.7.0/echarts.min.js"></script> // 在jQuery回調(diào)函數(shù)中使用ECharts $(function() { // 基于準(zhǔn)備好的dom,初始化echarts實(shí)例 var myChart = echarts.init(document.getElementById('main')); // 指定圖表的配置項(xiàng)和數(shù)據(jù) var option = { xAxis: { type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] }, yAxis: { type: 'value' }, series: [{ data: [120, 200, 150, 80, 70, 110, 130], type: 'bar' }] }; // 使用剛指定的配置項(xiàng)和數(shù)據(jù)顯示圖表 myChart.setOption(option); });
可以看到,ECharts和jQuery的配合非常簡單,只需要在回調(diào)函數(shù)中進(jìn)行初始化、配置項(xiàng)和數(shù)據(jù)的設(shè)置,即可實(shí)現(xiàn)豐富多彩的可視化圖表。
當(dāng)然,如果你更愿意使用其他JavaScript庫,ECharts也提供了與之兼容的示例,方便開發(fā)者自由選擇。