Python之pyecharts——图像居中调整

最新推荐文章于 2024-04-29 20:29:46 发布

llzlzll

最新推荐文章于 2024-04-29 20:29:46 发布

阅读量6.4k

点赞数 8

分类专栏： python 文章标签： python echarts 开发语言

本文链接：https://blog.csdn.net/llzlzll/article/details/122817568

版权

python 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

前言

今天接触了python中的一个新的模块——pyechars，它的功能是制作html格式的图表文件，非常好用。

一、pyecharts是什么？

Echarts的很常用的数据显示，是用于公开使用的语言的一种设计，由精巧的智能工具提供了力量开发者。分析遇上数据可视化时，pyecharts诞生了。
官网链接在此

二、我遇到的问题

在这里使用方法我就不详细介绍了，因为有别人已经做出了很详细的教程了，直接在本站搜索就行了。
在经过基础的使用后，成功的生成了html目标文件，但是有个问题，就是图标的默认位置为左上角，刚开始看还没什么，但是看久了后感觉很不符合我的阅读习惯，于是我就想着怎么调整它为默认居中，在网上找到的方法如下：

1. 找到pyecharts render配置文件

   1.文件路径 xxx\Lib\site-packages\pyecharts\render\templates

图示是macrowen文件路径

2.修改文件macro

        第一个红色框处修改居中和百分比显示区域

<div id="{{ c.chart_id }}" class="chart-container" style="width:75%; height:75%; margin:auto; top:30px"></div>

        第二个红色框处是额外添加自适应刷新函数，在浏览器屏幕大小发生变化时自己刷新

<script>
     //窗口大小变化时候，进行刷新页面操作，防止样式混乱
     var x=window.innerWidth;
 function resizeFresh(){
     if(x!=window.innerWidth)
         location.reload();
 }
</script>

在这里插入图片描述

3.修改simple_chart.html

在这里插入图片描述
添加刷新函数

<body οnresize="resizeFresh()">  <!-- 添加刷新函数调用 -->

获取宽度、高度

<style type="text/css">
            html,body{
                height:100%;
                width:100%
            }
</style>

在这里插入图片描述

结果

居中，75%的显示，效果很好
在这里插入图片描述

llzlzll

关注

8
点赞
踩
20

收藏

觉得还不错? 一键收藏
6
评论
Python之pyecharts——图像居中调整

今天接触了python中的一个新的模块——pyechars，它的功能是制作html格式的图表文件，非常好用，但是在使用的过程中，我发现图表的默认位置是左上角，刚开始看还没什么，但是看久了后感觉很不符合我的阅读习惯，于是我就想着怎么调整它为默认居中，在网上找到的方法如下：...
复制链接

扫一扫