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 安装搜狗输入法
下载搜狗输入法 下载地址https://shurufa.sogou.com/linux 也可以命令下载 wget https://ime.sogouimecdn.com/202212182151/3b ...
- MySQL中多种排名实现
一.数据库表结构以及数据 CREATE TABLE `forlan_score` ( `id` bigint(20) NOT NULL AUTO_INCREMENT COMMENT '主键ID', ...
- Java 入门与进阶P-7.3+P-7.4
函数的调用 简单应用举例 例1:编写一个求两个数的和的子函数 要求使用键盘录入的方式: 分析与总结: 要实现某一功能,把其定义为一个函数封装起来 就可以重复多次使用:这样一来,main函数里的代码减少 ...
- 【学习笔记】C/C++ 设计模式 - 工厂模式(上)
介绍说明 在年初七的时候,学习了工厂模式,今天在复习的时候发现漏了几个知识点,因此重写这篇文章,以循环渐进的描述方式来对比不同的使用技巧. 工厂设计模式属于 "创建型设计模式",在 ...
- 图解B树及C#实现(3)数据的删除
目录 前言 从叶子节点删除数据 从非叶子节点删除数据 提前扩充只有 t-1 的 Item 的节点:维持 B树 平衡的核心算法 从左兄弟节点借用 Item 从右兄弟节点借用 Item 与左兄弟节点或者右 ...
- Markdown箭头总汇
Markdown箭头的汇总 普通箭头 \[\uparrow \] $$\uparrow$$ \[\Uparrow \] $$\Uparrow$$ \[\downarrow \] $$\downarro ...
- LeetCode_周赛_330
6337. 统计桌面上的不同数字 代码 后面出现的数字都是小于 n 的. n = 1 时,答案是 1. n > 1时: 第一天,n % (n - 1) == 1,n - 1会被加入 第二天,(n ...
- 力扣---45. 跳跃游戏 II
给定一个长度为 n 的 0 索引整数数组 nums.初始位置为 nums[0].每个元素 nums[i] 表示从索引 i 向前跳转的最大长度.换句话说,如果你在 nums[i] 处,你可以跳转到任意 ...
- .NET Core MongoDB的简单使用
一.创建测试库.测试表.添加测试数据 使用之前文章提到的MongoDB Compass用法分别添加数据库[myDb]和集合(表)[userinfos]信息, 参考链接为:MongoDB Compass ...
- 微信小程序更新机制
微信小程序更新机制的说明 官方文档地址:https://developers.weixin.qq.com/miniprogram/dev/framework/runtime/update-mechan ...