pyecharts调整图例与各板块的位置间距实例

引入Grid

grid=Grid()
 # 可以分别调整上下左右的位置,可以是百分比,也可以是具体像素,如pos_top="50px"
 grid.add(c,grid_opts=opts.GridOpts(pos_top="50%",pos_bottom="50%",pos_left="50%",pos_right="50%"))

调整前的默认距离

代码如下

from example.commons import Faker
from pyecharts import options as opts
from pyecharts.charts import Bar,Grid

def bar_base() -> Bar:
 c = (
 Bar()
 .add_xaxis(Faker.choose())
 .add_yaxis("商家A", Faker.values())
 .add_yaxis("商家B", Faker.values())
 .set_global_opts(title_opts=opts.TitleOpts(title="Bar-基本示例", subtitle="我是副标题"))
 )

 return c

if __name__ == '__main__':
 bar_base().render()

通过引入Grid调整后

代码如下

from example.commons import Faker
from pyecharts import options as opts
from pyecharts.charts import Bar,Grid

def grid_base() -> Grid:
 c = (
 Bar()
 .add_xaxis(Faker.choose())
 .add_yaxis("商家A", Faker.values())
 .add_yaxis("商家B", Faker.values())
 .set_global_opts(title_opts=opts.TitleOpts(title="Bar-基本示例", subtitle="我是副标题"))
 )

 grid=Grid()
 # 仅使用pos_top修改相对顶部的位置
 grid.add(c,grid_opts=opts.GridOpts(pos_top="50%"))

 return grid

if __name__ == '__main__':
 grid_base().render()

补充知识:python pyecharts Line,折线图 Grid 图例摆放

我就废话不多说了,大家还是直接看代码吧

from pyecharts import Pie,Bar,Gauge,EffectScatter,WordCloud,Map,Line,Grid
import random
attr = ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"]
v1 = [5, 20, 36, 10, 75, 90]
v2 = [10, 25, 8, 60, 20, 80]
bar = Bar("柱状图示例", height=720)
bar.add("商家A", attr, v1, is_stack=True)
bar.add("商家B", attr, v2, is_stack=True)
line = Line("折线图示例", title_top="50%")
attr = ["周一", "周二", "周三", "周四", "周五", "周六", "周日"]
line.add(
"最高气温",
attr,
[11, 11, 15, 13, 12, 13, 10],
mark_point=["max", "min"],
mark_line=["average"],
)

line.add(
"最低气温",
attr,
[1, -2, 2, 5, 3, 2, 0],
mark_point=["max", "min"],
mark_line=["average"],
legend_top="50%",
)

grid = Grid()
grid.add(bar, grid_bottom="60%")
 #此函数用来摆放图的位置
grid.add(line, grid_top="60%")
grid.render('grid.html')

以上这篇pyecharts调整图例与各板块的位置间距实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。

(0)

相关推荐

  • 在vue中添加Echarts图表的基本使用教程

    前言 我们在项目中经常需要使用一些折线图.柱状图.饼状图等等,之前使用过heightCharts,后来觉得这货不开源,只是做展示的话又点浪费时间,于是看了下eCharts,于是在vue-cli搭建的项目中添加了eCharts,下面是具体步骤和自己的一些学习笔记,参照于Echarts3官网 现在的前端一般需要完成将大量的数据,实现可视化.现在是大数据和云计算的时代,所以数据可视化逐渐变成一种趋势.而ECharts和d3.js则是可视化的成熟框架.对于制作的图表可以说是满足你的创造力. 两者相比,D

  • 解决echarts中饼图标签重叠的问题

    饼图中的series有个avoidLabelOverlap属性, avoidLabelOverlap:是否启用防止标签重叠策略,默认开启,在标签拥挤重叠的情况下会挪动各个标签的位置,防止标签间的重叠. 当avoidLabelOverlap设置为false时会出现以下情况 改为true之后就不会重叠 代码如下 var option = { tooltip: { trigger: "item", formatter: "{a} <br/>{b} : {c} ({d}%

  • django echarts饼图数据动态加载的实例

    如下所示: 后台关键代码: data = {} #keys与values分别为该数据的键数组,值的数组.这里循环为字典添加对应键值 for k, v in zip(keys, values): data.update({k: v, },) #最后将数据打包成json格式以字典的方式传送到前端 return render(request, 'index.html', {'data': json.dumps(data)}) 网页(js中)取值关键代码: 1.取值: var kv = new Arra

  • pyecharts调整图例与各板块的位置间距实例

    引入Grid grid=Grid() # 可以分别调整上下左右的位置,可以是百分比,也可以是具体像素,如pos_top="50px" grid.add(c,grid_opts=opts.GridOpts(pos_top="50%",pos_bottom="50%",pos_left="50%",pos_right="50%")) 调整前的默认距离 代码如下 from example.commons impo

  • python中matplotlib调整图例位置的方法实例

    目录 前言 1.loc=‘String or Number’ 2.bbox_to_anchor=(num1, num2) 3.举个栗子: 总结 前言 matplotlib画图例默认的位置是在图中的各个角落,但有时图例位置会遮挡住图像而不符合我们的需求,需要对图例位置进行调整.代码如下: plt.legend(loc=‘String or Number’, bbox_to_anchor=(num1, num2)) 1.loc=‘String or Number’ 这个参数来定位图例的大概位置,st

  • BootStrap表单验证 FormValidation 调整反馈图标位置的实例代码

    在某些情况下,反馈图标未正确显示.默认情况下,Bootstrap定义反馈图标位置如下: .has-feedback .form-control-feedback { top: 25px; right: 0; } .form-horizontal .has-feedback .form-control-feedback { top: 0; right: 15px; } 通过自定义值top和right属性,您可以将反馈图标调整为应有的位置. 按钮组 .btn-group .form-control-

  • 使用jQuery实现两个div中按钮互换位置的实例代码

    效果如下 代码如下: <head> <meta charset="utf-8" /> <title></title> <script type="text/javascript" src="js/jquery-2.1.0.js"></script> <script type="text/javascript"> $(function() { /

  • jquery获取点击控件的绝对位置简单实例

    在使用jquery的过程中,想取得当前点击input的绝对位置而去显示一个div,jquery本身提供offset和position这个两个方法,但position官方解释是relative to the offset parent,可以看到是针对父结点的,而offset官方解释relative to the document,貌似使用offset可以直接绝对定位.但是在网页中如果出现嵌套div的情况,top和left会叠加,因此这个时候如果要定位显示一个新的div就要把父亲结点的offset去

  • jquery 仿锚点跳转到页面指定位置的实例

    js 仿锚点跳转到页面指定位置,用的是 offset() 方法 $(document).ready(function(){ var target_top = $("#qa5").offset().top; //$("html,body").animate({scrollTop: target_top}, 1000); //带滑动效果的跳转 $("html,body").scrollTop(target_top); }); jQuery: offs

  • vue scroller返回页面记住滚动位置的实例代码

    1,设置keepAlive:是否缓存 router: { path: '/actlist', name: 'actlist', component: actlist, meta: { keepAlive: true } } 2,设置渲染页面 app.vue <keep-alive> <router-view v-if="$route.meta.keepAlive"></router-view> </keep-alive> <rout

  • Vue实现按钮旋转和移动位置的实例代码

    1.静态效果图 Chrom移动端浏览模式下可拖动按钮处于任意位置,并且点击可旋转按钮 2.代码 <template> <div id="app"> <div class="icon-add-50" :style="iconstyle" @click='click' @touchmove='touchmove' @touchstart='touchstart(this,$event)' @touchend='touch

  • Python 通过截图匹配原图中的位置(opencv)实例

    安装依赖 1)下载安装opencv-2.4.9,并将cv2.pyd拷贝到python安装目录的site-package下 2)pip install numpy 3)pip install aircv 准备一张原图和截图 原图 截图 代码 import cv2 import aircv as ac # print circle_center_pos def draw_circle(img, pos, circle_radius, color, line_width): cv2.circle(im

  • 微信小程序页面滚动到指定位置代码实例

    这篇文章主要介绍了微信小程序页面滚动到指定位置代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 页面上有一个元素或者组件,id 为 comment 则: var me = this; var query = wx.createSelectorQuery().in(me); query.selectViewport().scrollOffset() query.select("#comment").boundingClientRe

随机推荐