pyecharts图表使用系列
本系列可能会长期更新，所有的代码使用说明均来自于https://pyecharts.org/#/zh-cn/basic_charts网站，大家可以多看看，有错大家也可以多多评论。
本系列将会从基本图表开始讲解，然后中间的配置项会介绍常用的部分然后再进行延伸至配置项。
Calendar：日历图
Calendar前置工作
在开始具体讲解日历图之前，先给大家看看日历图最终画出来的效果图：
我们再来看看，既然我们说了是pyecharts中的Calendar，我们肯定需要使用所对对应的包：
# options常用于配置pyecharts的属性
from pyecharts import options as opts
# 本期的主句 Calendar类
from pyecharts.charts import Calendar
这是我们肯定需要的两个最重要的引入了，但是既然日历与时间挂钩了，我们就不得不再带另外一个包来进行玩了。（datetime：你人真好，还带我玩
）不说这么多，那我们再来看看导入datatime，因为样例数据太难找了，我就和pyecharts一样使用随机数据了，所以再导入一个random。（random：好耶，还带我玩）
import datetime
import random
数据的创建如下：
begin = datetime.date(2017, 1, 1)
end = datetime.date(2017, 12, 31)
data = [
[str(begin + datetime.timedelta(days=i)), random.randint(1000, 25000)]
for i in range((end - begin).days + 1)
]
在这里创建了从2017-1-1导2017-12-31 (闭区间嗷！！！) 的随机数据。在这里data的数据创建用来省略的写法，如果不太熟练的朋友可以写如下的方法嗷。
data=[]
for i in range((end - begin).days + 1):
data.append([str(begin + datetime.timedelta(days=i)), random.randint(1000, 25000)])
好了好了，现在数据也创建好了
Calendar的方法属性介绍
准备工作已经全部准备就绪了，但是！
当然就是我们最后的Calendar类，这才是今儿的重头戏呢，我们先来看看创建Calendar类，会有两种不同的写法，对于pyecharts中的样例写法都是
c = (
Calendar()
.add("", data, calendar_opts=opts.CalendarOpts(range_="2017"))
.set_global_opts(
title_opts=opts.TitleOpts(title="Calendar-2017年微信步数情况"),
visualmap_opts=opts.VisualMapOpts(
max_=20000,
min_=500,
orient="horizontal",
is_piecewise=True,
pos_top="230px",
pos_left="100px",
),
)
.render("calendar_base.html")
)
但是对于我自己来说并不是特别喜欢，所以我将会用我自己的代码风格来写，也希望能找到同道中人（？）
calendar = Calendar()
这一语句就创建了calendar对象，在这里可以加入InitOptions，对calendar进行初始化配置。下面我们一起来看看InitOptions的内部属性。
class InitOpts(
# 图表画布宽度，css 长度单位。
width: str = "900px",
# 图表画布高度，css 长度单位。
height: str = "500px",
# 图表 ID，图表唯一标识，用于在多图表时区分。
chart_id: Optional[str] = None,
# 渲染风格，可选 "canvas", "svg"
# # 参考 `全局变量` 章节
renderer: str = RenderType.CANVAS,
# 网页标题
page_title: str = "Awesome-pyecharts",
# 图表主题
theme: str = "white",
# 图表背景颜色
bg_color: Optional[str] = None,
# 远程 js host，如不设置默认为 https://assets.pyecharts.org/assets/"
# 参考 `全局变量` 章节
js_host: str = "",
# 画图动画初始化配置，参考 `global_options.AnimationOpts`
animation_opts: Union[AnimationOpts, dict] = AnimationOpts(),
)
在InitOption中我们常用的属性有width, height, bg_color，可能根据不同的需求大家最后的所需要用的属性都不同，若大家觉得有需要可以自己多去尝试。
而对于width， height可以的设置可以使用%，rpx，px，而对于px就是像素，这个很容易理解，那对于rpx呢？rpx是一种自适应的单位，例如1000rpx就是把当前页面均分为1000份，而%就是图像占页面的百分数。因为最后都是渲染都是通过html代码，所以想要了解更多可以多去参考html。
而对于bg_color是用于设置图表的背景颜色，但是bg_color可以使用十六进制和rgb数值来设置例如设置白色可以使用rgb(0,0,0)和#ffffff,但是属性都要使用str类型，也就是设置的时候需要'rgb(0,0,0)'，'#ffffff'
最后的图像我们都是要进行下载，所以对于page_title这里就不再进行介绍了。
小编对于Calendar类的初始化为
calendar = Calendar(init_opts=opts.InitOpts(width='1000px', height='1000px', bg_color='#000000'))
我们再来看看add函数
def add(
# 系列名称，用于 tooltip 的显示，legend 的图例筛选。
series_name: str,
# 系列数据，格式为 [(date1, value1), (date2, value2), ...]
yaxis_data: Sequence,
# ChartType 复合类型, 默认 `ChartType.HEATMAP`
type_: types.Union[str, ChartType]
# 是否选中图例
is_selected: bool = True,
# 日历图索引
calendar_index: types.Optional[types.Numeric] = None,
# 标签配置项，参考 `series_options.LabelOpts`
label_opts: Union[opts.LabelOpts, dict] = opts.LabelOpts(),
# 日历坐标系组件配置项，参考 `CalendarOpts`
calendar_opts: Union[opts.CalendarOpts, dict, None] = None,
# 提示框组件配置项，参考 `series_options.TooltipOpts`
tooltip_opts: Union[opts.TooltipOpts, dict, None] = None,
# 图元样式配置项，参考 `series_options.ItemStyleOpts`
itemstyle_opts: Union[opts.ItemStyleOpts, dict, None] = None,
# 数据映射配置项，参考 `global_options.VisualMapOpts`
visualmap_opts: types.VisualMap = None,
)
对于add函数中常用的series_name, yaxis_data, calendar_opts这三个属性
series_name使用的为str类型，为了多种yaxis_data图例做准备，但是对于日历图中的热力图(HeatMap)来说，图例似乎没有太多的作用，所以我们后面就不再设置这个属性了
yaxis_data使用的为[(date1, value1), (date2, value2), ...]类型
calendar_opts使用的则是使用的Options中的CalendarOpts类进行的赋值，所以我们就来继续讲讲CalendarOpts的属性
class CalendarOpts(
# calendar组件离容器左侧的距离。
# left 的值可以是像 20 这样的具体像素值，可以是像 '20%' 这样相对于容器高宽的百分比，
# 也可以是 'left', 'center', 'right'。
# 如果 left 的值为'left', 'center', 'right'，组件会根据相应的位置自动对齐。
pos_left: Optional[str] = None,
# calendar组件离容器上侧的距离。
# top 的值可以是像 20 这样的具体像素值，可以是像 '20%' 这样相对于容器高宽的百分比，
# 也可以是 'top', 'middle', 'bottom'。
# 如果 top 的值为'top', 'middle', 'bottom'，组件会根据相应的位置自动对齐。
pos_top: Optional[str] = None,
# calendar组件离容器右侧的距离。
# right 的值可以是像 20 这样的具体像素值，可以是像 '20%' 这样相对于容器高宽的百分比。
# 默认自适应。
pos_right: Optional[str] = None,
# calendar组件离容器下侧的距离。
# bottom 的值可以是像 20 这样的具体像素值，可以是像 '20%' 这样相对于容器高宽的百分比。
# 默认自适应。
pos_bottom: Optional[str] = None,
# 日历坐标的布局朝向。可选：
# 'horizontal', 'vertical'
orient: Optional[str] = None,
# 必填，日历坐标的范围 支持多种格式，使用示例：
# 某一年 range: 2017
# 某个月 range: '2017-02'
# 某个区间 range: ['2017-01-02', '2017-02-23']
# 注意 此写法会识别为['2017-01-01', '2017-02-01']
# range: ['2017-01', '2017-02']
range_: Union[str, Sequence, int] = None,
# 星期轴的样式，参考 `series_options.LabelOpts`
daylabel_opts: Union[LabelOpts, dict, None] = None,
# 月份轴的样式，参考 `series_options.LabelOpts`
monthlabel_opts: Union[LabelOpts, dict, None] = None,
# 年份的样式，参考 `series_options.LabelOpts`
yearlabel_opts: Union[LabelOpts, dict, None] = None,
)
在CalendarOpts中我们来看看pos这一整个系列的属性pos_left, pos_right, pos_top, pos_bottom这五个属性是日历的位置设置，也是可以用px, rpx, %来设置
在看一下range_属性，在代码注释中我们也有解释
# 某一年 range: 2017
# 某个月 range: '2017-02'
# 某个区间 range: ['2017-01-02', '2017-02-23']
而orient属性使用的是展开方向，vertical是竖向的排布，horizontal是横向的排布
上图是orient设置的vertical竖向排布
上图是orient设置的horizontal横向排布
下面我将贴出所有的代码
import random
import datetime
# options常用于配置pyecharts的属性
from pyecharts import options as opts
# 本期的主句 Calendar类
from pyecharts.charts import Calendar
begin = datetime.date(2017, 1, 1)
end = datetime.date(2017, 12, 31)
data = [
[str(begin + datetime.timedelta(days=i)), random.randint(1000, 25000)]
for i in range((end - begin).days + 1)
]
# data=[]
# for i in range((end - begin).days + 1):
# data.append([str(begin + datetime.timedelta(days=i)), random.randint(1000, 25000)])
calendar = Calendar(init_opts=opts.InitOpts(width='1200px', height='400px', bg_color='#ffffff'))
calendar.add(series_name='',
yaxis_data=data,
calendar_opts=opts.CalendarOpts(pos_top='120px',
pos_left='30px',
pos_right='30px',
range_='2017',
orient='horizontal'
))
calendar.set_global_opts(title_opts=opts.TitleOpts(pos_top='30px', pos_left='center', title='2017随机步数'),
visualmap_opts=opts.VisualMapOpts(max_=20000,
min_=500,
orient='horizontal',
is_piecewise=False
),
tooltip_opts=opts.TooltipOpts(trigger="axis"),
toolbox_opts=opts.ToolboxOpts(is_show=True),
)
calendar.render('Calendar.html')
看了全部代码之后，我们发现还有一个set_global_opts的方法，这是全局配置，我们最后再来看看set_global_opts，仅讲解一下我们用到的方法，不会全部介绍，因为太多了
之后碰到了再细讲嘛
先来看看title_opts，该属性赋值使用的是opts中的TitleOpts
TitleOpts：
- 依旧有我们的老朋友pos系列（
pos_top, pos_bottom, pos_left, pos_right）用于调整标题位置，当然还有副标题可以设置，在之后碰到了在进行阐述 title就是主标题的内容
再来看看visualmap_opts，该属性的赋值使用的是opts中的VisualMapOpts
VisualMapOpts：
- 里面依旧有我们的老朋友pos系列（
pos_top, pos_bottom, pos_left, pos_right），但是我们在这里就不阐述了，我们讲讲使用了的属性 max_和min_，注意！！！！！！！！！这里不是简单的max和min而是max_和min_,就是我们这个配置项中的最大值和最小值，不知道大家还记得我们设置随机数据的时候random的最大值和最小值，当时我们设置的就是1000-20000，所以我们在VisualMapOpts设置的范围要大于这个数据范围。- 还有一个
is_piecewise，这个是用来设置是否数据是否分段，我们设置的False就是以为连续
tooltip_opts和toolbox_opts：
在这两个小编暂时也不是太熟悉，但是我们使用这个是为了方便导出图片
这就是工具栏，最左边的就是导出图片！！！
最后的留言
这是第一次在CSDN发博客，希望请喷，后面小编也会自己使用的同时缓慢更新，就酱！！！开摇！！！
希望大家可以画出自己想要的图像！！！也希望大家可以跟小编多多交流
2万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
