{"id":245,"date":"2020-11-09T11:23:08","date_gmt":"2020-11-09T08:23:08","guid":{"rendered":"http:\/\/www.etemkeskin.com\/?p=245"},"modified":"2020-11-09T11:23:12","modified_gmt":"2020-11-09T08:23:12","slug":"dash-ve-plotly-ile-raporlama-ekranlari-hazirlama-2","status":"publish","type":"post","link":"https:\/\/www.etemkeskin.com\/index.php\/tr\/2020\/11\/09\/dash-ve-plotly-ile-raporlama-ekranlari-hazirlama-2\/","title":{"rendered":"Dash ve Plotly ile Raporlama Ekranlar\u0131 Haz\u0131rlama"},"content":{"rendered":"\n<h3>1. DASH Nedir?<\/h3>\n\n\n\n<p>Dash, web uygulamalar\u0131 olu\u015fturmak i\u00e7in geli\u015ftirilen bir <strong>Python framework\u00fcd\u00fcr<\/strong>. Ancak veri g\u00f6rselle\u015ftirme uygulamalar\u0131na daha uygundur. Dash framework, <strong>Flask, Plotly.js, ve React.js<\/strong> k\u00fct\u00fcphaneleri \u00fczerine kurulu olarak geli\u015ftirilmi\u015ftir. Dash ile interaktif tablolar, grafikler ve veri g\u00f6rselle\u015ftirmeleri javascript bilmeden kolayl\u0131kla geli\u015ftirilebilinir.<\/p>\n\n\n\n<p>Python ile Veri analizi, veri ke\u015ffi, g\u00f6rselle\u015ftirme, modelleme, cihaz kontrol\u00fc ve raporlama yapan ki\u015filer dash ile kolayl\u0131kla analitik web uygulamalar\u0131 geli\u015ftirebilir.<\/p>\n\n\n\n<p>Ayr\u0131ca dash te <strong>CSS<\/strong> ve <strong>Html<\/strong>&#8216; in g\u00fcc\u00fcnden de yaralan\u0131larak grafik ve tablolar\u0131n\u0131z\u0131 \u00e7arp\u0131c\u0131 hale getirebilirsiniz.<\/p>\n\n\n\n<h3>2. Kurulumlar<\/h3>\n\n\n\n<p>Dash&#8217; i bilgisayar\u0131m\u0131za y\u00fcklemeden \u00f6nce bilgisayar\u0131m\u0131zda python3 &#8216; \u00fcn kurulu olmas\u0131 gerekiyor. Bunun i\u00e7in bilgisayar\u0131m\u0131za&nbsp;<a rel=\"noreferrer noopener\" href=\"https:\/\/www.anaconda.com\/\" target=\"_blank\">https:\/\/www.anaconda.com\/<\/a>&nbsp;web sitesinden Anaconda kurabiliriz. Anaconda&#8217; y\u0131 kurduktan sonra bilgisayar\u0131m\u0131zda Dash uygulamalar\u0131 i\u00e7in <strong>virtual(sanal) ortam<\/strong> olu\u015fturup bunun i\u00e7ine a\u015fa\u011f\u0131daki paketleri y\u00fckleyece\u011fiz.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>conda create --name dash # anacondada virtual ortam olu\u015fturmak\nconda activate dash veya source active dash #windows veya linuxte virtual ortam\u0131 aktive etmek<\/code><\/pre>\n\n\n\n<p>Dash&#8217;le ilgili a\u015fa\u011f\u0131daki komutlar\u0131 kullanabilirsiniz. Yada sadece <code><strong>pip install dash<\/strong><\/code> derseniz a\u015fa\u011f\u0131daki paketlerin hepsini y\u00fcklemi\u015f olursunuz.<\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"python\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">pip install Flask\npip install dash\npip install plotly\npip install dash_html_components # dash html components\npip install dash_core_components # dash core components \npip install dash-table # data table components<\/pre>\n\n\n\n<p><code><strong>pip freeze<\/strong><\/code> komutu yazarak sanal ortama y\u00fcklenmi\u015f python paketlerini g\u00f6rebiliriz.<\/p>\n\n\n\n<h3>3. DASH&#8217; e Giri\u015f<\/h3>\n\n\n\n<p>Dash&#8217; te <strong>dash<\/strong> <strong>html komponentler<\/strong> ve <strong>dash core komponentler<\/strong> interaktif tablo ve grafikler olu\u015fturmak i\u00e7in kullan\u0131l\u0131r. A\u015fa\u011f\u0131da olan kodda dash ile olu\u015fturulan komponentin asl\u0131nda html olarak neyi ifade etti\u011fini anlayabilirsiniz.<\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"python\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">import dash_html_components as html\n# Dash html code in python\nhtml.Div([\n    html.H1('\u0130lk Uygulama'),\n    html.Div([\n        html.P(\"Dash, Python class' lar\u0131n\u0131 HTML elementlerine d\u00f6n\u00fc\u015ft\u00fcr\u00fcr.\"),\n        html.P(\"Bu d\u00f6n\u00fc\u015f\u00fcmde Javascript frontendde kullan\u0131l\u0131r.\")\n    ])\n])\n # Yukar\u0131daki python kodun web taray\u0131c\u0131da g\u00f6sterilecek HTML hali\n  &lt;div>\n    &lt;h1>First Dash App&lt;\/h1>\n    &lt;div>\n        &lt;p>Dash converts Python classes into HTML&lt;\/p>\n        &lt;p>This conversion happens behind the scenes by Dash's JavaScript front-end&lt;\/p>\n    &lt;\/div>\n&lt;\/div><\/pre>\n\n\n\n<p>Dash uygulamalar\u0131 temelde 2 b\u00f6l\u00fcmden olu\u015fuyor. <strong>Layout ve Callbacks<\/strong>. Layout ile Dash uygulamas\u0131n\u0131n nas\u0131l g\u00f6r\u00fcnece\u011fi, Callbacks&#8217;ler ile de uygulaman\u0131n nas\u0131l interaktif olarak \u00e7al\u0131\u015faca\u011f\u0131n\u0131 tan\u0131mlar\u0131z.<\/p>\n\n\n\n<h3>4. Layout ve \u0130lk Uygulama<\/h3>\n\n\n\n<p>Dash&#8217;te uygulaman\u0131n g\u00f6rsel komponentlerini olu\u015fturmak i\u00e7in Python classlar\u0131 tan\u0131mlanm\u0131\u015ft\u0131r. Bu komponenler, dash_core_components ve dash_html_components paketlerinde tan\u0131mlanm\u0131\u015ft\u0131r ve bunlar\u0131  projenize dahil ederek kullanabiliriz.<\/p>\n\n\n\n<p>Dash Core Componentler, interaktif dashboard&#8217; lar haz\u0131rlamak i\u00e7in \u00e7e\u015fitli componentlerden olu\u015fmu\u015ftur. K\u0131saca bunlar<\/p>\n\n\n\n<ol><li>Graphs: Grafikler olu\u015fturmak i\u00e7in<\/li><li>Tabs: Tablar(sekmeler) olu\u015fturmak i\u00e7in<\/li><li>Dropdown: A\u00e7\u0131l\u0131r liste olu\u015fturmak i\u00e7in<\/li><li>Sliders: Slider olu\u015fturmak i\u00e7in<\/li><li>DatePickers: Tarih veya tarih aral\u0131\u011f\u0131 se\u00e7mek i\u00e7in<\/li><li>Table: Tablolar\u0131 g\u00f6stermek i\u00e7in<\/li><li>Markdown: Markdown olarak kullan\u0131l\u0131r.<\/li><li>Checklist: Checklist se\u00e7enekleri i\u00e7in<\/li><li>RadioItems: Radio butonlar\u0131 i\u00e7in<\/li><li>Location: Browserda location bar sunmak i\u00e7in<\/li><li>Store: Borwserda veri saklamak i\u00e7in olan komponentlerden olu\u015fmaktad\u0131r.<\/li><\/ol>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"python\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">import dash\nimport dash_core_components as dcc\nimport dash_html_components as html\nfrom dash.dependencies import Input, Output\nimport dash_table\n\nexternal_stylesheets = [''] #harici css dosyya yolu tan\u0131mlanabilir.\n\napp = dash.Dash(__name__, external_stylesheets=external_stylesheets)\n\napp.layout = html.Div(children=[\n    html.H1(children='Merhaba Dash'),\n\n    html.Div(children='''\n        DASH: \u0130lk Dash uygulamas\u0131.\n    '''),\n\n    dcc.Graph(\n        id='example-graph',\n        figure={\n            'data': [\n                {'x': [1, 2, 3], 'y': [4, 1, 2], 'type': 'bar', 'name': 'Ankara'},\n                {'x': [1, 2, 3], 'y': [2, 4, 5], 'type': 'bar', 'name': u'\u0130stanbul'},\n            ],\n            'layout': {\n                'title': 'Dash Veri G\u00f6rselle\u015ftirme'\n            }\n        }\n    )\n])\n\nif __name__ == '__main__':\n    app.run_server(debug=True)<\/pre>\n\n\n\n<p>\u0130lk \u00f6nce &#8220;app = dash.Dash(__<strong>name<\/strong>__)&#8221; ile DASH objesi olu\u015fturduk. Daha sonra uygulamada app.layout ile layoutun nas\u0131l olaca\u011f\u0131n\u0131 tan\u0131mlad\u0131k.<\/p>\n\n\n\n<p>Layoutta dcc.Graph() ile uygulamam\u0131zda grafi\u011fi tan\u0131mlad\u0131k. Grafi\u011fin i\u00e7ine data ve grafi\u011fin t\u00fcr\u00fc ile ilgili bilgileri girdik.<\/p>\n\n\n\n<p>En sonda app.run_server(debug=True) ile uygulamam\u0131z\u0131 ba\u015flat\u0131yoruz. Uygulamay\u0131 \u00e7al\u0131\u015ft\u0131r\u0131d\u0131\u011f\u0131m\u0131zda web taray\u0131c\u0131da a\u015fa\u011f\u0131daki \u00e7\u0131kt\u0131y\u0131 al\u0131r\u0131z.<\/p>\n\n\n\n<figure class=\"wp-block-gallery columns-1 is-cropped\"><ul class=\"blocks-gallery-grid\"><li class=\"blocks-gallery-item\"><figure><img loading=\"lazy\" width=\"1085\" height=\"515\" src=\"http:\/\/www.etemkeskin.com\/wp-content\/uploads\/2020\/04\/dash1.jpg\" alt=\"\" data-id=\"193\" data-full-url=\"http:\/\/www.etemkeskin.com\/wp-content\/uploads\/2020\/04\/dash1.jpg\" data-link=\"http:\/\/www.etemkeskin.com\/index.php\/2020\/04\/10\/dash-ve-plotly-ile-raporlama-ekranlari-hazirlama\/dash1\/\" class=\"wp-image-193\"\/><\/figure><\/li><\/ul><\/figure>\n\n\n\n<h3>5. DASH Callbacks<\/h3>\n\n\n\n<p>Dash uygulamal\u0131nda Grafiklerimizi interaktif yapmak i\u00e7in yazaca\u011f\u0131m\u0131z fonksiyonun ba\u015f\u0131nda <strong>@app.callback() dekorat\u00f6r\u00fcn\u00fc<\/strong> kullan\u0131r\u0131z.<\/p>\n\n\n\n<p>A\u015fa\u011f\u0131da en basit callback uygulamas\u0131n\u0131 inceleyelim. \u0130lk \u00f6nce layoutumuzda input alaca\u011f\u0131m\u0131z <strong>dash core elementi<\/strong>ni tan\u0131ml\u0131yoruz. Bu htmlde <strong>form element<\/strong>inin kar\u015f\u0131l\u0131\u011f\u0131d\u0131r. Bu input elementinin de\u011ferine callback dekorat\u00f6r\u00fcnde elementin <strong>id=&#8217;my-id&#8217;<\/strong> de\u011feri ile ula\u015f\u0131l\u0131r ve bunu fonksiyonda kullan\u0131r\u0131z. Daha sonra layoutta bu value nerede kullan\u0131lacak ve nerede output olarak render edeceksek dekorat\u00f6rde layouttaki elemente <strong>id=&#8217;my-div&#8217;<\/strong> ile ula\u015f\u0131r\u0131z ve fonksiyonun \u00f6zelli\u011fine g\u00f6re ya bir grafik yada bir \u00e7\u0131kt\u0131 elementi d\u00f6nd\u00fcrebiliriz.<\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"python\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">import dash\nimport dash_core_components as dcc\nimport dash_html_components as html\nfrom dash.dependencies import Input, Output\n\napp = dash.Dash(__name__)\n\napp.layout = html.Div([\n    dcc.Input(id='my-id', value='initial value', type='text'),\n    html.Div(id='my-div')\n])\n\n@app.callback(\n    Output(component_id='my-div', component_property='children'),\n    [Input(component_id='my-id', component_property='value')]\n)\ndef update_output_div(input_value):\n    return 'Girdi\u011finiz de\u011fer: \"{}\"'.format(input_value)\n\nif __name__ == '__main__':\n    app.run_server(debug=True)<\/pre>\n\n\n\n<p><strong>update_output_div()<\/strong> fonksiyonun \u00fczerine yazd\u0131\u011f\u0131m\u0131z app.callback() dekorat\u00f6r\u00fc ile layoutmuzu interaktif hale getirdik. \u00c7\u0131kt\u0131 olarak ta 5 girdi\u011fimiz de\u011feri \u00e7\u0131kt\u0131 olarakta 5 g\u00f6rd\u00fck.<\/p>\n\n\n\n<figure class=\"wp-block-gallery columns-1 is-cropped\"><ul class=\"blocks-gallery-grid\"><li class=\"blocks-gallery-item\"><figure><img loading=\"lazy\" width=\"391\" height=\"209\" src=\"http:\/\/www.etemkeskin.com\/wp-content\/uploads\/2020\/04\/dash2.jpg\" alt=\"\" data-id=\"200\" data-full-url=\"http:\/\/www.etemkeskin.com\/wp-content\/uploads\/2020\/04\/dash2.jpg\" data-link=\"http:\/\/www.etemkeskin.com\/index.php\/2020\/04\/10\/dash-ve-plotly-ile-raporlama-ekranlari-hazirlama\/dash2\/\" class=\"wp-image-200\"\/><\/figure><\/li><\/ul><\/figure>\n\n\n\n<p>Daha geli\u015fmi\u015f bir callback uygulamas\u0131na bakal\u0131m.<\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"python\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">import dash\nimport dash_core_components as dcc\nimport dash_html_components as html\nfrom dash.dependencies import Input, Output\nimport pandas as pd\n\ndf = pd.read_csv('https:\/\/raw.githubusercontent.com\/plotly\/datasets\/master\/gapminderDataFiveYear.csv')\n\nexternal_stylesheets = ['https:\/\/codepen.io\/chriddyp\/pen\/bWLwgP.css']\n\napp = dash.Dash(__name__, external_stylesheets=external_stylesheets)\n\napp.layout = html.Div([\n    dcc.Graph(id='graph-with-slider'),\n    dcc.Slider(\n        id='year-slider',\n        min=df['year'].min(),\n        max=df['year'].max(),\n        value=df['year'].min(),\n        marks={str(year): str(year) for year in df['year'].unique()},\n        step=None\n    )\n])\n\n@app.callback(\n    Output('graph-with-slider', 'figure'),\n    [Input('year-slider', 'value')])\ndef update_figure(selected_year):\n    filtered_df = df[df.year == selected_year]\n    traces = []\n    for i in filtered_df.continent.unique():\n        df_by_continent = filtered_df[filtered_df['continent'] == i]\n        traces.append(dict(\n            x=df_by_continent['gdpPercap'],\n            y=df_by_continent['lifeExp'],\n            text=df_by_continent['country'],\n            mode='markers',\n            opacity=0.7,\n            marker={\n                'size': 15,\n                'line': {'width': 0.5, 'color': 'white'}\n            },\n            name=i\n        ))\n\n    return {\n        'data': traces,\n        'layout': dict(\n            xaxis={'type': 'log', 'title': 'GDP Per Capita',\n                   'range':[2.3, 4.8]},\n            yaxis={'title': 'Life Expectancy', 'range': [20, 90]},\n            margin={'l': 40, 'b': 40, 't': 10, 'r': 10},\n            legend={'x': 0, 'y': 1},\n            hovermode='closest',\n            transition = {'duration': 500},\n        )\n    }\n\n\nif __name__ == '__main__':\n    app.run_server(debug=True)<\/pre>\n\n\n\n<p>Grafi\u011fimize bir <strong>slider<\/strong> ekleyerek interaktif hale getirdik.  Layoutta <strong>dcc.Graph(id=&#8217;graph-with-slider&#8217;)<\/strong> ile tan\u0131mlayarak grafi\u011fin render edilece\u011fi yeri belirleriz. Dikkat edilirse Input k\u00f6\u015feli parantez i\u00e7inde tan\u0131mlan\u0131yor. <\/p>\n\n\n\n<p>A\u015fa\u011f\u0131da yazd\u0131\u011f\u0131m\u0131z uygulaman\u0131n \u00e7\u0131kt\u0131s\u0131.<\/p>\n\n\n\n<figure class=\"wp-block-gallery columns-1 is-cropped\"><ul class=\"blocks-gallery-grid\"><li class=\"blocks-gallery-item\"><figure><img loading=\"lazy\" width=\"1012\" height=\"533\" src=\"http:\/\/www.etemkeskin.com\/wp-content\/uploads\/2020\/04\/dash3.jpg\" alt=\"\" data-id=\"203\" data-full-url=\"http:\/\/www.etemkeskin.com\/wp-content\/uploads\/2020\/04\/dash3.jpg\" data-link=\"http:\/\/www.etemkeskin.com\/index.php\/2020\/04\/10\/dash-ve-plotly-ile-raporlama-ekranlari-hazirlama\/dash3\/\" class=\"wp-image-203\"\/><\/figure><\/li><\/ul><\/figure>\n\n\n\n<h3>6. DASH DATATABLE<\/h3>\n\n\n\n<p>Dash datatable, tablolarda veriyi bir arada g\u00f6rme , s\u0131ralama ve interaktiflik sa\u011flama i\u00e7in olu\u015fturulan komponenttir. A\u015fa\u011f\u0131da Dash ile olu\u015fturulan en basit dash datatable.<\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"python\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">import dash\nimport dash_table\nimport pandas as pd\n\ndf = pd.read_csv('https:\/\/raw.githubusercontent.com\/plotly\/datasets\/master\/solar.csv')\n\napp = dash.Dash(__name__)\n\napp.layout = dash_table.DataTable(\n    id='table',\n    columns=[{\"name\": i, \"id\": i} for i in df.columns],\n    data=df.to_dict('records'),\n)\n\nif __name__ == '__main__':\n    app.run_server(debug=True)<\/pre>\n\n\n\n<p>\u00c7\u0131kt\u0131 olarak a\u015fa\u011f\u0131daki tabloyu g\u00f6rebiliriz.<\/p>\n\n\n\n<figure class=\"wp-block-gallery columns-1 is-cropped\"><ul class=\"blocks-gallery-grid\"><li class=\"blocks-gallery-item\"><figure><img loading=\"lazy\" width=\"1024\" height=\"321\" src=\"http:\/\/www.etemkeskin.com\/wp-content\/uploads\/2020\/04\/dash4.jpg\" alt=\"\" data-id=\"206\" data-full-url=\"http:\/\/www.etemkeskin.com\/wp-content\/uploads\/2020\/04\/dash4.jpg\" data-link=\"http:\/\/www.etemkeskin.com\/index.php\/2020\/04\/10\/dash-ve-plotly-ile-raporlama-ekranlari-hazirlama\/dash4\/\" class=\"wp-image-206\"\/><\/figure><\/li><\/ul><\/figure>\n\n\n\n<p>Bu tabloya DASH&#8217;in dokumantasyonuna bakarak bir s\u00fcr\u00fc \u00f6zellik katabiliriz.<\/p>\n\n\n\n<h4>KAYNAKLAR<\/h4>\n\n\n\n<ol><li>https:\/\/medium.com\/plotly\/introducing-dash-5ecf7191b503<\/li><li>https:\/\/medium.com\/analytics-vidhya\/building-a-dashboard-app-using-plotlys-dash-a-complete-guide-from-beginner-to-pro-61e890bdc423<\/li><li>https:\/\/dash.plotly.com\/<\/li><li>https:\/\/hackersandslackers.com\/plotly-dash-with-flask\/<\/li><li>https:\/\/medium.com\/swlh\/dashboards-in-python-for-beginners-and-everyone-else-using-dash-f0a045a86644<\/li><li>https:\/\/levelup.gitconnected.com\/dashboards-in-python-for-beginners-using-dash-live-updates-and-streaming-data-into-a-dashboard-37660c1ba661<\/li><li>https:\/\/towardsdatascience.com\/how-to-build-a-complex-reporting-dashboard-using-dash-and-plotl-4f4257c18a7f<\/li><\/ol>\n","protected":false},"excerpt":{"rendered":"<p>1. DASH Nedir? Dash, web uygulamalar\u0131 olu\u015fturmak i\u00e7in geli\u015ftirilen bir Python framework\u00fcd\u00fcr. Ancak veri g\u00f6rselle\u015ftirme uygulamalar\u0131na daha uygundur. Dash framework, Flask, Plotly.js, ve React.js k\u00fct\u00fcphaneleri \u00fczerine kurulu olarak geli\u015ftirilmi\u015ftir. Dash ile interaktif tablolar, grafikler ve veri g\u00f6rselle\u015ftirmeleri javascript bilmeden kolayl\u0131kla geli\u015ftirilebilinir. Python ile Veri analizi, veri ke\u015ffi, g\u00f6rselle\u015ftirme, modelleme, cihaz kontrol\u00fc ve raporlama yapan ki\u015filer [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[18],"tags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v16.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Dash ve Plotly ile Raporlama Ekranlar\u0131 Haz\u0131rlama - blog website<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.etemkeskin.com\/index.php\/tr\/2020\/11\/09\/dash-ve-plotly-ile-raporlama-ekranlari-hazirlama-2\/\" \/>\n<meta property=\"og:locale\" content=\"tr_TR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Dash ve Plotly ile Raporlama Ekranlar\u0131 Haz\u0131rlama - blog website\" \/>\n<meta property=\"og:description\" content=\"1. DASH Nedir? Dash, web uygulamalar\u0131 olu\u015fturmak i\u00e7in geli\u015ftirilen bir Python framework\u00fcd\u00fcr. Ancak veri g\u00f6rselle\u015ftirme uygulamalar\u0131na daha uygundur. Dash framework, Flask, Plotly.js, ve React.js k\u00fct\u00fcphaneleri \u00fczerine kurulu olarak geli\u015ftirilmi\u015ftir. Dash ile interaktif tablolar, grafikler ve veri g\u00f6rselle\u015ftirmeleri javascript bilmeden kolayl\u0131kla geli\u015ftirilebilinir. Python ile Veri analizi, veri ke\u015ffi, g\u00f6rselle\u015ftirme, modelleme, cihaz kontrol\u00fc ve raporlama yapan ki\u015filer [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.etemkeskin.com\/index.php\/tr\/2020\/11\/09\/dash-ve-plotly-ile-raporlama-ekranlari-hazirlama-2\/\" \/>\n<meta property=\"og:site_name\" content=\"blog website\" \/>\n<meta property=\"article:published_time\" content=\"2020-11-09T08:23:08+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-11-09T08:23:12+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/www.etemkeskin.com\/wp-content\/uploads\/2020\/04\/dash1.jpg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Tahmini okuma s\u00fcresi\" \/>\n\t<meta name=\"twitter:data1\" content=\"7 dakika\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.etemkeskin.com\/#website\",\"url\":\"https:\/\/www.etemkeskin.com\/\",\"name\":\"blog website\",\"description\":\"Etem KESK\\u0130N\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"https:\/\/www.etemkeskin.com\/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"tr\"},{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.etemkeskin.com\/index.php\/tr\/2020\/11\/09\/dash-ve-plotly-ile-raporlama-ekranlari-hazirlama-2\/#primaryimage\",\"inLanguage\":\"tr\",\"url\":\"http:\/\/www.etemkeskin.com\/wp-content\/uploads\/2020\/04\/dash1.jpg\",\"contentUrl\":\"http:\/\/www.etemkeskin.com\/wp-content\/uploads\/2020\/04\/dash1.jpg\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.etemkeskin.com\/index.php\/tr\/2020\/11\/09\/dash-ve-plotly-ile-raporlama-ekranlari-hazirlama-2\/#webpage\",\"url\":\"https:\/\/www.etemkeskin.com\/index.php\/tr\/2020\/11\/09\/dash-ve-plotly-ile-raporlama-ekranlari-hazirlama-2\/\",\"name\":\"Dash ve Plotly ile Raporlama Ekranlar\\u0131 Haz\\u0131rlama - blog website\",\"isPartOf\":{\"@id\":\"https:\/\/www.etemkeskin.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.etemkeskin.com\/index.php\/tr\/2020\/11\/09\/dash-ve-plotly-ile-raporlama-ekranlari-hazirlama-2\/#primaryimage\"},\"datePublished\":\"2020-11-09T08:23:08+00:00\",\"dateModified\":\"2020-11-09T08:23:12+00:00\",\"author\":{\"@id\":\"https:\/\/www.etemkeskin.com\/#\/schema\/person\/dcbc30282861ce578b96a79ce8789629\"},\"breadcrumb\":{\"@id\":\"https:\/\/www.etemkeskin.com\/index.php\/tr\/2020\/11\/09\/dash-ve-plotly-ile-raporlama-ekranlari-hazirlama-2\/#breadcrumb\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.etemkeskin.com\/index.php\/tr\/2020\/11\/09\/dash-ve-plotly-ile-raporlama-ekranlari-hazirlama-2\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.etemkeskin.com\/index.php\/tr\/2020\/11\/09\/dash-ve-plotly-ile-raporlama-ekranlari-hazirlama-2\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Ana sayfa\",\"item\":\"https:\/\/www.etemkeskin.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Dash ve Plotly ile Raporlama Ekranlar\\u0131 Haz\\u0131rlama\"}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.etemkeskin.com\/#\/schema\/person\/dcbc30282861ce578b96a79ce8789629\",\"name\":\"etemkeskin\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.etemkeskin.com\/#personlogo\",\"inLanguage\":\"tr\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/6af0148b790691ed24ae245fb3dc773b?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/6af0148b790691ed24ae245fb3dc773b?s=96&d=mm&r=g\",\"caption\":\"etemkeskin\"},\"url\":\"https:\/\/www.etemkeskin.com\/index.php\/author\/etemkeskinyahoo-com\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","_links":{"self":[{"href":"https:\/\/www.etemkeskin.com\/index.php\/wp-json\/wp\/v2\/posts\/245"}],"collection":[{"href":"https:\/\/www.etemkeskin.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.etemkeskin.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.etemkeskin.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.etemkeskin.com\/index.php\/wp-json\/wp\/v2\/comments?post=245"}],"version-history":[{"count":1,"href":"https:\/\/www.etemkeskin.com\/index.php\/wp-json\/wp\/v2\/posts\/245\/revisions"}],"predecessor-version":[{"id":246,"href":"https:\/\/www.etemkeskin.com\/index.php\/wp-json\/wp\/v2\/posts\/245\/revisions\/246"}],"wp:attachment":[{"href":"https:\/\/www.etemkeskin.com\/index.php\/wp-json\/wp\/v2\/media?parent=245"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.etemkeskin.com\/index.php\/wp-json\/wp\/v2\/categories?post=245"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.etemkeskin.com\/index.php\/wp-json\/wp\/v2\/tags?post=245"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}