Dash实时散点图图例筛选后数据点不显示问题咨询

故障原因 #

你遇到的图例筛选后点不显示、但悬停可查看详情的问题，是dcc.Graph配置了animate=True导致的：
每3秒回调会全量返回新的绘图对象，开启的动画渲染逻辑会出现样式同步bug，数据实际存在但散点的可见样式没有正确刷新，因此视觉上看不到点。

修复方法 #

最简单的修复方式是直接删除dcc.Graph中的animate=True配置，修改后的dcc.Graph部分代码如下：

dcc.Graph(
    id='grph'
),

修改后重启服务即可解决当前的渲染异常问题。

可选优化（建议调整） #

你当前的代码每3秒会执行两次MySQL查询分别更新记录数和图表，存在不必要的资源浪费，可以合并为一个Interval和一个回调，优化后完整代码如下：

import dash
from dash import dcc, Input, Output
from dash import html
import plotly.express as px
import pandas as pd
import sqlalchemy

app = dash.Dash(__name__)

connection = sqlalchemy.create_engine('mysql+pymysql://*:*@localhost:*')

app.layout = html.Div(children=[
    html.H1(id='Numberofrecords'),
    dcc.Interval(id='update-trigger', interval=3000, n_intervals=0),
    html.Div(children='''
        Dash: A web application framework for Python.
    '''),
    dcc.Graph(id='grph')
])

@app.callback(
    [Output('Numberofrecords', 'children'),
     Output('grph', 'figure')],
    Input('update-trigger', 'n_intervals')
)
def update_all(n):
    df = pd.read_sql_table('rawdata_clean', connection)
    fig = px.scatter(df, x="Size", y="Price", color="Neighbourhood_Per")
    return len(df.index), fig

if __name__ == '__main__':
    app.run_server(debug=True, port=9876)

内容的提问来源于stack exchange，提问作者Alii