echarts图表按需导入

  • 引入核心包
  • 引入图表类型
  • 引入使用组件
  • 引入渲染器
  • 注册所有引入

在项目中引入 Apache ECharts

// 引入 echarts 核心模块,核心模块提供了 echarts 使用必须要的接口。
import * as echarts from 'echarts/core';
// 引入柱状图图表,图表后缀都为 Chart
import { LineChart } from 'echarts/charts';
// 引入提示框,标题,直角坐标系,数据集,内置数据转换器组件,组件后缀都为 Component
import {
 // TitleComponent,
 // TooltipComponent,
  GridComponent, // 直角坐标系组件
 // DatasetComponent,
 // TransformComponent
} from 'echarts/components';
// 标签自动布局、全局过渡动画等特性
// import { LabelLayout, UniversalTransition } from 'echarts/features';
// 引入 Canvas 渲染器,注意引入 CanvasRenderer 或者 SVGRenderer 是必须的一步
import { CanvasRenderer } from 'echarts/renderers';

// 注册必须的组件
echarts.use([
 // TitleComponent,
 // TooltipComponent,
  GridComponent,
 // DatasetComponent,
 // TransformComponent,
  LineChart,
 // LabelLayout,
 // UniversalTransition,
  CanvasRenderer
]);

// 接下来的使用就跟之前一样,初始化图表,设置配置项
var myChart = echarts.init(document.getElementById('main'));
myChart.setOption({
  // ...
});

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/552571.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

20240417,友元 FRIEND

本来要学习的吃瓜吃了一下午 目录 3.1 全局函数做友元 3.2 友元类 3.3 成员函数做友元 三&#xff0c;友元 3.1 全局函数做友元 #include<iostream> using namespace std; class Building {friend void goodGay(Building* building);//好朋友&#xff0c;可以访问…

13.哀家要长脑子了!

1. 442. 数组中重复的数据 - 力扣&#xff08;LeetCode&#xff09; 哎哟&#xff0c;可能是我太蠢了&#xff0c;我是真的觉得这些题目好神奇的&#xff0c;就这样做到了。感觉这道题跟昨天那道消失的它很类似&#xff0c;但是简单一点。 按照题目的要求数组如果排好序的话应…

必应Bing国内广告推广,帮助企业降低获客成本!

搜索引擎广告作为数字营销的重要手段之一&#xff0c;因其精准定位和效果可衡量而备受青睐。而在众多搜索引擎平台中&#xff0c;必应Bing以其独特的市场定位和用户群体成为不可忽视的广告推广渠道。云衔科技作为一家专业的数字营销服务提供商&#xff0c;致力于帮助企业实现高…

Fiddler抓包工具之高级工具栏中的Inspectors的使用

高级工具栏中的Inspectors的使用 Inspectors 页签允许你用多种不同格式查看每个请求和响应的内容。JPG 格式使用 ImageView 就可以看到图片&#xff0c;HTML/JS/CSS 使用 TextView 可以看到响应的内容。Raw标签可以查看原始的符合http标准的请求和响应头。Cookies标签可以看到…

标志寄存器

文章目录 标志寄存器1. ZF标志2. PF标志3. SF标志4. CF标志5. OF标志6. adc指令7. sbb指令8. cmp指令9. 检测比较结果的条件转移指令10. DF标志和串传送指令11. pushf和popf 标志寄存器 flag 和其他寄存器不一样&#xff0c;其他寄存器是用来存放数据的&#xff0c;都是整个寄…

MCU最小系统晶振模块设计

单片机的心脏&#xff1a;晶振 晶振模块 单片机有两个心脏&#xff0c;一个是8M的心脏&#xff0c;一个是32.768的心脏 8M的精度较低&#xff0c;所以需要外接一个32.768khz 为什么是8MHZ呢&#xff0c;因为内部自带的 频率越高&#xff0c;精度越高&#xff0c;功耗越大&am…

直拍打法 漫漫长夜

小时候爱玩的时候&#xff0c;有马琳&#xff0c;刘国梁这些大腿在&#xff0c;谁敢想象现在顶尖高手中只有一根独苗而且是欧洲本土独苗了&#xff1f; 小勒布伦&#xff0c;真*直拍之光。 有一说一&#xff0c;国际乒联对于器材的调整&#xff0c;无论是改低粘度的无机胶水&am…

Docker(七):容器监控工具(Portainer、CAdvisor)

一&#xff1a;轻量级可视化监控工具Portainer 可视化监控工具, 可以通过docker安装&#xff0c;用于管理和监控docker&#xff0c;基本上的docker命令都有对应的按钮来操作。 # always 表示docker重启了该容器也跟着重启 docker run -d --name portainer -p 8000:8000 -p 90…

使用docker部署数据可视化平台Metabase

目前公司没有人力开发数据可视化看板&#xff0c;因此考虑自己搭建开源可视化平台MetaBase。在此记录下部署过程~ 一、镜像下载 docker pull metabase/metabase:latest 运行结果如下&#xff1a; 二、创建容器 docker run -dit --name matebase -p 3000:3000\ -v /home/loc…

将gidp模块、ipam集成到ultralytics项目中实现gidp-yolov8、ipam-yolov8

gdip-yolo与ia-seg都是一种将图像自适应模块插入模型前面,从而提升模型在特定数据下检测能力的网络结构。gdip-yolo提出了gdip模块,可以应用到大雾数据与低亮度数据(夜晚环境),然后用于目标检测训练;ia-seg将ia-yolo中的代码修改了一下修车了ipam模块,应用到低亮度数据(…

柯桥商务口语之怎么样说英语更加礼貌?十个礼貌用语get起来!

当你在国外需要帮助的时候&#xff0c;这些礼貌用语真的是能够帮到你的哦 1.Would/Could you help me? 你可帮助我吗&#xff1f; 相信有些人想请求帮助的时候&#xff0c;一开口就用Can you&#xff0c;这个用在朋友或者熟人上面当然是没有问题的&#xff0c;但是如果是向…

揭秘“金松奖” | 一个金融科技行业的热门解决方案

近日&#xff0c;2023年度第十届“金松奖”金融科技行业评选结果正式揭晓&#xff0c;开源网安凭借「度小满互联网金融开源软件治理解决方案」入选合规科技发展热门方案。 “金松奖”是移动支付网主办的金融科技行业线上评选活动&#xff0c;旨在从企业、产品、方案和案例等多维…

ArcGIS无法链接在线地图或错误: 代理服务器从远程服务器收到了错误地址(验证服务器是否正在运行)。

这几天我们分享了&#xff01; 谷歌卫星影像图归来&#xff01;ArcGIS直连&#xff01;快来获取_谷歌影像lyr-CSDN博客文章浏览阅读666次&#xff0c;点赞11次&#xff0c;收藏9次。大概。_谷歌影像lyrhttps://blog.csdn.net/kinghxj/article/details/137521877一套图源搞定&a…

别找了,这35份Excel自动排班表真的好用!

别再自己做排班表了&#xff0c;调了半天不好看格式还不对。 看看自己需要的是哪些类型的排班表&#xff1f;是公司值班&#xff0c;还是直播排班&#xff0c;还是考勤汇总&#xff0c;总有一个适合你。 刚整理的35份办公常用的排班表&#xff0c;希望能帮到你&#xff01; …

EI级 | Matlab实现VMD-TCN-LSTM-MATT变分模态分解卷积长短期记忆神经网多头注意力多变量时间序列预测

EI级 | Matlab实现VMD-TCN-LSTM-MATT变分模态分解卷积长短期记忆神经网多头注意力多变量时间序列预测 目录 EI级 | Matlab实现VMD-TCN-LSTM-MATT变分模态分解卷积长短期记忆神经网多头注意力多变量时间序列预测预测效果基本介绍程序设计参考资料 预测效果 基本介绍 1.Matlab实…

Pytest精通指南(16)利用skip、skipif跳过用例执行

文章目录 前言skip源码分析skip装饰方法skip装饰类skip装饰模块skipif源码分析skipif装饰方法skipif装饰类skipif装饰模块拓展-用例内部跳过执行 前言 skip: skip用于无条件地跳过测试用例&#xff0c;无论测试环境的状态或条件如何。通常用于那些在任何情况下都不应该执行的测…

深入解析Rivest Cipher 4:理论与实践

title: 深入解析Rivest Cipher 4&#xff1a;理论与实践 date: 2024/4/17 20:30:58 updated: 2024/4/17 20:30:58 tags: 密码学RC4算法流密码密钥调度安全分析优缺点应用实践 第一章&#xff1a;引言 密码学简介&#xff1a; 密码学是研究如何保护通信和信息安全的学科。它涉…

国内外AI programmer 大全集--持续更新

国内&#xff1a; 通义灵码&#xff1a; 公司&#xff1a;阿里巴巴集团旗下的阿里云发布年份&#xff1a;未明确指出具体年份&#xff0c;但已在2024年4月3日前入职并上岗一段时间名称&#xff1a;通义灵码工号&#xff1a;AI001 iFlyCode&#xff1a; 公司&#xff1a;科大…

RabbitMQ-核心特性

已经不需要为RabbitMQ交换机的离去而感到伤心了&#xff0c;接下来登场的是RabbitMQ-核心特性!!! 文章目录 核心特性消息过期机制消息确认机制死信队列 核心特性 消息过期机制 官方文档&#xff1a;https://www.rabbitmq.com/ttl.html 可以给每条消息指定一个有效期&#xf…

git 分支-变基

在git中&#xff0c;将一个分支的更改集成到另一个分支有两种主要方式&#xff1a;合并&#xff08;merge&#xff09;和变基&#xff08;rebase&#xff09;。在本节中&#xff0c;将学习什么是变基&#xff0c;如何执行变基操作&#xff0c;为什么它是一个非常强大的工具&…