Dash.jl

اندفاعة لجوليا

إنشاء تطبيقات تحليلية جميلة في جوليا

بنيت على قمة plotly.js ، react و http.jl ، يرتبط اندفاعة عناصر واجهة المستخدم الحديثة مثل المنسدلة ، المتزلج ، والرسوم البيانية مباشرة إلى رمز جوليا التحليلي.

فقط بدأت؟ تحقق من Dash for Julia Guide! إذا لم تتمكن من العثور على توثيق هناك ، فتحقق من الأمثلة غير الرسمية التي ساهمت بها أو تحقق من رمز المصدر من التطبيقات التجريبية في Python ثم الرجوع إلى نمط بناء جملة Julia.

موارد أخرى

• https://community.plotly.com/c/plotly-r-matlab-julia-net/julia/23
• https://discourse.julialang.org/tag/dash

حالة المشروع

يمكن إنشاء مكونات جوليا جنبا إلى جنب مع مكونات Python و R. هل أنت مهتم بالمشاركة في المشروع؟ الرعاية هي وسيلة رائعة لتسريع تقدم المشاريع المفتوحة المصدر مثل هذا ؛ لا تتردد في التواصل معنا!

تثبيت

لتثبيت أحدث إصدار تم إصداره:

pkg > add Dash

لتثبيت أحدث إصدار من التطوير (مستقر) بدلاً من ذلك:

pkg > add Dash # dev 

الاستخدام

التطبيق الأساسي

 using Dash

app = dash (external_stylesheets = [ " https://codepen.io/chriddyp/pen/bWLwgP.css " ])

app . layout = html_div () do
    html_h1 ( " Hello Dash " ),
    html_div ( " Dash.jl: Julia interface for Dash " ),
    dcc_graph (id = " example-graph " ,
              figure = (
                  data = [
                      (x = [ 1 , 2 , 3 ], y = [ 4 , 1 , 2 ], type = " bar " , name = " SF " ),
                      (x = [ 1 , 2 , 3 ], y = [ 2 , 4 , 5 ], type = " bar " , name = " Montréal " ),
                  ],
                  layout = (title = " Dash Data Visualization " ,)
              ))
end

run_server (app)

ثم انتقل إلى http://127.0.0.1:8050 في متصفحك لعرض تطبيق DASH!

رد الاتصال الأساسي

 using Dash

app = dash (external_stylesheets = [ " https://codepen.io/chriddyp/pen/bWLwgP.css " ])

app . layout = html_div () do
    dcc_input (id = " my-id " , value = " initial value " , type = " text " ),
    html_div (id = " my-div " )
end

callback! (app, Output ( " my-div " , " children " ), Input ( " my-id " , " value " )) do input_value
    " You've entered $(input_value) "
end

run_server (app)

• يمكنك جعل تطبيق DASH تفاعليًا عن طريق تسجيل عمليات الاسترداد مع callback! وظيفة.
• يمكن أن تكون المخرجات والمدخلات (والحالات ، انظر أدناه) Output أو Input أو الكائنات State أو المتجهات / المتجهات من هذه الكائنات.
• يجب أن تحتوي وظائف رد الاتصال على التوقيع (inputs..., states...) ، وتوفير قيمة إرجاع مع نفس عناصر الأرقام مثل عدد Output S لتحديثها.

الدول والمخرجات المتعددة

 using Dash

app = dash (external_stylesheets = [ " https://codepen.io/chriddyp/pen/bWLwgP.css " ])

app . layout = html_div () do
    dcc_input (id = " my-id " , value = " initial value " , type = " text " ),
    html_div (id = " my-div " ),
    html_div (id = " my-div2 " )
end

callback! (app,
          Output ( " my-div " , " children " ),
          Output ( " my-div2 " , " children " ),
          Input ( " my-id " , " value " ),
          State ( " my-id " , " type " )) do input_value, state_value
    return ( " You've entered $(input_value) in input with type $(state_value) " ,
            " You've entered $(input_value) " )
end

run_server (app)

مقارنة مع بناء جملة Python الأصلي

تسمية المكون

• بيثون:

 import dash

dash . html . Div
dash . dcc . Graph
dash . dash_table . DataTable

• dash.jl:

 using Dash

html_div
dcc_graph
dash_datatable

خلق المكون

كما هو الحال في Python ، فإن وظائف إعلان المكونات لها وسيطات كلمات رئيسية ، والتي هي نفسها كما في Python. html_div(id = "my-id", children = "Simple text") .

بالنسبة للمكونات التي تعلن عن children ، تتوفر توقيعات إضافية:

• (children; kwargs..) و
• (children_maker::Function; kwargs...)

لذلك يمكن للمرء أن يكتب html_div("Simple text", id = "my-id") للعناصر البسيطة ، أو اختيار بناء جملة مختصرة مع بناء جملة do للعناصر المعقدة:

 html_div (id = " outer-div " ) do
    html_h1 ( " Welcome " ),
    html_div (id = " inner-div " ) do
        #= inner content =#
    end
end

التطبيق والتخطيط

• بيثون:

 app = dash . Dash ( external_stylesheets = [ "https://codepen.io/chriddyp/pen/bWLwgP.css" ])

app . layout = html . Div ( children = [....])

• dash.jl:

app = dash (external_stylesheets = [ " https://codepen.io/chriddyp/pen/bWLwgP.css " ])

app . layout = html_div () do
    #= inner content =#
end

عمليات الاسترجاعات

• بيثون:

 @ app . callback ( Output ( 'output' , 'children' ),
              Input ( 'submit-button' , 'n_clicks' )],
              State ( 'state-1' , 'value' ),
              State ( 'state-2' , 'value' ))
def update_output ( n_clicks , state1 , state2 ):
    # logic

• dash.jl:

 callback! (app,
          Output ( " output " , " children " ),
          Input ( " submit-button " , " n_clicks " )],
          State ( " state-1 " , " value " ),
          State ( " state-2 " , " value " )) do n_clicks, state1, state2
    # logic
end

جيسون

تنقل تطبيقات DASH البيانات بين المتصفح (المعروف أيضًا باسم الواجهة الأمامية) وعملية جوليا التي تعمل على تشغيل التطبيق (المعروف أيضًا باسم الواجهة الخلفية) في JSON. يستخدم Dash.JL JSON3.JL للتسلسل JSON/Deserialization.

لاحظ أن JSON3.JL يتحول

• Vector S و Tuple S إلى صفائف JSON
• Dict S و NamedTuple S إلى كائنات JSON