在 pyecharts 中,背景图片的使用稍微复杂一些,需要借助 js_code 参数来实现。以下是一个示例代码,展示如何在雷达图中使用背景图片:
from pyecharts import options as opts
from pyecharts.charts import Radar
radar = (
Radar()
.add_schema(
schema=[
opts.RadarIndicatorItem(name="销售", max_=6500),
opts.RadarIndicatorItem(name="管理", max_=16000),
opts.RadarIndicatorItem(name="技术", max_=30000),
opts.RadarIndicatorItem(name="客服", max_=38000),
opts.RadarIndicatorItem(name="研发", max_=52000),
opts.RadarIndicatorItem(name="市场", max_=25000)
]
)
.add("预算分配", [4300, 10000, 28000, 35000, 50000, 19000])
.set_global_opts(
title_opts=opts.TitleOpts(title="公司部门预算"),
init_opts=opts.InitOpts(
js_code="""
function(params) {
var img = new Image();
img.src = 'background.jpg'; // 设置背景图片路径
var canvas = document.createElement('canvas');
var ctx = canvas.getContext('2d');
img.onload = function() {
canvas.width = params.dom.clientWidth;
canvas.height = params.dom.clientHeight;
ctx.drawImage(img, 0, 0);
var dataURL = canvas.toDataURL('image/png');
params.zr.painter.setBackgroundImage(dataURL);
params.zr.refresh();
};
}
"""
)
)
)
radar.render("radar_chart.html")
在这个示例中,我们使用了 js_code 参数来自定义 JavaScript 代码。其中的代码片段会创建一个新的图片对象,并加载指定路径下的图片文件(此处假设背景图片为 “background.jpg”)。然后,通过 canvas 绘图功能将该图片绘制到雷达图区域的背景上。
请注意,你需要根据实际情况修改代码中的背景图片路径。另外,生成的 “radar_chart.html” 文件与背景图片应位于同一目录下才能正常显示。
内容由零声教学AI助手提供,问题来源于学员提问




