Taipy布局注释文本在回调触发时未更新自身。

huangapple go评论52阅读模式
英文:

Taipy layout annotation text not updating itself when callback is triggered

问题

我正在尝试创建一个类似于这个(https://plotly.com/python/network-graphs/)的网络图。

一切都正常工作,直到我尝试在网络图中的链接旁边添加一些注释文本。

问题在于,当触发 on_change 函数时,注释文本不会自动更新自身。它只在刷新网页时更新。

我已经尝试在回调触发时打印文本的状态。我确实看到回调中的布局文本值已更新,只是在可视化中没有更新(除非刷新网页)。

英文:

I am trying to create a network graph like this (https://plotly.com/python/network-graphs/).

It all worked fine until I try to add some annotation texts next to the links in the network graph.

The issue is that the annotation text is not automatically updating itself when on_change function is triggered. It only gets updated when the webpage is refreshed.

I have tried to print the text in the state when the callback is triggered. I do see the layout text values are updated in the callback, it just doesn't update in the visuals (unless the web is refreshed).

答案1

得分: 1

我们在图表上有一个名为rebuild的属性,用于在更改其配置时刷新图表。然而,注释仍然需要考虑此属性。

您现在可以使用局部部分来实现具有正确注释的图形。

下面的代码来自注释文档,其中包含实现注释更改的内容:

  • 图表放在名为p的局部部分中;
  • 页面上的按钮调用change_annotation(state)以更新注释;
  • 此函数使用新的注释更改layout并在最后更新局部部分。
from taipy.gui import Gui

def f(x):
    return x*x*x/3-x

x = [(x-10)/4.5 for x in range(0, 21)]

data = {
    "x": x,
    "y": [f(x) for x in x]
}

layout = {
    # 图表标题
    "title": "局部极值点",
    "annotations": [
        # 局部最大值的注释 (x = -1)
        {
            "text": "局部 <b>最大值</b>",
            "font": {
                "size": 20
            },
            "x": -1,
            "y": f(-1)
        },
        # 局部最小值的注释 (x = 1)
        {
            "text": "局部 <b>最小值</b>",
            "font": {
                "size": 20
            },
            "x": 1,
            "y": f(1),
            "xanchor": "left"
        }
    ]
}

def change_annotation(state):
    layout["annotations"][0]["text"] = "一般 <b>最大值</b>"
    layout["annotations"][1]["text"] = "一般 <b>最小值</b>"
    state.layout = layout
    state.p.update_content(state, md_for_chart)

md_for_chart = "|{data}|chart|x=x|y=y|layout={layout}|"

md = """
<|part|partial={p}|

<|change annotation|button|on_action=change_annotation|
"""

gui = Gui(md)
p = gui.add_partial(md_for_chart)
gui.run()
英文:

We have a rebuild property on charts to refresh the chart when its configuration is changed. However, annotations still need to be concerned by this property.

You can now use a partial to actualize your graph with the correct annotations.

The code below comes from the documentation on annotations with the changes to actualize annotations.

  • The chart is put in a partial called p;
  • A button on the page calls change_annotation(state) to update the annotations;
  • This function changes the layout with the new annotations and updates the partial at the end.
from taipy.gui import Gui


def f(x):
    return x*x*x/3-x

x = [(x-10)/4.5 for x in range(0, 21)]

data = {
    &quot;x&quot;: x,
    &quot;y&quot;: [f(x) for x in x]
}

layout = {
    # Chart title
    &quot;title&quot;: &quot;Local extrema&quot;,
    &quot;annotations&quot;: [
        # Annotation for local maximum (x = -1)
        {
            &quot;text&quot;: &quot;Local &lt;b&gt;max&lt;/b&gt;&quot;,
            &quot;font&quot;: {
                &quot;size&quot;: 20
            },
            &quot;x&quot;: -1,
            &quot;y&quot;: f(-1)
        },
        # Annotation for local minimum (x = 1)
        {
            &quot;text&quot;: &quot;Local &lt;b&gt;min&lt;/b&gt;&quot;,
            &quot;font&quot;: {
                &quot;size&quot;: 20
            },
            &quot;x&quot;: 1,
            &quot;y&quot;: f(1),
            &quot;xanchor&quot;: &quot;left&quot;
        }
    ]
}

def change_annotation(state):
    layout[&quot;annotations&quot;][0][&quot;text&quot;] = &quot;General &lt;b&gt;max&lt;/b&gt;&quot;
    layout[&quot;annotations&quot;][1][&quot;text&quot;] = &quot;General &lt;b&gt;min&lt;/b&gt;&quot;
    state.layout = layout
    state.p.update_content(state, md_for_chart)


md_for_chart = &quot;&lt;|{data}|chart|x=x|y=y|layout={layout}|&gt;&quot;

md = &quot;&quot;&quot;
&lt;|part|partial={p}|&gt;

&lt;|change annotation|button|on_action=change_annotation|&gt;
&quot;&quot;&quot;

gui = Gui(md)
p = gui.add_partial(md_for_chart)
gui.run()

huangapple
  • 本文由 发表于 2023年5月24日 18:58:12
  • 转载请务必保留本文链接:https://go.coder-hub.com/76322788.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定