import ReactHighcharts from'react-highcharts';

class SummaryLeft extends Component {
render () {var config = {
chart: {
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false,
},
title: {
text: '',
},
tooltip: {
headerFormat: '{series.name}<br>',
pointFormat: '{point.name}: <b>{point.percentage:.1f}%</b>',
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
format: '<b>{point.name}</b>: {point.percentage:.1f} %',
style: {
color: 'black',
},
},
showInLegend: true,
},
},
series: [{
type: 'pie',
name: '男女比例',
data: [
['男', 45.0],
['女', 45.0],
{
name: '未知',
y: 10.0,
sliced: true,
selected: true,
},
],
}],
};
return (
<div>
<ReactHighcharts config={config} />
</div>
);
}
}

react-highcharts的更多相关文章

  1. React项目中使用HighCharts

    大家都知道BizCharts是基于react封装的一套图表工具,而HighCharts是基于jQuery的.但是由于本人对BizCharts甚是不熟,所以在react项目开发中选择了HighChart ...

  2. gantt甘特图可拖拽、编辑(vue、react都可用 highcharts)

    前言   Excel功能强大,应用广泛.随着web应用的兴起和完善,用户的要求也越来越高.很多Excel的功能都搬到了sass里面.恨不得给他们做个Excel出来...程序员太难了... 去年我遇到了 ...

  3. React 与 Redux 在生产环境中的实践总结

    React 与 Redux 在生产环境中的实践总结 前段时间使用 React 与 Redux 重构了我们360netlab 的 开放数据平台.现将其中一些技术实践经验总结如下: Universal 渲 ...

  4. React 与 可视化

    一般会想到 canvas 和 svg ; svg更适合画图, 但由于cavans在移动端的良好兼容性, 使用的更广; 什么是svg, scalable vector graphics  全称 可缩放矢 ...

  5. react做股票、期货交易遇到的问题(不完全是react)及解决方法。

    公司项目主要是做股票及期货行情展示及交易,h5相应的做了一些功能---可以看行情图及模拟交易,实盘交易存在一定的风险,老板希望做自己的产品,这样h5就尴尬了,不过没关系,项目里还是有一定技术含量的-- ...

  6. react组件的生命周期

    写在前面: 阅读了多遍文章之后,自己总结了一个.一遍加强记忆,和日后回顾. 一.实例化(初始化) var Button = React.createClass({ getInitialState: f ...

  7. 十分钟介绍mobx与react

    原文地址:https://mobxjs.github.io/mobx/getting-started.html 写在前面:本人英语水平有限,主要是写给自己看的,若有哪位同学看到了有问题的地方,请为我指 ...

  8. RxJS + Redux + React = Amazing!(译一)

    今天,我将Youtube上的<RxJS + Redux + React = Amazing!>翻译(+机译)了下来,以供国内的同学学习,英文听力好的同学可以直接看原版视频: https:/ ...

  9. React 入门教程

    React 起源于Facebook内部项目,是一个用来构建用户界面的 javascript 库,相当于MVC架构中的V层框架,与市面上其他框架不同的是,React 把每一个组件当成了一个状态机,组件内 ...

  10. 通往全栈工程师的捷径 —— react

    腾讯Bugly特约作者: 左明 首先,我们来看看 React 在世界范围的热度趋势,下图是关键词“房价”和 “React” 在 Google Trends 上的搜索量对比,蓝色的是 React,红色的 ...

随机推荐

  1. 编译安装 nginx php swoole

    安装之前先 准备环境 yum install gcc gcc-c++ automake pcre pcre-devel zlip zlib-devel openssl openssl-devel 然后 ...

  2. MYSQL不能显示中文字,显示错误“ERROR 1366 (HY000): Incorrect string value: '\xE5\xBC\xA0\xE4\xB8\x89'”

    或者建表时带上编码utf8 CREATE TABLE `students`( `id` INT NOT NULL AUTO_INCREMENT PRIMARY KEY, `name` VARCHAR( ...

  3. 配置基于Vim的Python开发环境

    配置基于Vim的Python开发环境插件 Vundle YouCompleteMe NERDTree Vim-Jinja2-Syntax set nocompatible " be iMpr ...

  4. Linux:FTP服务匿名用户,本地用户,虚拟用户配置

    匿名用户  FTP协议占用两个端口号: 21端口:命令控制,用于接收客户端执行的FTP命令. 20端口:数据传输,用于上传.下载文件数据. 实验:匿名访问,服务器192.168.10.10    客户 ...

  5. sql执行过长,如何入手优化

    一条sql执行过长的时间,你如何优化,从哪些方面 1.查看sql是否涉及多表的联表或者子查询,如果有,看是否能进行业务拆分,相关字段冗余或者合并成临时表(业务和算法的优化)2.涉及链表的查询,是否能进 ...

  6. 通过session模拟登陆

    import requests # 这个练习对比的是上一个登陆练习,这个是不用自己传入cookie参数,而是利用session方法登陆 # 实例化一个session session = request ...

  7. PAT Basic 1082

    1082 射击比赛 本题目给出的射击比赛的规则非常简单,谁打的弹洞距离靶心最近,谁就是冠军:谁差得最远,谁就是菜鸟.本题给出一系列弹洞的平面坐标(x,y),请你编写程序找出冠军和菜鸟.我们假设靶心在原 ...

  8. Linux学习-备份的种类、频率与工具的选择

    完整备份之累积备份 (Incremental backup) 还原的考虑 如果是完整备份的话.若硬件出问题导致系统损毁时,只要将完整备份拿出来,整个给他倾倒回去硬盘, 所有事情就搞定了!有些时候 (例 ...

  9. Java基础之封装

    封装(Encapsulation)是java面向对象的三大特性,之前学java迷迷糊糊,一直也没弄清楚什么是封装以及为什么要封装,直到这次看书才有一种被点醒的感觉. java中的封装是针对某个类而言的 ...

  10. UVa 12235 状压DP Help Bubu

    题解戳这 一开始没看懂题解,后来想明白以后,d(i, j, s, x)是考虑第i本书的时候,前面已经拿走了j本书,剩下的书的种类的二进制状态为s,剩下的最后一本书的编号为x,所能得到的最小混乱度. 这 ...