react antv g2 图表更新踩坑记录

2023-11-15

记录一下 antv g2 踩的坑

1.声明一个chart

let charts = useRef()

2.通过调接口获取数据源

3.判断是否第一次获取数据源

   if("是否第一次获取数据源"){
        enterpriseColumn(res.data)
      }else{
         charts.current.changeData(res.data ? res.data : [])
       }
  // 第一次获取数据源时
  const enterpriseColumn =(data)=>{
    charts.current = new Chart({
       container: 'container',
       autoFit: true,
       height: 387,
     });
     charts.current.data(data ? data : []);
       
     charts.current.scale('num', {
       nice: true,
       alias: '数量',
     });
     
     charts.current.tooltip({
       showMarkers: false
     });
     charts.current.interaction('active-region');
     
   charts.current.interval().position('month*num');
 
    charts.current.render();
   }
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

react antv g2 图表更新踩坑记录 的相关文章

随机推荐

  • Qt编程(二)-初步进阶

    Qt编程 初步进阶 前言 一 Qt自定义信号和槽 1 自定义信号和槽 2 自定义信号带参数重载问题 3 函数重载问题总结 4 信号和槽的扩展 1 信号连接 connect 2 信号的断开 disconnect 3 信号和槽的参数 二 Lam
  • LetCode#1给定一个整数数组 nums 和一个整数目标值 target,请你在该数组中找出 和为目标值 的那 两个 整数,并返回它们的数组下标。JAVA

    题目 给定一个整数数组 nums 和一个整数目标值 target 请你在该数组中找出 和为目标值 的那 两个 整数 并返回它们的数组下标 你可以假设每种输入只会对应一个答案 但是 数组中同一个元素在答案里不能重复出现 你可以按任意顺序返回答
  • Vue-cli快速创建vue项目

    使用vue cli需要的环境 nodejs 一 什么是vue cli 还记得最初使用webpack搭建项目的痛苦了吗 各种配置 去配置我们的各种loader 插件 项目运行脚本 非常难受 今天我们就学习vue cli 这个东西 再无webp
  • 直接替换Springboot jar包中的文件

    Linux Springboot 在不重新打包的情况下 修改配置文件 直接vim xxx jar包后 可以通过 关键字来查找文件 查找到以后 通过方向键进行控制 enter进入文件 i进入插入模式 修改文件 保存等操作和vim的操作一样 修
  • spdlog日志安装与使用

    spdlog是一个开源的且只需要头文件即可使用的跨平台日志库 适用于c 11版本 1 安装步骤 1 源码下载 git clone https github com gabime spdlog 2 拷贝头文件 cp rf spdlog inc
  • Java中的“static“关键字

    写在前面 前阵子看到一篇有关于Java中static的使用和介绍 讲的比较全面 近几日忽然想起早先工作碰到的有关static的相关问题 自己也总结一下吧 static是我们项目中经常用到的关键字 也是Java中非常重要的一个关键字 stat
  • 单片机多任务程序的框架

    下面说的单片机也主要是51与台系芯片 也就是现在的工作 其它应用不在讨论范围 才识有限 也敬请前辈们勘误 指教 一个真正意义的单片机系统肯定会是多任务的 怎样建立一个多任务程序的框架 1 前后台系统 前台是中断程序 后台是执行主程序 当中断
  • java 图书馆管理系统(超低配版)

    目录 图书管理系统要求 思路 show 方法 add 方法 search方法 delete 方法 代码 接口 Book类 Reader类 User类 Informatica类 BookList类 ReaderList类 UserList类
  • 借助py2neo将csv文件导入neo4j

    下载安装建议 戳我 启动neo4j 安装好之后以管理员权限启动 cmd 输入 neo4j bat console 启动 neo4j 在浏览器端可以打开 http localhost 7474 则说明启动成功 关于py2neo 先来了解些 p
  • this指针概念

    c 中成员变量和成员函数是分开存储的 每一个非静态成员函数只会诞生一份函数实例 也就是说多个同类型的对象会共用一块代码 那么问题是 这一块代码是如何区分哪个对象调用自己呢 c 通过特殊的对象指针 this指针 解决上述问题 this指针指向
  • 数组判断任意出现的重复值

    1 题目背景 给你一个整数数组nums 如果任一值在数组中出现至少两次 返回true 如果数组中每个元素互不相同 返回false 2 代码实现 public class Solution public static void main St
  • socat开放端口&&net命令&&sc命令

    socat socat是一个多功能的网络工具 名字来源于SOcket CAT 是netcat的增强版 扩展了设计 并有新的实现 工具下载地址 http www dest unreach org socat 演示如何开放端口 1 如下所示 开
  • Java动态执行代码字符串

    1 步骤 假如我们需要动态执行一段字符串形式的java代码 大概需要这样几步 生成文件 具体的文件 内存中的文件 调用javac编译 通过反射执行 2 生成文件 确定字符串的形式 字符串已经是完整的 java形式 那么就不再需要再做操作 写
  • 尼克劳斯·沃斯奖 (Niklaus Wirth Award) Pascal最具价值贡献者奖Marco Cantú获奖感言:关于Pascal和Delphi历史的个人观点

    这是一篇很长的博客文章 其中包含我在萨拉曼卡国际Pascal帕斯卡大会上发表的演讲 这是一部Pascal的历史 但是是从非常个人的角度来看的 在开始演讲之前 我要感谢国际Pascal大会的组织者 特别是塞尔吉奥 他们为举办这次活动付出了巨大
  • QT图片叠加CompositionMode效果一览

    QPixmap tmpPix pix size tmpPix fill Qt transparent QPainter p1 tmpPix p1 setCompositionMode QPainter CompositionMode Sou
  • C++操作Redis的简单例子

    相信做过服务端开发的应该都知道Redis的大名 它是一个开源的使用ANSI C语言编写 支持网络 可基于内存亦可持久化的日志型 Key Value数据库 我们后台是用C 开发的 问了下他们 用的缓存框架有Redis SSDB 今天看了几个帖
  • linux kill掉其他的登录用户

    为什么80 的码农都做不了架构师 gt gt gt 我们在LINUX下可以使用多个用户在不同地方连接上LINUX服务器 这样也出现一个问题就是会有多个用户登陆到服务器上了 在系统中我们可以使用命令who 或者w 来查看当前有多少个用户登陆了
  • 华为云云耀云服务器 L 实例评测|配置教程 + 用 Python 简单绘图

    文章目录 Part I Introduction Chap I 云耀云服务器 L 实例简介 Chap II 参与活动步骤 Part II 配置 Chap I 初步配置 Chap II 配置安全组 Part III 简单使用 Chap I V
  • 快速入门 Logback

    简介 Logback 旨在作为流行的 log4j 项目的继承者 它是由 log4j 创始人 Ceki Gulcu 设计的 同时它也是 SpingBoot 项目的默认日志框架 安装 因为 logback 需要和 slf4j 一起使用 所以总共
  • react antv g2 图表更新踩坑记录

    记录一下 antv g2 踩的坑 1 声明一个chart let charts useRef 2 通过调接口获取数据源 3 判断是否第一次获取数据源 if 是否第一次获取数据源 enterpriseColumn res data else