MelodieStudio is a package developed in parallel with Melodie, which interacts with the Melodie.Visualizer module and visualizes the simulation results in the browser.

As shown, the visualizer page includes three parts:

• Toolbar
  • Including several components controlling the simulation, saving and loading custom parameter set.
• Parameter Space
  • Listing parameters that affect the model.
  • Customizable in the model-specific visualizer.py file.
• Canvas
  • Web-based visualization components for Grid and Network.
  • Web-based charts, including line chart, bar chart, etc.
  • Customizable in the model-specific visualizer.py file.

Here are two examples - CovidGridContagionVisual and CovidNetworkContagionVisual - using the MelodieStudio package, and they are explained in this document.

pip install MelodieStudio

python -m MelodieStudio

If you are running a visualizer, please start the MelodieStudio in the root path of your ABM project.

npm install

npm run serve

npm run build

python build_web.py # build webpage
python setup.py bdist_wheel # build wheel, and include the webpage.

This project is based on Vue, Element-Plus and Echarts. Besides, the structure of project is based on Vue-Onepiece-Admin.