pychart画图Geo_lines,呈现的图形中线条无法显示tooltips,怎么解决呢?
我想要的结果是:鼠标放在涟漪点上显示“地市名称:200”; 鼠标放在线上显示 “呼和浩特市—>呼伦贝尔市”
代码如下
city = ["阿拉善盟", "巴彦淖尔市", "包头市", "赤峰市", "鄂尔多斯市", "呼和浩特市", "呼伦贝尔市", "通辽市", "乌海市",
"乌兰察布市", "锡林郭勒盟", "兴安盟"]
values1 = [20, 40, 100, 200, 120, 300, 130, 210, 30, 108, 110, 160]
toolbox_opts = opts.global_options.ToolBoxFeatureOpts(
save_as_image={"show": True, "title": "save as image", "type": "png"})
geo = (
Geo()
.add_schema(maptype="内蒙古", itemstyle_opts=opts.ItemStyleOpts(color="#323c48"),
)
.add("数据量", list(zip(city, values1)), type_=ChartType.EFFECT_SCATTER, color="white")
.add(
"",
[("呼和浩特市", "呼伦贝尔市"), ("呼和浩特市", "阿拉善盟"), ("呼和浩特市", "通辽市")],
type_=ChartType.LINES,
effect_opts=opts.EffectOpts(
symbol=SymbolType.ARROW, symbol_size=5, color="pink"
),
linestyle_opts=opts.LineStyleOpts(curve=0.2), # 设置连线的弧度
)
.set_global_opts(title_opts=opts.TitleOpts(title="内蒙古")
)
.set_series_opts(label_opts=opts.LabelOpts(is_show=False)) # 标签是坐标值类似23.46
)
运行结果如下:鼠标放在涟漪点上可以正确显示,鼠标放在线条上就没反应,在网页右键-检查,发现有错误
Uncaught TypeError: Cannot read property '2' of undefined
具体错误位置:
"formatter": function (params) { return params.name + ' : ' + params.value[2]; },
该回答通过自己思路及引用到GPTᴼᴾᴱᴺᴬᴵ搜索,得到内容具体如下:
您可以在add()
方法中设置tooltip_opts
参数来为线条添加提示框。例如,您可以将add()
方法中的代码修改为:
.add(
"",
[("呼和浩特市", "呼伦贝尔市"), ("呼和浩特市", "阿拉善盟"), ("呼和浩特市", "通辽市")],
type_=ChartType.LINES,
effect_opts=opts.EffectOpts(
symbol=SymbolType.ARROW, symbol_size=5, color="pink"
),
linestyle_opts=opts.LineStyleOpts(curve=0.2), # 设置连线的弧度
tooltip_opts=opts.TooltipOpts(
formatter=lambda params: params.name + " -> " + params.value[1]
), # 设置提示框
)
在这个例子中,我们在add()
方法中添加了tooltip_opts
参数,设置了一个lambda函数作为提示框的格式化函数。这个函数将显示“呼和浩特市 -> 呼伦贝尔市”等形式的文本,以显示线条的起点和终点。
提示框的格式化函数可以根据您的需要进行自定义,例如,您可以添加更多的信息,如线条的长度、颜色等等。
------【修改后的完整代码】--------
下面是修改后的完整代码:
from pyecharts import options as opts
from pyecharts.charts import Geo
from pyecharts.globals import ChartType, SymbolType
city = [
"阿拉善盟",
"巴彦淖尔市",
"包头市",
"赤峰市",
"鄂尔多斯市",
"呼和浩特市",
"呼伦贝尔市",
"通辽市",
"乌海市",
"乌兰察布市",
"锡林郭勒盟",
"兴安盟",
]
values1 = [20, 40, 100, 200, 120, 300, 130, 210, 30, 108, 110, 160]
toolbox_opts = opts.global_options.ToolBoxFeatureOpts(
save_as_image={"show": True, "title": "save as image", "type": "png"}
)
geo = (
Geo()
.add_schema(
maptype="内蒙古",
itemstyle_opts=opts.ItemStyleOpts(color="#323c48"),
)
.add(
"数据量",
list(zip(city, values1)),
type_=ChartType.EFFECT_SCATTER,
color="white",
tooltip_opts=opts.TooltipOpts(
formatter=lambda params: params.name + " : " + str(params.value[1])
), # 设置提示框
)
.add(
"",
[("呼和浩特市", "呼伦贝尔市"), ("呼和浩特市", "阿拉善盟"), ("呼和浩特市", "通辽市")],
type_=ChartType.LINES,
effect_opts=opts.EffectOpts(
symbol=SymbolType.ARROW, symbol_size=5, color="pink"
),
linestyle_opts=opts.LineStyleOpts(curve=0.2), # 设置连线的弧度
tooltip_opts=opts.TooltipOpts(
formatter=lambda params: params.name + " -> " + params.value[1]
), # 设置提示框
)
.set_global_opts(
title_opts=opts.TitleOpts(title="内蒙古"), toolbox_opts=toolbox_opts
)
.set_series_opts(label_opts=opts.LabelOpts(is_show=False)) # 标签是坐标值类似23.46
)
geo.render("geo_lines.html")
在这个修改后的代码中,我们在第二个add()
方法中添加了一个tooltip_opts
参数,设置了一个lambda函数作为线条提示框的格式化函数。同样,我们在第一个add()
方法中也添加了一个tooltip_opts
参数,以显示涟漪点的提示框。
您可以根据需要修改这些lambda函数,以显示您想要的信息。
如果以上回答对您有所帮助,点击一下采纳该答案~谢谢