Visualization: Pie Chart(可视化:饼图)
1 <html>
2 <head>
3 <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
4 <script type="text/javascript">
5 google.charts.load('current', {'packages':['corechart']});
6 google.charts.setOnLoadCallback(drawChart);
7
8 function drawChart() {
9
10 var data = google.visualization.arrayToDataTable([
11 ['Task', 'Hours per Day'],
12 ['Work', 11],
13 ['Eat', 2],
14 ['Commute', 2],
15 ['Watch TV', 2],
16 ['Sleep', 7]
17 ]);
18
19 var options = {
20 title: 'My Daily Activities'
21 };
22
23 var chart = new google.visualization.PieChart(document.getElementById('piechart'));
24
25 chart.draw(data, options);
26 }
27 </script>
28 </head>
29 <body>
30 <div id="piechart" style="width: 900px; height: 500px;"></div>
31 </body>
32 </html>

1 <html>
2 <head>
3 <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
4 <script type="text/javascript">
5 google.charts.load("current", {packages:["corechart"]});
6 google.charts.setOnLoadCallback(drawChart);
7 function drawChart() {
8 var data = google.visualization.arrayToDataTable([
9 ['Task', 'Hours per Day'],
10 ['Work', 11],
11 ['Eat', 2],
12 ['Commute', 2],
13 ['Watch TV', 2],
14 ['Sleep', 7]
15 ]);
16
17 var options = {
18 title: 'My Daily Activities',
19 is3D: true,
20 };
21
22 var chart = new google.visualization.PieChart(document.getElementById('piechart_3d'));
23 chart.draw(data, options);
24 }
25 </script>
26 </head>
27 <body>
28 <div id="piechart_3d" style="width: 900px; height: 500px;"></div>
29 </body>
30 </html>

1 <html>
2 <head>
3 <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
4 <script type="text/javascript">
5 google.charts.load("current", {packages:["corechart"]});
6 google.charts.setOnLoadCallback(drawChart);
7 function drawChart() {
8 var data = google.visualization.arrayToDataTable([
9 ['Task', 'Hours per Day'],
10 ['Work', 11],
11 ['Eat', 2],
12 ['Commute', 2],
13 ['Watch TV', 2],
14 ['Sleep', 7]
15 ]);
16
17 var options = {
18 title: 'My Daily Activities',
19 pieHole: 0.4,
20 };
21
22 var chart = new google.visualization.PieChart(document.getElementById('donutchart'));
23 chart.draw(data, options);
24 }
25 </script>
26 </head>
27 <body>
28 <div id="donutchart" style="width: 900px; height: 500px;"></div>
29 </body>
30 </html>

Visualization: Pie Chart(可视化:饼图)的更多相关文章
- bubble chart|Matrix Scatter|Overlay Scatter|Scatterplots|drop-line|box plot|Stem-and-leaf plot|Histogram|Bar chart|Pareto chart|Pie chart|doughnut chart|
应用统计学 对类别数据要分类处理: Bar chart复式条形图便于对比: Pareto chart:对类别变量依据频数高低排列: Pie chart:饼图用于一个样本,可以区分类别数据 doughn ...
- c# 通过.net自带的chart控件绘制饼图pie chart
c# 通过.net自带的chart控件绘制饼图pie chart 需要实现的目标是: 1.将数据绑定到pie的后台数据中,自动生成饼图. 2.生成的饼图有详细文字的说明. 具体的实现步骤: > ...
- 微软BI 之SSRS 系列 - 解决Pie Chart 中控制标签外部显示与标签重叠的问题
当 Pie Chart 页面标签过多的时候,往往数字标签内容挤做一团.我们要做的是:第一,让标签在饼图外部显示:第二,不让标签重叠. 一种做法是通过修改数字标签属性 - Series Label Pr ...
- Iocomp控件教程之Pie Chart——饼状图控件
Pie Chart--饼状图控件(Pie Chart)以饼状图形式显示每一个项目内容所占的百分比比重.在设计时.能够使用属性编辑器加入或者移除项目以及更改属性值.在执行时.使用AddItem,Remo ...
- Highcharts - Pie Chart
1. 饼状图(Pie Chart)示例: <div id="container" style="height: 400px"></div> ...
- Relative-Frequency|frequency|pie chart |bar chart
2.2Organizing Qualitative Data The number of times a particular distinct value occurs is called its ...
- Matplotlib学习---用matplotlib画饼图/面包圈图(pie chart, donut chart)
我在网上随便找了一组数据,用它来学习画图.大家可以直接把下面的数据复制到excel里,然后用pandas的read_excel命令读取.或者直接在脚本里创建该数据. 饼图: ax.pie(x,labe ...
- Jfreechart 生成不同数据源多个饼图(Multiple Pie Chart)
http://blog.163.com/ppy2790@126/blog/static/103242241201210130736274/ 项目中要用JfreeChart实现不同数据源多个饼图展现每个 ...
- 微软BI 之SSRS 系列 - 不显示 Pie Chart 饼图上 0% 的数据
SSRS 小技巧系列专门用来记录 SSRS 报表开发过程中常用的小技巧 - 效果图 - 0% 的标签数据不需要显示出来. 效果图 - 正常的效果. 解决方法 - 使用 IIF 条件判断,如果计算值为 ...
- dimensionality reduction动机---visualization(将数据可视化帮助我们更好地理解数据)
如果我们能更好地理解我们的数据,这样会对我们开发高效的机器学习算法有作用,将数据可视化(将数据画出来能更好地理解数据)出来将会对我们理解我们的数据起到很大的帮助. 高维数据如何进行显示 GDP: gr ...
随机推荐
- Ubuntu 22.04 显示检测到窗口系统采用wayland协议
解决方法 sudo vim /etc/gdm3/custom.conf #WaylandEnable=false 的注释井号去掉 sudo service gdm3 restart 参考资料 http ...
- (19)go-micro微服务filebeat收集日志
目录 一 Filebeat介绍 二 FileBeat基本组成 三 FileBeat工作原理 四 Filebeat如何记录文件状态: 五 Filebeat如何保证事件至少被输出一次 六 安装Filebe ...
- NG-ZORRO + Angular11增加自定义全局样式,不影响其他页面全局样式,仅作用于当前页面
实现只需要两步 ts import { ViewEncapsulation } from '@angular/core';// 关键代码 @Component({ selector: 'app-tes ...
- SSM使用PageHelper
第一步---->导入Maven依赖 <!--pageHelper--> <dependency> <groupId>com.github.pagehelper ...
- Python调用Openstack API
本文将介绍如何使用 python 调用 OpenStack API. 什么是RESTful API RESTful API 就是 RESTful 风格的 API.遵循 RESTful 风格开发的API ...
- python自动发布
import os import paramiko baseconfig = { "ip": "121.4.38.187", "port": ...
- 浅析 SeaweedFS 与 JuiceFS 架构异同
SeaweedFS 是一款高效的分布式文件存储系统,最早的设计原型参考了 Facebook 的 Haystack,具有快速读写小数据块的能力.本文将通过对比 SeaweedFS 与 JuiceFS 在 ...
- 又花了半个小时将 ChatGPT 接入了钉钉机器人
前面的文章给大家介绍了如何在个人微信中使用 ChatGPT,但是大家都知道这种操作是有风险的,所以都让大家使用小号,今天再给大家介绍一下如何在钉钉中使用机器人来调戏 AI. 流程 注册钉钉开发者平台账 ...
- c++标准库string的使用完美总结——十分详细,复习学习记忆都可以使用
std::string详解 之所以抛弃char*的字符串而选用C++标准程序库中的string类,是因为他和前者比较起来,不必 担心内存是否足够.字符串长度等等,而且作为一个类出现,他集成的操作函数足 ...
- Spring(Ioc DI、Spring的继承-依赖)
IoC Di Di 指的是bean之间的依赖注入,设置对象之间的级联关系 Classes: package com.southwind.entity; import lombok.Data; @Dat ...