forked from plotly/dash-sample-apps
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Revert "DashR Wind Streaming (plotly#162)"
This reverts commit 5490764.
- Loading branch information
Ryan Patrick Kyle
committed
Jul 2, 2019
1 parent
5490764
commit 638cd31
Showing
1,209 changed files
with
9,346,199 additions
and
1,416 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,2 @@ | ||
./data/output.csv filter=lfs diff=lfs merge=lfs -text | ||
output.csv filter=lfs diff=lfs merge=lfs -text |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -2,5 +2,3 @@ vv/ | |
*.pyc | ||
venv/ | ||
.idea/ | ||
.DS_Store | ||
/apps/.DS_Store |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,200 @@ | ||
# Dash Sample Apps | ||
|
||
This is a monorepo designed to host all of the apps that have been | ||
created for the Python Dash Gallery. | ||
|
||
## Running an example app | ||
|
||
You will need to run applications, and specify filenames, from the | ||
root directory of the repository. e.g., if the name of the app you | ||
want to run is `my_dash_app` and the app filename is `app.py`, you | ||
would need to run `python apps/my_dash_app/app.py` from the root | ||
of the repository. | ||
|
||
Each app has a requirements.txt, install the dependecies in a virtual | ||
environment. | ||
|
||
## Contributing to the sample apps repo | ||
|
||
_"DDS app" below refers to the deployed application. For example, if | ||
the deployment will eventually be hosted at | ||
https://dash-gallery.plotly.host/my-dash-app, "DDS app name" is | ||
`my-dash-app`._ | ||
|
||
### Branches | ||
|
||
Each app has its own branch off of `master` that has the _exact same_ | ||
name as the DDS app. This is an effective `master` branch _for that | ||
app only_. This is because we sync the apps in this repository with | ||
our staging deployment server, and the automatic deploys sync the app | ||
name with the github branch name. So, for automatic deploys to work, | ||
any changes for a particular app should be done on a branch that has | ||
the same name as the app. | ||
|
||
### Adding a new app | ||
|
||
Create an app on Dash Playground. This will be the location of the | ||
auto-deployment. To do this, log into the app manager on | ||
[dash-playground.plotly.host](https://dash-playground.plotly.host) | ||
and click "initialize app". | ||
|
||
Create a branch from `master` that has the _exact same_ name as the | ||
Dash app name. Switch to this branch, then navigate to the `apps/` | ||
directory and add a directory for your app. | ||
|
||
There are two options when you are naming the folder: | ||
|
||
1. Make the folder have the _exact same_ name as the Dash app name. | ||
|
||
2. (Python apps only) Select any other name, but _update the file | ||
[`apps_mapping.py`](apps_directory_mapping.py)_ with the Dash app | ||
name and the folder name you have selected. | ||
|
||
Navigate to the directory you just created, and write a small README | ||
that only contains the name of the app. Stage the README and commit it | ||
to your app branch. | ||
|
||
See [project boilerplate!](https://github.com/plotly/dash-sample-apps#project-boilerplate) | ||
|
||
### Notes on adding a new Dash for R app | ||
|
||
Contributing an app written with Dash for R is very similar to the steps outlined above. | ||
|
||
1. Make the folder have the _exact same_ name as the Dash app name. | ||
|
||
2. Ensure that the file containing your app code is named `app.R`. | ||
|
||
3. The `Procfile` should contain | ||
|
||
``` | ||
web: R -f /app/apps/"$DASH_APP_NAME"/app.R | ||
``` | ||
|
||
4. Routing and request pathname prefixes should be set. One approach might be to include | ||
|
||
``` | ||
appName <- Sys.getenv("DASH_APP_NAME") | ||
pathPrefix <- sprintf("/%s/", appName) | ||
Sys.setenv(DASH_ROUTES_PATHNAME_PREFIX = pathPrefix, | ||
DASH_REQUESTS_PATHNAME_PREFIX = pathPrefix) | ||
``` | ||
|
||
at the head of your `app.R` file. | ||
|
||
5. `run_server()` should be provided the host and port information explicitly, e.g. | ||
|
||
`` | ||
app$run_server(host = "0.0.0.0", port = Sys.getenv('PORT', 8050)) | ||
`` | ||
|
||
6. For convenience, it is probably easiest to set the working directory in `app.R` as well: | ||
|
||
`` | ||
setwd(sprintf("/app/apps/%s", appName)) | ||
`` | ||
|
||
### Making changes to an existing app | ||
|
||
Switch to the branch that has the same name as the DDS app (the "app | ||
branch"). Then, navigate to the directory that has the same name as | ||
the DDS app. | ||
|
||
When you are finished, make a pull request from the app branch to the master | ||
branch. Once you have passed your code review, you can merge your PR. | ||
|
||
## Dash app project structure | ||
|
||
#### Data | ||
- All data (csv, json, txt, etc) should be in a data folder | ||
- `/apps/{DASH_APP_NAME}/data/` | ||
|
||
#### Assets | ||
- All stylesheets and javascript should be in an assets folder | ||
- `/apps/{DASH_APP_NAME}/assets/` | ||
|
||
#### These files will still need to be present within the app folder. | ||
|
||
- **`Procfile`** gets run at root level for deployment | ||
- Make sure python working directory is at the app level | ||
- Ex. `web: gunicorn --pythonpath apps/{DASH_APP_NAME} app:server` | ||
- **`requirements.txt`** | ||
- Install project dependecies in a virtual environment | ||
- **`runtime.txt`** | ||
- App python version | ||
|
||
#### Project boilerplate | ||
|
||
apps | ||
├── ... | ||
├── {DASH_APP_NAME} # app project level | ||
│ ├── assets/ # all stylesheets and javascript files | ||
│ ├── data/ # all data (csv, json, txt, etc) | ||
│ ├── app.py # dash application entry point | ||
│ ├── Procfile # used for heroku deployment (how to run app) | ||
│ ├── requirements.txt # project dependecies | ||
│ ├── runtime.txt # used for heroku deployment (python version) | ||
│ └── ... | ||
└── ... | ||
|
||
#### Handle relative path | ||
|
||
Since deployment happens at the root level `/` and not at the app level (`/apps/{DASH_APP_NAME}`), we need to make sure our application is able to run at both levels for flexibility. | ||
|
||
Reading from assets and data folder | ||
```Python | ||
Img(src="./assets/logo.png") will fail at root level | ||
``` | ||
|
||
Tips | ||
|
||
- Use [get_asset_url()](https://dash.plot.ly/dash-deployment-server/static-assets) | ||
- Use [Pathlib](https://docs.python.org/3/library/pathlib.html) for more flexibility | ||
|
||
```Python | ||
import pathlib | ||
|
||
# get relative assets folder | ||
html.Img(src=app.get_asset_url('logo')) | ||
|
||
# get relative data folder | ||
DATA_PATH = pathlib.Path(__file__, "/data") # /data | ||
with open(DATA_PATH.joinpath("data.csv")) as f: # /data/data.csv | ||
some_string = f.read() | ||
``` | ||
|
||
## Developer Guide | ||
|
||
#### Creating a new project | ||
|
||
``` | ||
# branch off master | ||
git checkout -b "{DASH_APP_NAME}" | ||
# create a new folder in apps/ | ||
mkdir /apps/{DASH_APP_NAME} | ||
# push new app branch | ||
git push -u origin {DASH_APP_NAME} | ||
``` | ||
|
||
#### Before committing | ||
|
||
``` | ||
# make sure your code is linted (we use black) | ||
black . --exclude=venv/ --check | ||
# if black is not installed | ||
pip install black | ||
``` | ||
|
||
|
||
#### App is ready to go! | ||
``` | ||
# once your app branch is ready, make a PR into master! | ||
PR has two checkers. | ||
1. make sure your code passed the black linter | ||
2. make sure your project is deployed on dns playground | ||
``` | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
*.pyc | ||
.DS_Store | ||
venv | ||
venv/ | ||
.venv | ||
.vscode/settings.json |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
web: gunicorn --pythonpath apps/dash-financial-report app:server |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,56 @@ | ||
# Dash Financial Report | ||
|
||
This is a demo of the [Dash](https://plot.ly/products/dash/) interactive Python framework developed by [Plotly](https://plot.ly/). | ||
|
||
Dash abstracts away all of the technologies and protocols required to build an interactive web-based application and is a simple and effective way to bind a user interface around your Python code. To learn more about Dash, take a look at our [documentation](https://dash.plot.ly). If you're interested in deploying this application, check out [Dash Deployment Server](https://dash.plot.ly/dash-deployment-server/) - Plotly's commercial offering for hosting and sharing Dash Apps on-premise or in the cloud. | ||
|
||
## Getting Started | ||
|
||
### Running the app locally | ||
|
||
First create a virtual environment with conda or venv inside a temp folder, then activate it. | ||
|
||
``` | ||
virtualenv venv | ||
# Windows | ||
venv\Scripts\activate | ||
# Or Linux | ||
source venv/bin/activate | ||
``` | ||
|
||
Clone the git repo, then install the requirements with pip | ||
|
||
``` | ||
git clone https://github.com/plotly/dash-sample-apps | ||
cd dash-sample-apps/apps/dash-financial-report | ||
pip install -r requirements.txt | ||
``` | ||
|
||
Run the app | ||
|
||
``` | ||
python app.py | ||
``` | ||
|
||
## About the app | ||
|
||
This is an interactive, multi-page report which displays a variety of tables, bullet points, and Plotly interactive plots in a report format. The app incorporates custom local and external CSS to display distinct pages for PDF print. | ||
|
||
## Built With | ||
|
||
- [Dash](https://dash.plot.ly/) - Main server and interactive components | ||
- [Plotly Python](https://plot.ly/python/) - Used to create the interactive plots | ||
|
||
The following are screenshots for the app in this repo: | ||
|
||
![animated](screenshots/dash-financial-report-demo.gif) | ||
|
||
![screenshot](screenshots/report-screenshot.png) | ||
|
||
![screenshot](screenshots/report-interactive.png) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,52 @@ | ||
# -*- coding: utf-8 -*- | ||
import dash | ||
import dash_core_components as dcc | ||
import dash_html_components as html | ||
from dash.dependencies import Input, Output | ||
from pages import ( | ||
overview, | ||
pricePerformance, | ||
portfolioManagement, | ||
feesMins, | ||
distributions, | ||
newsReviews, | ||
) | ||
|
||
app = dash.Dash( | ||
__name__, meta_tags=[{"name": "viewport", "content": "width=device-width"}] | ||
) | ||
server = app.server | ||
|
||
# Describe the layout/ UI of the app | ||
app.layout = html.Div( | ||
[dcc.Location(id="url", refresh=False), html.Div(id="page-content")] | ||
) | ||
|
||
# Update page | ||
@app.callback(Output("page-content", "children"), [Input("url", "pathname")]) | ||
def display_page(pathname): | ||
if pathname == "/dash-financial-report/price-performance": | ||
return pricePerformance.create_layout(app) | ||
elif pathname == "/dash-financial-report/portfolio-management": | ||
return portfolioManagement.create_layout(app) | ||
elif pathname == "/dash-financial-report/fees": | ||
return feesMins.create_layout(app) | ||
elif pathname == "/dash-financial-report/distributions": | ||
return distributions.create_layout(app) | ||
elif pathname == "/dash-financial-report/news-and-reviews": | ||
return newsReviews.create_layout(app) | ||
elif pathname == "/dash-financial-report/full-view": | ||
return ( | ||
overview.create_layout(app), | ||
pricePerformance.create_layout(app), | ||
portfolioManagement.create_layout(app), | ||
feesMins.create_layout(app), | ||
distributions.create_layout(app), | ||
newsReviews.create_layout(app), | ||
) | ||
else: | ||
return overview.create_layout(app) | ||
|
||
|
||
if __name__ == "__main__": | ||
app.run_server(debug=True) |
Oops, something went wrong.