参考demo的codesandbox：https://codesandbox.io/s/kxxxx3w5kv

使用步骤：   1. 安装依赖  viser-react和@antv/data-set

　　　　　　2. 导入图表相关的依赖包

　　　　　　　　import { Chart, Tooltip, Axis, Legend, Line, Point } from "viser-react";
　　　　　　　　const DataSet = require("@antv/data-set");
　　　　　　3. 后面按照官方文档渲染相关图表

react中使用阿里Viser图表的更多相关文章

  1. react 中使用阿里彩色图标

    1. 不光要引入css ,还要引入js 2. 在需要引入icon的地方添加 <svg className={styles.menuIcon} aria-hidden="true&quo ...

  2. 【Web技术】401- 在 React 中使用 Shadow DOM

    本文作者:houfeng 1. Shadow DOM 是什么 Shadow DOM 是什么?我们先来打开 Chrome 的 DevTool,并在 'Settings -> Preferences ...

  3. [RN] React Native 使用 阿里 ant-design

    React Native 使用 阿里 ant-design 实例效果如图: 一.安装 npm install antd-mobile-rn --save npm install babel-plugi ...

  4. 理解React中es6方法创建组件的this

    首发于:https://mingjiezhang.github.io/(转载请说明此出处). 在JavaScript中,this对象是运行时基于函数的执行环境(也就是上下文)绑定的. 从react中的 ...

  5. 报表开发工具中开放的部分图表js接口列表

    1.. 描述 报表开发工具FineReport 8.0版本中开放了部分图表js接口,在具体应用的过程中很多人都不知道这些接口到底有什么作用,该怎么应用,所以根据我自己的应用在下面归纳了这些新开放js接 ...

  6. 【原】React中,map出来的元素添加事件无法使用

    在使用react中,经常用到react的map函数,用法和jquery里中的map一样,但是,如果你在每个map出来的元素中添加,你会发觉添加的事件无法关联, 比如,我们很多的评论,我需要在每个评论下 ...

  7. React中props.children和React.Children的区别

    在React中,当涉及组件嵌套,在父组件中使用props.children把所有子组件显示出来.如下: function ParentComponent(props){ return ( <di ...

  8. Chorme中启动阿里旺旺误点取消启动并记住选择，如何更改。

    今天在Chorme中启动阿里旺旺误点取消启动并记住选择,然后如何也点不开了.从网上找到了一种解决方法: 找到路径   C:\Users\\AppData\Local\Google\Chrome\Use ...

  9. 在OneThink（ThinkPHP3.2.3）中整合阿里云OSS的PHP-SDK2.0.4，实现Web端直传，服务端签名直传并设置上传回调的实现流程

    在OneThink(ThinkPHP3.2.3)中整合阿里云OSS的PHP-SDK2.0.4,实现本地文件上传流程 by shuijingwan · 2016/01/13 1.SDK安装 github ...

随机推荐

  1. CPU与内存互联的架构演变

    随着计算机中CPU核数目的增加,传统的UMA(unifonn memory access)架构由于对关键硬件(如中央内存控制器)的竞争加剧出现了性能上的瓶颈,即扩展性不强.而NUMA架构则以其良好的可 ...

  2. leetcode461

    public class Solution { public int HammingDistance(int x, int y) { ]; ]; ; ; do { aryA[i] = x % ;//将 ...

  3. EasyARM-iMX283A的make menuconfig出现错误：Install ncurses(ncurses-devel) and try again。

    lin@lin-machine:~/linux-2.6.35.3$ make menuconfig *** Unable to find the ncurses libraries or the ** ...

  4. vmware 里MAC 鼠标能移动 无法单击

    vmware 里MAC  鼠标能移动 无法单击 移动有效果,能看到鼠标移动的光标,鼠标放到mac的图标上还有提示,就是无法单击. 键盘正常. 重启mac,重启vmware 20次好了,2小时.

  5. 机器学习中的算法(2)-支持向量机(SVM)基础

    版权声明:本文由LeftNotEasy发布于http://leftnoteasy.cnblogs.com, 本文可以被全部的转载或者部分使用,但请注明出处,如果有问题,请联系wheeleast@gma ...

  6. mac下安装cnpm淘宝镜像

    cnpm:官网 (事先已经安装了node,有npm)查看官网,提示安装需运行命令:npm install -g cnpm --registry=https://registry.npm.taobao. ...

  7. 25.Hibernate-配置文件.md

    目录 1.主配置文件 1.1定义 1.1.1分类 1.1.2分类 1.1.3不使用配置文件生成表 1.2教程 2. 映射配置文件 1.主配置文件 1.1定义 1.1.1分类 在hibernate的配置 ...

  8. 面向对象的css less 和sass

    Css 初始化   reset.css      或者  normalise .   Near.css兼容IE6以及现代浏览器. Oocss  也就是面向对象的css         面向对象是将cs ...

  9. cdnbest独立主控配置自定义错误页面

    注:自定义错误的域名最好配置ssl,不配碰到有使用ssl的域名,错误码显示就会有问题 (1)登陆管理后台点区域列表-->配置-->错误url 解析一个域名到你的cdn主控,然后输入这个ur ...

  10. 《Effective C++》笔记

    01:视c++为一个语言联邦 为了理解C++,必须要认识其主要的次语言: C 说到底C++仍是以C为基础.区块,语句,预处理器,内置数据类型,数组,指针统统来自C. Object-Oreinted C ...