Skip to content

Commit

Permalink
working final draft
Browse files Browse the repository at this point in the history
Signed-off-by: ravi_kumar_pilla <[email protected]>
  • Loading branch information
ravi-kumar-pilla committed Jan 28, 2025
1 parent 7755e11 commit 7c264dd
Show file tree
Hide file tree
Showing 13 changed files with 157 additions and 214 deletions.
87 changes: 38 additions & 49 deletions demo-project/viz_jupyter_test.ipynb
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
"cells": [
{
"cell_type": "code",
"execution_count": 2,
"execution_count": 1,
"id": "9598f7ec-bf4a-461a-9925-953024d97996",
"metadata": {},
"outputs": [],
Expand All @@ -12,7 +12,7 @@
},
{
"cell_type": "code",
"execution_count": 3,
"execution_count": 2,
"id": "50c84657-e314-47e0-854b-38d32c24727e",
"metadata": {},
"outputs": [],
Expand All @@ -24,7 +24,7 @@
},
{
"cell_type": "code",
"execution_count": 4,
"execution_count": 3,
"id": "f9b64488-4462-449b-bcb8-060606856cf0",
"metadata": {},
"outputs": [],
Expand All @@ -34,7 +34,7 @@
},
{
"cell_type": "code",
"execution_count": 5,
"execution_count": 4,
"id": "d0ae936a-0665-4a48-9029-575dab0f4396",
"metadata": {},
"outputs": [
Expand All @@ -46,7 +46,7 @@
"])"
]
},
"execution_count": 5,
"execution_count": 4,
"metadata": {},
"output_type": "execute_result"
}
Expand All @@ -55,40 +55,10 @@
"pipe"
]
},
{
"cell_type": "code",
"execution_count": 6,
"id": "756dfac1-8f2e-497d-9a24-e54e43028d18",
"metadata": {},
"outputs": [
{
"data": {
"text/html": [
"<pre style=\"white-space:pre;overflow-x:auto;line-height:normal;font-family:Menlo,'DejaVu Sans Mono',consolas,'Courier New',monospace\"><span style=\"color: #7fbfbf; text-decoration-color: #7fbfbf\">[01/23/25 17:47:08] </span><span style=\"color: #000080; text-decoration-color: #000080\">INFO </span> Using <a href=\"file:///Users/Ravi_Kumar_Pilla/Library/CloudStorage/OneDrive-McKinsey&Company/Documents/KedroOrg/kedro/kedro/framework/project/__init__.py\" target=\"_blank\"><span style=\"color: #7f7f7f; text-decoration-color: #7f7f7f\">__init__.py</span></a><span style=\"color: #7f7f7f; text-decoration-color: #7f7f7f\">:</span><a href=\"file:///Users/Ravi_Kumar_Pilla/Library/CloudStorage/OneDrive-McKinsey&Company/Documents/KedroOrg/kedro/kedro/framework/project/__init__.py#270\" target=\"_blank\"><span style=\"color: #7f7f7f; text-decoration-color: #7f7f7f\">270</span></a>\n",
"<span style=\"color: #7fbfbf; text-decoration-color: #7fbfbf\"> </span> <span style=\"color: #008000; text-decoration-color: #008000\">'/Users/Ravi_Kumar_Pilla/Library/CloudStorage/OneDrive-McKinsey&amp;Compan</span> <span style=\"color: #7f7f7f; text-decoration-color: #7f7f7f\"> </span>\n",
"<span style=\"color: #7fbfbf; text-decoration-color: #7fbfbf\"> </span> <span style=\"color: #008000; text-decoration-color: #008000\">y/Documents/KedroOrg/kedro/kedro/framework/project/rich_logging.yml'</span> <span style=\"color: #7f7f7f; text-decoration-color: #7f7f7f\"> </span>\n",
"<span style=\"color: #7fbfbf; text-decoration-color: #7fbfbf\"> </span> as logging configuration. <span style=\"color: #7f7f7f; text-decoration-color: #7f7f7f\"> </span>\n",
"</pre>\n"
],
"text/plain": [
"\u001b[2;36m[01/23/25 17:47:08]\u001b[0m\u001b[2;36m \u001b[0m\u001b[34mINFO \u001b[0m Using \u001b]8;id=874068;file:///Users/Ravi_Kumar_Pilla/Library/CloudStorage/OneDrive-McKinsey&Company/Documents/KedroOrg/kedro/kedro/framework/project/__init__.py\u001b\\\u001b[2m__init__.py\u001b[0m\u001b]8;;\u001b\\\u001b[2m:\u001b[0m\u001b]8;id=365112;file:///Users/Ravi_Kumar_Pilla/Library/CloudStorage/OneDrive-McKinsey&Company/Documents/KedroOrg/kedro/kedro/framework/project/__init__.py#270\u001b\\\u001b[2m270\u001b[0m\u001b]8;;\u001b\\\n",
"\u001b[2;36m \u001b[0m \u001b[32m'/Users/Ravi_Kumar_Pilla/Library/CloudStorage/OneDrive-McKinsey&Compan\u001b[0m \u001b[2m \u001b[0m\n",
"\u001b[2;36m \u001b[0m \u001b[32my/Documents/KedroOrg/kedro/kedro/framework/project/rich_logging.yml'\u001b[0m \u001b[2m \u001b[0m\n",
"\u001b[2;36m \u001b[0m as logging configuration. \u001b[2m \u001b[0m\n"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"from kedro_viz.launchers.experimental_viz import KedroVizNotebook"
]
},
{
"cell_type": "code",
"execution_count": 7,
"id": "c2786e73-3cff-43d6-8b2a-81b25fc3ceaa",
"id": "f4e92e02-4e7d-4b71-80fe-ad8615ad9ab5",
"metadata": {},
"outputs": [
{
Expand All @@ -104,33 +74,52 @@
{
"data": {
"text/html": [
"\n",
" <iframe\n",
" width=\"100%\"\n",
" height=\"600\"\n",
" src=\".viz/jupyter_viz_exploration.html\"\n",
" frameborder=\"0\"\n",
" allowfullscreen\n",
" \n",
" ></iframe>\n",
" "
"<!DOCTYPE html>\n",
" <html lang='en'>\n",
" <head>\n",
" <meta charset='UTF-8'>\n",
" <meta name='viewport' content='width=device-width, initial-scale=1.0'>\n",
" <title>Kedro-Viz</title>\n",
" </head>\n",
" <body>\n",
" <div id='root' style='height: 600px'></div>\n",
" <script src='http://localhost:8012/kedroViz.bundle.min.js'></script>\n",
" <script>\n",
" window.viz_container = document.getElementById('root');\n",
" \n",
" if (window.createRoot) {\n",
" window.viz_root = window.createRoot(window.viz_container);\n",
" window.viz_root && window.viz_root.render(window.React.createElement(window.KedroViz, { data: {\"nodes\": [{\"id\": \"cffa5dc2\", \"name\": \"dummy\", \"tags\": [], \"pipelines\": [\"__default__\"], \"type\": \"task\", \"modular_pipelines\": null, \"parameters\": {}}, {\"id\": \"b1538005\", \"name\": \"flights\", \"tags\": [], \"pipelines\": [\"__default__\"], \"type\": \"data\", \"modular_pipelines\": null, \"layer\": null, \"dataset_type\": \"io.memory_dataset.MemoryDataset\", \"stats\": null}, {\"id\": \"777ad629\", \"name\": \"processed_flights\", \"tags\": [], \"pipelines\": [\"__default__\"], \"type\": \"data\", \"modular_pipelines\": null, \"layer\": null, \"dataset_type\": \"io.memory_dataset.MemoryDataset\", \"stats\": null}], \"edges\": [{\"source\": \"cffa5dc2\", \"target\": \"777ad629\"}, {\"source\": \"b1538005\", \"target\": \"cffa5dc2\"}], \"layers\": [], \"tags\": [], \"pipelines\": [{\"id\": \"__default__\", \"name\": \"__default__\"}], \"modular_pipelines\": {\"__root__\": {\"id\": \"__root__\", \"name\": \"__root__\", \"inputs\": [], \"outputs\": [], \"children\": [{\"id\": \"777ad629\", \"type\": \"data\"}, {\"id\": \"cffa5dc2\", \"type\": \"task\"}, {\"id\": \"b1538005\", \"type\": \"data\"}]}}, \"selected_pipeline\": \"__default__\"}, options: {\"display\": {\"expandPipelinesBtn\": false, \"exportBtn\": false, \"globalNavigation\": false, \"labelBtn\": false, \"layerBtn\": false, \"metadataPanel\": false, \"miniMap\": false, \"sidebar\": false, \"zoomToolbar\": false}, \"expandAllPipelines\": false, \"theme\": \"dark\"} }));\n",
" }\n",
" </script>\n",
" </body>\n",
" </html>"
],
"text/plain": [
"\u001b[1m<\u001b[0m\u001b[1;95mIPython.lib.display.IFrame\u001b[0m\u001b[39m object at \u001b[0m\u001b[1;36m0x11cd0aba0\u001b[0m\u001b[1m>\u001b[0m"
"\u001b[1m<\u001b[0m\u001b[1;95mIPython.core.display.HTML\u001b[0m\u001b[39m object\u001b[0m\u001b[1m>\u001b[0m"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"KedroVizNotebook().visualize(pipe)"
"from kedro_viz.launchers.notebook_visualizer import KedroVizNotebook\n",
"KedroVizNotebook().visualize(pipeline=pipe)"
]
},
{
"cell_type": "code",
"execution_count": null,
"id": "b70479cc-ea4e-4a22-8170-96ce67353a8e",
"metadata": {},
"outputs": [],
"source": []
}
],
"metadata": {
"kernelspec": {
"display_name": "kedro-py312",
"display_name": "Python 3 (ipykernel)",
"language": "python",
"name": "python3"
},
Expand Down
3 changes: 3 additions & 0 deletions package/kedro_viz/__init__.py
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,9 @@
import sys
import warnings

# alias to ease Notebook visualization import
from .launchers.notebook_visualizer import NotebookVisualizer

__version__ = "10.1.0"


Expand Down
50 changes: 0 additions & 50 deletions package/kedro_viz/api/apps.py
Original file line number Diff line number Diff line change
Expand Up @@ -48,56 +48,6 @@ async def set_secure_headers(request, call_next):

return app

def create_api_app_for_notebook() -> FastAPI:
"""Create an API app for notebook users without full blown kedro project.
Returns:
The FastAPI app
"""
app = _create_base_api_app()
app.include_router(rest_router)

# Check for html directory existence.
if Path(_HTML_DIR).is_dir():
# The html is needed when kedro_viz is used in cli but not required when running
# frontend e2e tests via Cypress
app.mount("/static", StaticFiles(directory=_HTML_DIR / "static"), name="static")

# every time the server reloads, a new app with a new timestamp will be created.
# this is used as an etag embedded in the frontend for client to use when making requests.
app_etag = _create_etag()

# Serve the favicon.ico file from the "html" directory
@app.get("/favicon.ico", include_in_schema=False)
async def favicon():
return FileResponse(_HTML_DIR / "favicon.ico")

@app.get("/")
async def index():
# static window config
config_script = """
<script>
window.__APP_CONFIG__ = {
onlyChartView: "true",
};
</script>
"""

html_content = (_HTML_DIR / "index.html").read_text(encoding="utf-8")
html_content = html_content.replace("</body>", config_script + "</body>")
response = HTMLResponse(html_content)

# Add custom headers
# response.headers["X-Show-ChartView"] = "True"

# Example headers
# response.headers["X-Show-MainNav"] = "False"
# response.headers["X-Show-MetaData"] = "False"

return response

return app


def create_api_app_from_project(
project_path: Path, autoreload: bool = False
Expand Down
74 changes: 0 additions & 74 deletions package/kedro_viz/launchers/experimental_viz.py

This file was deleted.

72 changes: 72 additions & 0 deletions package/kedro_viz/launchers/notebook_visualizer.py
Original file line number Diff line number Diff line change
@@ -0,0 +1,72 @@
import json
from typing import Any, Dict
from IPython.display import HTML, display
from kedro.io.data_catalog import DataCatalog
from kedro.pipeline import Pipeline
from kedro_viz.api.rest.responses.pipelines import get_kedro_project_json_data
from kedro_viz.server import load_and_populate_data_for_notebook_users
from kedro_viz.utils import NotebookUser, merge_dicts

class NotebookVisualizer:
def show(self, pipeline: Pipeline, catalog: DataCatalog = None, options: Dict[str, Any] = None):
"""
Show the visualization either in a browser or embedded in a notebook.
Args:
pipeline: Kedro Pipeline to visualize
catalog: Data Catalog for the pipeline
host: the host to launch the webserver
port: the port to launch the webserver
embed_in_notebook (bool): Whether to embed the visualization in the notebook.
Raises:
RuntimeError: If the server is not running.
"""
# [TODO: <script src='http://localhost:8000/kedroViz.bundle.js'></script> - This needs publishing to CDN (may be bundle it and publish on npm)]
notebook_user = NotebookUser(pipeline=pipeline, catalog=catalog)
load_and_populate_data_for_notebook_users(notebook_user)
json_to_visualize = json.dumps(get_kedro_project_json_data())

viz_options = {
"display": {
"expandPipelinesBtn": False,
"exportBtn": False,
"globalNavigation": False,
"labelBtn": False,
"layerBtn": False,
"metadataPanel": False,
"miniMap": False,
"sidebar": False,
"zoomToolbar": False,
},
"expandAllPipelines": False,
"theme": "dark"
}

if options:
viz_options = merge_dicts(viz_options, options)

viz_options = json.dumps(viz_options)

html_content = r"""<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='UTF-8'>
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<title>Kedro-Viz</title>
</head>
<body>
<div id='root' style='height: 600px'></div>
<script src='http://localhost:8012/kedroViz.bundle.min.js'></script>
<script>
window.viz_container = document.getElementById('root');
if (window.createRoot) {
window.viz_root = window.createRoot(window.viz_container);
window.viz_root && window.viz_root.render(window.React.createElement(window.KedroViz, { data: """ + json_to_visualize + r""", options: """ + viz_options + r""" }));
}
</script>
</body>
</html>"""

display(HTML(html_content))
10 changes: 3 additions & 7 deletions package/kedro_viz/server.py
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,6 @@ def run_server(
package_name: Optional[str] = None,
extra_params: Optional[Dict[str, Any]] = None,
is_lite: bool = False,
notebook_user: NotebookUser = None
):
"""Run a uvicorn server with a FastAPI app that either launches API response data from a file
or from reading data from a real Kedro project.
Expand Down Expand Up @@ -126,12 +125,7 @@ def run_server(

path = Path(project_path) if project_path else Path.cwd()

if notebook_user:
load_and_populate_data_for_notebook_users(notebook_user)
app = apps.create_api_app_for_notebook()
elif load_file:
app = apps.create_api_app_from_file(f"{path}/{load_file}/api")
else:
if load_file is None:
load_and_populate_data(
path, env, include_hooks, package_name, pipeline_name, extra_params, is_lite
)
Expand All @@ -145,6 +139,8 @@ def run_server(
save_api_responses_to_fs(save_file, fsspec.filesystem("file"), True)

app = apps.create_api_app_from_project(path, autoreload)
else:
app = apps.create_api_app_from_file(f"{path}/{load_file}/api")

uvicorn.run(app, host=host, port=port, log_config=None)

Expand Down
Loading

0 comments on commit 7c264dd

Please sign in to comment.