Visualise your Kedro data pipelines.
Kedro-Viz shows you how your Kedro data pipelines are structured.
With Kedro-Viz you can:
For in-depth development and usage notes, see the Contribution Guidelines.
It's likely that Kedro-Viz>=3.8.0 will not work with projects created with older versions of Kedro<=0.16.6. Please migrate your project to Kedro>=0.17.0 before installation of the latest version of Kedro-Viz.
Kedro-Viz is available as a Python plugin named
The following conditions must be true in order to visualise your pipeline:
To install it:
pip install kedro-viz
This will install
kedroas a dependency, and add
kedro vizas an additional CLI command.
To visualise your pipeline, go to your project root directory and install the project-specific dependencies by running:
This will install the dependencies specified in
requirements.txtin your Kedro environment (see the Kedro documentation for how to set up your Python virtual environment).
Finally, run the following command from the project directory to visualise your pipeline:
This command will run kedro_viz.server on
http://127.0.0.1:4141/which cannot be accessed from another machine.
Kedro-Viz has a number of options to customise running the visualisation: | CLI command | Description | | ----------- | ----------- | |
--host| Host that viz will listen to. Defaults to 127.0.0.1. | |
--port| TCP port that viz will listen to. Defaults to 4141. | |
--browser/--no-browser| Whether to open viz interface in the default browser or not. | |
--load-file| Path to load the pipeline JSON file | |
--save-file| Path to save the pipeline JSON file | |
--pipeline| Name of the modular pipeline to visualise. If not set, the default pipeline is visualised. | |
-e| Kedro configuration environment. If not specified, catalog config in
localwill be used. |
Kedro-Viz is also available as an npm package named @quantumblack/kedro-viz. To install it:
npm install @quantumblack/kedro-viz
Then include it in your React application:
import KedroViz from '@quantumblack/kedro-viz';
const MyApp = () => ;
npm run buildto generate a production build as a full-page app. The built app will be placed in the
/builddirectory. Data for the chart should be placed in
/public/api/mainbecause this directory is marked
Kedro-Viz can be used as a React component that can be imported into other applications. Publishing the package will run
npm run lib, which compiles the source code in
/src, and places it in the
The React component exposes props that can be used to supply data and customise its behaviour. For information about the props, their expected prop-types and default values, see /src/components/app/index.js. For examples of the expected data input format, see the mock data examples in /src/utils/data, and compare the resulting demo.
The following flags are available to toggle experimental features:
oldgraph- From release v3.8.0. Display old version of graph (dagre algorithm) without improved graphing algorithm. (default
lazy- From release v3.8.0. Improved sidebar performance. (default
Note that newgraph has been removed from v3.8.0 onwards and is now the default functionality. Should there be issues with your project, see the oldgraph flag above.
To enable or disable a flagged feature, add the flag as a parameter with the value
falseto the end of the URL in your browser when running Kedro-Viz, e.g.
The setting you provide persists for all sessions on your machine, until you change it.
Kedro-Viz will log a message in your browser's developer console regarding the available flags and their values as currently set on your machine.
Kedro-Viz is licensed under the Apache 2.0 License.