Dash.jl

Дэш для Джулии

Создать красивые, аналитические приложения в Юлии

Построенный на вершине plotly.js, React и http.jl, Dash связывает современные элементы пользовательского интерфейса, такие как выпадающие, ползунки и графики непосредственно с вашим аналитическим кодом Юлии.

Только что начало? Проверьте Dash для руководства пользователя Julia! Если вы не можете найти там документацию, ознакомьтесь с неофициальными примерами или проверьте исходный код из демонстрационных приложений в Python, а затем обратите внимание на стиль синтаксиса Юлии.

Другие ресурсы

• 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 Interactive, зарегистрировав callback! функция
• Выходы и входы (и состояния, см. Ниже) обратного вызова, могут быть Output , Input , объектами State или шпалами / векторами этих объектов.
• Функции обратного вызова должны иметь подпись (inputs..., states...) и предоставлять возвращаемое значение с теми же элементами номера, что и количество Output данных для обновления.

Состояния и несколько выходов

 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

Json

Приложения DASH Передают данные между браузером (он же фронт) и процессом Юлии, запускающем приложение (он же бэкэнд) в JSON. Dash.jl использует json3.jl для сериализации/десериализации JSON.

Обратите внимание, что json3.jl конвертирует

• Vector S и Tuple S в массивы JSON
• Dict S и NamedTuple объектов JSON