CodeCharta

a tool to help you visualize and understand code in 3D.

Latest Release:
Analysis 1.127.0 | Visualization 1.128.0

Key Features • How To Use • Feedback • Further Info • About

Key Features

CodeCharta Visualization:
- CC visualizes code bases as 3D cities, so that you can understand it - view the Web Demo.
- It uses code metrics from .cc.json files.
- The imported files are validated using JSON Schema as defined in generatedSchema.json.
- You can change the way the file is displayed and save and later load it as a Custom View.
CodeCharta Analysis:
- CC Analysis is used to calculate or to import metrics from third party tools for a code base.
- It generates .cc.json files for CC Visualization through a Command-Line-Tool.
- It includes some pre-defined importers for e.g. SonarQube, SourceMonitor, Git, generic CSV data
- It also includes commands to validate and merge multiple .cc.json files.

Requirements

For using CodeCharta the following needs to be installed on your system:

Node >= 20
Java >= 11, <= 21

How To Use

How to use Visualization?

Online: You can try the web visualization without any installation and explore the CodeCharta code (shown by default).
Local: See here.

How to use Analysis?

Analysis is split into different parsers that generate .cc.json files. To run these parsers you need the CodeCharta Shell.

In this example we will generate a .cc.json from JUnit4 using the Source Code Parser (that parses java projects).

# Install codecharta-analysis globally
$ npm i -g codecharta-analysis
# Clone the junit4 repository
$ git clone https://github.com/junit-team/junit4
# Parse sources with CodeCharta Shell
$ ccsh sourcecodeparser junit4 -p junit4 -o junit4.source.cc.json
# Now you can upload `junit4.source.cc.json` to CodeCharta Visualization

Note If you want to be guided through selecting the arguments. Just execute ccsh and you can run the parsers interactively with dialogs.

Feedback

Have a bug, a feature request or any question? Please open a new issue. Feedback is always welcome.

Want to have even more information? Please check our documentation and news.

MaibornWolff/codecharta