输入变量的值后,使用Dash来自Plotly在仪表板上输出值

如何解决输入变量的值后,使用Dash来自Plotly在仪表板上输出值

我正在创建一个仪表板,该仪表板上有一系列变量(具体而言是12个),并且正在尝试针对房地产价格运行机器学习预测模型。在此示例中,我仅使用一些变量来基于线性回归模型输出预测。到目前为止,输入变量看起来不错,样式表正在运行...但是,python函数生成的输出仅将其打印在屏幕上的“ Generate Prediction”按钮下方。我添加了一些其他代码,以查看是否可以在dbc.Input()组件中打印该值而不会遇到麻烦,现在什么都没有输出到仪表板中。我希望能够控制此输出的样式和位置,但我不知道如何。我将在下面添加我的代码:

import dash
import dash_core_components as dcc
import dash_html_components as html
import dash_bootstrap_components as dbc
from dash.dependencies import Input,Output,State


app = dash.Dash(
    external_stylesheets=[dbc.themes.CYBORG]) #Use also SPACELAB / CYBORG
server = app.server

app.layout = html.Div([
    
    dbc.Row(dbc.Col(html.Br(),),dbc.Row(dbc.Col(html.H2('Price Predictor Tool'),width={'size': 12,'offset':1},dbc.Row(dbc.Col(html.Br(),dbc.Row([
        dbc.Col(html.P('Bedrooms'),width={'size': 1,dbc.Col(html.P('Bathrooms'),'offset':0},dbc.Col(html.P('Half Baths'),dbc.Col(html.P('Garage Spots'),dbc.Col(html.P('Year Built'),dbc.Col(html.P('Type of Floors'),width={'size': 2,dbc.Col(html.P('Waterfront Description'),],no_gutters=False
        ),dbc.Row([
        dbc.Col(dcc.Dropdown(
            id='input-bed',placeholder='Number',options=[ 
                {'label': '1','value': 1},{'label': '2','value': 2},{'label': '3','value': 3},{'label': '4','value': 4},{'label': '5','value': 5},{'label': '6','value': 6},{'label': '7','value': 7},{'label': '8','value': 8},{'label': '9','value': 9},{'label': '10','value': 10},{'label': '11','value': 11},{'label': '12','value': 12},{'label': '12+','value': 13}]),width={'size':1,'offset':1}
    ),dbc.Col(dcc.Dropdown(
            id='input-bath','offset':0}
    ),dbc.Col(dcc.Dropdown(
            id='input-hbath',options=[ 
                {'label': 'None','value': 0},{'label': '1 or more','value': 1}]),dbc.Col(dcc.Dropdown(
            id='input-garage',{'label': '1',{'label': '2 or more','value': 2}]),dbc.Col(dcc.Dropdown(
            id='input-built_year',placeholder='Year',options=[
                {'label': '2021','value': 2021},{'label': '2020','value': 2020},{'label': '2019','value': 2019},{'label': '2018','value': 2018},{'label': '2017','value': 2017},{'label': '2016','value': 2016},{'label': '2015','value': 2015},{'label': '2014','value': 2014},{'label': '2013','value': 2013},{'label': '2012','value': 2012},{'label': '2011','value': 2011},{'label': '2010','value': 2010},{'label': '2009','value': 2009},{'label': '2008','value': 2008},{'label': '2007','value': 2007},{'label': '2006','value': 2006},{'label': '2005','value': 2005},{'label': '2004','value': 2004},{'label': '2003','value': 2003},{'label': '2002','value': 2002},{'label': '2001','value': 2001},{'label': '2000','value': 2000},{'label': '1999','value': 1999},{'label': '1998','value': 1998},{'label': '1997','value': 1997},{'label': '1996','value': 1996},{'label': '1995','value': 1995},{'label': '1994','value': 1994},{'label': '1993','value': 1993},{'label': '1992','value': 1992},{'label': '1991','value': 1991},{'label': '1990','value': 1990},{'label': '1989','value': 1989},{'label': '1988','value': 1988},{'label': '1987','value': 1987},{'label': '1986','value': 1986},{'label': '1985','value': 1985},{'label': '1984','value': 1984},{'label': '1983','value': 1983},{'label': '1982','value': 1982},{'label': '1981','value': 1981},{'label': '1980','value': 1980},{'label': '1979','value': 1979},{'label': '1978','value': 1978},{'label': '1977','value': 1977},{'label': '1976','value': 1976},{'label': '1975','value': 1975},{'label': '1974','value': 1974},{'label': '1973','value': 1973},{'label': '1972','value': 1972},{'label': '1971','value': 1971},{'label': '1970','value': 1970},{'label': '1969','value': 1969},{'label': '1968','value': 1968},{'label': '1967','value': 1967},{'label': '1966','value': 1966},{'label': '1965','value': 1965},{'label': '1964','value': 1964},{'label': '1963','value': 1963},{'label': '1962','value': 1962},{'label': '1961','value': 1961},{'label': '1960','value': 1960},{'label': '1959','value': 1959},{'label': '1958','value': 1958},{'label': '1957','value': 1957},{'label': '1956','value': 1956},{'label': '1955','value': 1955},{'label': '1954','value': 1954},{'label': '1953','value': 1953},{'label': '1952','value': 1952},{'label': '1951','value': 1951},{'label': '1950','value': 1950},{'label': '1949','value': 1949},{'label': '1948','value': 1948},{'label': '1947','value': 1947},{'label': '1946','value': 1946},{'label': '1945','value': 1945},{'label': '1944','value': 1944},{'label': '1943','value': 1943},{'label': '1942','value': 1942},{'label': '1941','value': 1941},{'label': '1940','value': 1940},{'label': '1939','value': 1939},{'label': '1938','value': 1938},{'label': '1937','value': 1937},{'label': '1936','value': 1936},{'label': '1935','value': 1935},{'label': '1934','value': 1934},{'label': '1933','value': 1933},{'label': '1932','value': 1932},{'label': '1931','value': 1931},{'label': '1930','value': 1930},{'label': '1929','value': 1929},{'label': '1928','value': 1928},{'label': '1927','value': 1927},{'label': '1926','value': 1926},{'label': '1925','value': 1925},{'label': '1924','value': 1924},{'label': '1923','value': 1923},{'label': '1922','value': 1922},{'label': '1921','value': 1921},{'label': '1920','value': 1920},{'label': '1919','value': 1919},{'label': '1918','value': 1918},{'label': '1917','value': 1917},{'label': '1916','value': 1916},{'label': '1915','value': 1915},{'label': '1914','value': 1914},{'label': '1913','value': 1913},{'label': '1912','value': 1912},{'label': '1911','value': 1911},{'label': '1910','value': 1910},{'label': '1909','value': 1909},{'label': '1908','value': 1908},{'label': '1907','value': 1907},{'label': '1906','value': 1906},{'label': '1905','value': 1905},{'label': '1904','value': 1904},{'label': '1903','value': 1903},{'label': '1902','value': 1902},{'label': '1901','value': 1901},{'label': '1900','value': 1900}]),dbc.Col(dcc.Dropdown(
            id='input-floor',placeholder='Select all that apply',options=[
                {'label': 'Marble','value': 'Marble'},{'label': 'Vinyl','value': 'Vinyl'},{'label': 'Ceramic','value': 'Ceramic'},{'label': 'Carpeted','value': 'Carpeted'},{'label': 'Tile','value': 'Tile'},{'label': 'Other','value': 'Other'}],value=[],multi=True),width={'size':2,dbc.Col(dcc.Dropdown(
            id='input-waterfront',options=[ 
                {'label': 'Ocean Front','value': 'Ocean Front'},{'label': 'Intracoastal Front','value': 'Intracoastal Front'},{'label': 'No Fixed Bridges','value': 'No Fixed Bridges'},{'label': 'Bay Front','value': 'Bay Front'},{'label': 'Fixed Bridges(s)','value': 'Fixed Bridges(s)'},{'label': 'Canal Front ','value': 'Canal Front '}],'offset':0,}
    ),html.Br(),dbc.Row([
         dbc.Col(html.P('Living Area (Sq Ft)'),dbc.Col(html.P('Lot Area (Sq Ft)'),dbc.Col(html.P('Zip Code'),dbc.Col(html.P('Listing Starting Date'),dbc.Col(html.P('Projected Days on the Market'),dbc.Row([
        dbc.Col(
            dbc.Input(id='input-living_area',type='number',placeholder='From 400 to 15000',min=400,max=15000,step=1,className='mb-3'),dbc.Col(
            dbc.Input(id='input-lot_area',placeholder='From 400+',dbc.Col(dcc.Dropdown(
            id='input-zip_code',placeholder='33131',options=[ 
                {'label': '33498','value': 33498},{'label': '33496','value': 33496},{'label': '33493','value': 33493},{'label': '33487','value': 33487},{'label': '33486','value': 33486},{'label': '33484','value': 33484},{'label': '33483','value': 33483},{'label': '33480','value': 33480},{'label': '33478','value': 33478},{'label': '33477','value': 33477},{'label': '33476','value': 33476},{'label': '33473','value': 33473},{'label': '33472','value': 33472},{'label': '33470','value': 33470},{'label': '33469','value': 33469},{'label': '33467','value': 33467},{'label': '33463','value': 33463},{'label': '33462','value': 33462},{'label': '33461','value': 33461},{'label': '33460','value': 33460},{'label': '33458','value': 33458},{'label': '33449','value': 33449},{'label': '33446','value': 33446},{'label': '33445','value': 33445},{'label': '33444','value': 33444},{'label': '33442','value': 33442},{'label': '33441','value': 33441},{'label': '33438','value': 33438},{'label': '33437','value': 33437},{'label': '33436','value': 33436},{'label': '33435','value': 33435},{'label': '33434','value': 33434},{'label': '33433','value': 33433},{'label': '33432','value': 33432},{'label': '33431','value': 33431},{'label': '33430','value': 33430},{'label': '33428','value': 33428},{'label': '33426','value': 33426},{'label': '33418','value': 33418},{'label': '33417','value': 33417},{'label': '33415','value': 33415},{'label': '33414','value': 33414},{'label': '33413','value': 33413},{'label': '33412','value': 33412},{'label': '33411','value': 33411},{'label': '33410','value': 33410},{'label': '33409','value': 33409},{'label': '33408','value': 33408},{'label': '33407','value': 33407},{'label': '33406','value': 33406},{'label': '33405','value': 33405},{'label': '33404','value': 33404},{'label': '33403','value': 33403},{'label': '33401','value': 33401},{'label': '33351','value': 33351},{'label': '33334','value': 33334},{'label': '33332','value': 33332},{'label': '33331','value': 33331},{'label': '33330','value': 33330},{'label': '33328','value': 33328},{'label': '33327','value': 33327},{'label': '33326','value': 33326},{'label': '33325','value': 33325},{'label': '33324','value': 33324},{'label': '33323','value': 33323},{'label': '33322','value': 33322},{'label': '33321','value': 33321},{'label': '33319','value': 33319},{'label': '33317','value': 33317},{'label': '33316','value': 33316},{'label': '33315','value': 33315},{'label': '33314','value': 33314},{'label': '33313','value': 33313},{'label': '33312','value': 33312},{'label': '33311','value': 33311},{'label': '33309','value': 33309},{'label': '33308','value': 33308},{'label': '33306','value': 33306},{'label': '33305','value': 33305},{'label': '33304','value': 33304},{'label': '33301','value': 33301},{'label': '33196','value': 33196},{'label': '33194','value': 33194},{'label': '33193','value': 33193},{'label': '33190','value': 33190},{'label': '33189','value': 33189},{'label': '33187','value': 33187},{'label': '33186','value': 33186},{'label': '33185','value': 33185},{'label': '33184','value': 33184},{'label': '33183','value': 33183},{'label': '33182','value': 33182},{'label': '33181','value': 33181},{'label': '33180','value': 33180},{'label': '33179','value': 33179},{'label': '33178','value': 33178},{'label': '33177','value': 33177},{'label': '33176','value': 33176},{'label': '33175','value': 33175},{'label': '33174','value': 33174},{'label': '33173','value': 33173},{'label': '33172','value': 33172},{'label': '33170','value': 33170},{'label': '33169','value': 33169},{'label': '33168','value': 33168},{'label': '33167','value': 33167},{'label': '33166','value': 33166},{'label': '33165','value': 33165},{'label': '33162','value': 33162},{'label': '33161','value': 33161},{'label': '33160','value': 33160},{'label': '33158','value': 33158},{'label': '33157','value': 33157},{'label': '33156','value': 33156},{'label': '33155','value': 33155},{'label': '33154','value': 33154},{'label': '33150','value': 33150},{'label': '33149','value': 33149},{'label': '33147','value': 33147},{'label': '33146','value': 33146},{'label': '33145','value': 33145},{'label': '33144','value': 33144},{'label': '33143','value': 33143},{'label': '33142','value': 33142},{'label': '33141','value': 33141},{'label': '33140','value': 33140},{'label': '33139','value': 33139},{'label': '33138','value': 33138},{'label': '33137','value': 33137},{'label': '33136','value': 33136},{'label': '33135','value': 33135},{'label': '33134','value': 33134},{'label': '33133','value': 33133},{'label': '33132','value': 33132},{'label': '33131','value': 33131},{'label': '33130','value': 33130},{'label': '33129','value': 33129},{'label': '33128','value': 33128},{'label': '33127','value': 33127},{'label': '33126','value': 33126},{'label': '33125','value': 33125},{'label': '33122','value': 33122},{'label': '33109','value': 33109},{'label': '33101','value': 33101},{'label': '33076','value': 33076},{'label': '33073','value': 33073},{'label': '33071','value': 33071},{'label': '33069','value': 33069},{'label': '33068','value': 33068},{'label': '33067','value': 33067},{'label': '33066','value': 33066},{'label': '33065','value': 33065},{'label': '33064','value': 33064},{'label': '33063','value': 33063},{'label': '33062','value': 33062},{'label': '33060','value': 33060},{'label': '33056','value': 33056},{'label': '33055','value': 33055},{'label': '33054','value': 33054},{'label': '33039','value': 33039},{'label': '33035','value': 33035},{'label': '33034','value': 33034},{'label': '33033','value': 33033},{'label': '33032','value': 33032},{'label': '33031','value': 33031},{'label': '33030','value': 33030},{'label': '33029','value': 33029},{'label': '33028','value': 33028},{'label': '33027','value': 33027},{'label': '33026','value': 33026},{'label': '33025','value': 33025},{'label': '33024','value': 33024},{'label': '33023','value': 33023},{'label': '33021','value': 33021},{'label': '33020','value': 33020},{'label': '33019','value': 33019},{'label': '33018','value': 33018},{'label': '33016','value': 33016},{'label': '33015','value': 33015},{'label': '33014','value': 33014},{'label': '33013','value': 33013},{'label': '33012','value': 33012},{'label': '33010','value': 33010},{'label': '33009','value': 33009},{'label': '33004','value': 33004}]),dbc.Col(dcc.Dropdown(
            id='input-selling_month',placeholder='Select Month',options=[ 
                {'label': 'January',{'label': 'February',{'label': 'March',{'label': 'April',{'label': 'May',{'label': 'June',{'label': 'July',{'label': 'August',{'label': 'September',{'label': 'October',{'label': 'November',{'label': 'December','value': 12}]),dbc.Col(dcc.Dropdown(
            id='input-dom',placeholder='Select between 30,60 and 90',options=[ 
                {'label': '30','value': 30},{'label': '60','value': 60},{'label': '90','value': 90}]),dbc.Row([
        dbc.Col(
                [
        dbc.Button('Generate Prediction',id='input-predi_button',n_clicks=0,color='primary',className="mr-2"),html.Span(id="input-prediction",style={"vertical-align": "middle"}),width={'size':6,no_gutters=True
        ),html.Div(dbc.FormGroup(dbc.FormGroup(
    [
        dbc.Label("Property's Price Prediction",html_for="text-prediction",'offset':1}),dbc.Col(
            dbc.Input(
                id='result',placeholder=""
            ),row=True,)))
    ])

@app.callback(
    Output('result','children'),[Input('input-predi_button','n_clicks')],[State('input-bed','value'),State('input-bath',State('input-hbath',State('input-garage',State('input-built_year',State('input-floor',State('input-waterfront',State('input-living_area',State('input-lot_area',State('input-zip_code',State('input-selling_month',State('input-dom','value')]
)
def update_result(n_clicks,bed,bath,hbath,garage,built_year,floor,waterfront,living_area,lot_area,zip_code,selling_month,dom):
    if int(n_clicks) > 0:
        prediction =(-39422.64)+(bed*(-261049.88))+(bath*227856.66)+\
            (hbath*15413.56)+(garage*17875.03)+(dom*274.12)+\
                (living_area*693.40)+(built_year*350.07)+(zip_code*(-34.75))    
    
        return prediction


if __name__ == '__main__':
    app.run_server()

解决方法

您的回调将其输出设置为dbc.Input组件,该组件没有属性children。您需要将其更改为Output('result','value')或使用其他组件来显示输出。

或者,您可以将dbc.Input(id='result',placeholder="")更改为html.Div(id='result'),然后可以保持回调函数不变。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


依赖报错 idea导入项目后依赖报错,解决方案:https://blog.csdn.net/weixin_42420249/article/details/81191861 依赖版本报错:更换其他版本 无法下载依赖可参考:https://blog.csdn.net/weixin_42628809/a
错误1:代码生成器依赖和mybatis依赖冲突 启动项目时报错如下 2021-12-03 13:33:33.927 ERROR 7228 [ main] o.s.b.d.LoggingFailureAnalysisReporter : *************************** APPL
错误1:gradle项目控制台输出为乱码 # 解决方案:https://blog.csdn.net/weixin_43501566/article/details/112482302 # 在gradle-wrapper.properties 添加以下内容 org.gradle.jvmargs=-Df
错误还原:在查询的过程中,传入的workType为0时,该条件不起作用 <select id="xxx"> SELECT di.id, di.name, di.work_type, di.updated... <where> <if test=&qu
报错如下,gcc版本太低 ^ server.c:5346:31: 错误:‘struct redisServer’没有名为‘server_cpulist’的成员 redisSetCpuAffinity(server.server_cpulist); ^ server.c: 在函数‘hasActiveC
解决方案1 1、改项目中.idea/workspace.xml配置文件,增加dynamic.classpath参数 2、搜索PropertiesComponent,添加如下 <property name="dynamic.classpath" value="tru
删除根组件app.vue中的默认代码后报错:Module Error (from ./node_modules/eslint-loader/index.js): 解决方案:关闭ESlint代码检测,在项目根目录创建vue.config.js,在文件中添加 module.exports = { lin
查看spark默认的python版本 [root@master day27]# pyspark /home/software/spark-2.3.4-bin-hadoop2.7/conf/spark-env.sh: line 2: /usr/local/hadoop/bin/hadoop: No s
使用本地python环境可以成功执行 import pandas as pd import matplotlib.pyplot as plt # 设置字体 plt.rcParams['font.sans-serif'] = ['SimHei'] # 能正确显示负号 p
错误1:Request method ‘DELETE‘ not supported 错误还原:controller层有一个接口,访问该接口时报错:Request method ‘DELETE‘ not supported 错误原因:没有接收到前端传入的参数,修改为如下 参考 错误2:cannot r
错误1:启动docker镜像时报错:Error response from daemon: driver failed programming external connectivity on endpoint quirky_allen 解决方法:重启docker -> systemctl r
错误1:private field ‘xxx‘ is never assigned 按Altʾnter快捷键,选择第2项 参考:https://blog.csdn.net/shi_hong_fei_hei/article/details/88814070 错误2:启动时报错,不能找到主启动类 #
报错如下,通过源不能下载,最后警告pip需升级版本 Requirement already satisfied: pip in c:\users\ychen\appdata\local\programs\python\python310\lib\site-packages (22.0.4) Coll
错误1:maven打包报错 错误还原:使用maven打包项目时报错如下 [ERROR] Failed to execute goal org.apache.maven.plugins:maven-resources-plugin:3.2.0:resources (default-resources)
错误1:服务调用时报错 服务消费者模块assess通过openFeign调用服务提供者模块hires 如下为服务提供者模块hires的控制层接口 @RestController @RequestMapping("/hires") public class FeignControl
错误1:运行项目后报如下错误 解决方案 报错2:Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:3.8.1:compile (default-compile) on project sb 解决方案:在pom.
参考 错误原因 过滤器或拦截器在生效时,redisTemplate还没有注入 解决方案:在注入容器时就生效 @Component //项目运行时就注入Spring容器 public class RedisBean { @Resource private RedisTemplate<String
使用vite构建项目报错 C:\Users\ychen\work>npm init @vitejs/app @vitejs/create-app is deprecated, use npm init vite instead C:\Users\ychen\AppData\Local\npm-