Your browser does not support modern CSS

This page will be displayed incorrectly. We recommend using a more recent browser.

Note that yFiles for HTML itself does not rely on these features.

5 to 10 minutes

First-time setup

In the Developer’s Guide, Getting Started offers an in-depth explanation of the following steps.

Prerequisites

The demos need an installed Node.js to run properly.

Running the demos locally

To run the demos locally, a demo server has to be started.

  • or run the start_demos script in the yFiles-for-HTML-Complete-2.4.0.5-Evaluation directory:
    Run the start_demos script in the yFiles-for-HTML-Complete-2.4.0.5-Evaluation directory:
    • start_demos.cmd (Windows)
    • start_demos.sh (Linux)
    • start_demos.command (MacOS)
  • Open the demos
    You can explore them at /demos-ts or /demos.

Troubleshooting

I can't run the start_demos script
Try to start the demos manually. First install the required libraries using npm install in the demo directory, then run the demos with npm start.
WebStorm says 'Port 4242 already in use'
The demo server is already running. You can cancel this script with CTRL+C inside Webstorm's terminal. Then browse the demos on the demo page.
My changes in TypeScript are not visible
After changing the TypeScript files you need to run the TypeScript compiler tsc. To automatically compile the code, start a watch task with npm run watch.
I get a license error when I start a demo
Make sure the license is located in <yfiles-directory>/lib and its version matches the library version. A non-evaluation license cannot be used to activate an evaluation version of yFiles for HTML and vice versa.
I get an error that the yfiles-*.tgz file is missing
Try running the start_demos script or npm install in the top-level directory. Alternatively, you can create the .tgz files manually by running npm pack in the respective lib/es-modules or lib/umd directories.
Support Request

Working with yFiles

  • Install an IDE
    We recommend WebStorm (30 days free). You can also use Visual Studio Code as a free alternative.
  • Open the project
    Open the yFiles-for-HTML-Complete-2.4.0.5-Evaluation directory as project in your IDE.
    WebStorm will automatically start the demo server in the background. So you don't have to start the server manually each time.
  • Modify the demo code and observe changes
    If you refresh the demos in the browser, changes in the source code will be visible. Tutorials are served just like regular demos, you will find their sources at:
    TypeScript icon demos-ts/01-tutorial-getting-started
    JavaScript icon demos/01-tutorial-getting-started