echarts官方js引入地址

博客主要提及了ECharts官方JS的引入地址,涉及前端开发中ECharts和JavaScript的相关内容。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

echarts官方js引入地址

ECharts 是一款由百度开源的数据可视化库,支持多种图表类型,并且可以根据需求定制复杂的图表组合。为了在项目中引入 ECharts,你可以选择不同的方式来添加它的引用。 ### CDN 引入 最简单的方式就是通过CDN直接在线引入 ECharts 库文件到 HTML 文件中: ```html <!DOCTYPE html> <html style="height: 100%"> <head> <!-- 引入 ECharts 文件 --> <script src="https://cdn.jsdelivr.net/npm/echarts@5.4.2/dist/echarts.min.js"></script> </head> <body style="height: 100%; margin: 0"> <!-- 图表容器 --> <div id="main" style="height: 100%"></div> <script type="text/javascript"> // 初始化 echarts 实例并配置基本选项... var myChart = echarts.init(document.getElementById('main')); // 指定图表的配置项和数据 var option = { title: { text: 'ECharts 示例' }, tooltip: {}, xAxis: { data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"] }, yAxis: {}, series: [{ name: '销量', type: 'bar', data: [5, 20, 36, 10, 10, 20] }] }; // 使用刚指定的配置项和数据显示图表。 myChart.setOption(option); </script> </body> </html> ``` 上述代码片段展示了如何利用 `jsdelivr` 提供的一个稳定版本 (`v5.4.2`) 的 ECharts 进行快速集成。当然也可以从其他主流的 CDNs 获取最新的发布版如 unpkg 或者 bootcss 等等。 此外,如果你正在构建一个大型应用或者需要离线环境下工作,则可以考虑下载源码至本地服务器再进行部署;又或者是借助 npm/yarn 包管理工具将它作为依赖安装进项目里去(例如:`npm install echarts --save`),然后按照模块化加载的形式来进行操作。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值