在雷达图上绘出背景形状

2024-03-29 11:12:14 发布

您现在位置:Python中文网/ 问答频道 /正文

具有以下功能:

def plot_radar_analysis(df_team_matches, team=None, gameweek=None, kip=None):

  from math import pi
  import plotly.express as px
  from colors import full_team_colors

  gameweeks=range(1,gameweek+1)

  df_temp = df_team_matches.loc[(df_team_matches['ForTeam']==team[0])
                                &(df_team_matches['GameWeek'].isin(gameweeks))]

  indicator = df_temp[kip[0]]

  R = list(indicator.values)
  theta = [('Rodada ' + str(i)) for i in list(df_temp['GameWeek'].values)]

  color = full_team_colors[team[0]]

  df = pd.DataFrame(dict(
    r=R,
    theta=theta))

  fig = px.line_polar(df, r='r', theta='theta', line_close=True, title=f'{team[0]} - {kip[0]}')
  fig.update_polars(angularaxis_type="category") 
  fig.update_traces(fill='toself', line_color=color)
  fig.update_traces(mode="markers+lines")

  return fig

我画了这样一幅图:

enter image description here


不,我想为我的雷达图添加样式,并为我的主要人物添加一些低透明度形状,以便使背景看起来像这样:

enter image description here

请注意,与足球相关的形状应保留在背景中,红色区域将位于这些形状之上


有人能给我指出正确的方向,告诉我如何画出这些形状,并获得与上图相似的结果吗


Tags: importnonedflinefigupdatetempteam
1条回答
网友
1楼 · 发布于 2024-03-29 11:12:14

也许有更好的方法,但这是我的发现

使极轴栅格透明

  • 通过向fig.update_polars调用添加bgcolor="rgba(0, 0, 0, 0)"参数,使网格的背景色透明。(最后一个零很重要,其他值无关紧要)
    fig.update_polars(angularaxis_type="category",
                      bgcolor="rgba(223, 223, 223, 0)")

将图像添加到背景

  • 使用pillow从硬盘上的文件创建图像对象
  • 将图像添加到
from PIL import Image

fig.add_layout_image(
    dict(source=Image.open('bg_football.jpg'),
            xref="paper",
            yref="paper",
            x=0.5,
            y=0.5,
            sizex=1,
            sizey=1,
            sizing="contain",
            xanchor="center",
            yanchor="middle",
            opacity=0.5,
            layer="below"))

https://plotly.com/python/images/

  • xref='paper'yref='paper'使图像相对于纸张定位。如果xref='x'yref='y',则使用笛卡尔坐标轴定位图像。我没有找到相对于极坐标定位图像的可能性
  • x=0.5, y=0.5, xanchor='center', yanchor='middle'使图像居中
  • sizing="contain"保持图像大小不变。其他可能的值为“包含”和“拉伸”
  • source可以是URL字符串或PIL.Image实例

得出的数字

results

注释

  • 如果您需要调整CSS,使图像在任何情况下都与绘图大小相同&;屏幕大小等:图像将放置在<g class=layer-below>内的DOM中,这与极坐标图(<g class=polarlayer>)中的<g>-元素不同,它们有一个公共父<svg class=main-svg>,该父<div class=svg-container>

额外资源

相关问题 更多 >