3D CODE MAP

Program Analysis tool for bug detection. It is a vscode extension which can be installed into Vscode 1.43.0 at least.

After the program is compiled by analysis, it is used to display the analysis node information.

Architecture Overview

Dev Instructions

• Clone WebSVF repository
• Run cd ./WebSVF/src/codemap_extension
• Run yarn
• Run yarn go for build or F5 for debug

If you want to make VSIX install file, make sure install vsce tools.

• Install vsce
• Run vsce package

User Instructions

Installation

1. Download extension: VSIX file and TEST zip

VSIX file is vscdoe extension. TEST zip for extension testing.

2. Extension installation

Through this picture show to install extension. and then unzip TEST.zip. Use vscode open TEST work folder.

3. Installed situation

After 30 seconds installation, you can see the 3D CODE MAP logo at below left.

3D CODE MAP

1. Vscode open a C/C++ project

Require Folder and Files [How to generate them]

• C/C++ Project in VSCODE WORKSPACE
• 3D_CODE_GRAPH as folder in VSCODE WORKSPACE
• control_flow_graph.json in 3D_CODE_GRAPH
• value_flow_graph.json in 3D_CODE_GRAPH

You can try to use TEST.zip to unzip and open it for test or read [How to generate them] to build them for real project.

As you see, 3D_CODE_GRAPH is needed to store control graph and value follow graph.

2. Click statusbar to show 3D CODE MAP

Trying to click on the button at the bottom left to run or stop.

After a while time to wait all function load. if always loading, you can cancel it by [X] close the page.

It will show the red block when all function stopped or show blue block when code map running.

After click to make it work, it will show like this.

Control Graph

1. Show CFG or VFG

Click the CFG or VFG button will show the two graph.

2. Show node label

Hover over any node will show the label.

3. Jump to line

Right Click node will jump to the code line.

4. Show all label

Click NODE ID MODE button will show all label on node.

• Ps: If you want use this function, Please make sure you PC or MAC have 4 cores and 4GB memory at least. More nodes or lines you have, more cores and memory you need. Be careful :)

5. Highlight Node and Jump to code line

If the node info show the fileName and lineNumber, Click the node will jump into the code line.

6. Show code line nodes

active one or more code line and input:

Window or Linux: ctrl + alt + l

MAC: cmd + opt/alt + l

It will show the all the code line nodes. if there is no highlight there. it means there is no node link the code line.

7. Camera Positioning

If you have highlight node there. you can use:

Window or Linux: ctrl + alt + j or ctrl + alt + k

MAC: cmd + opt/alt + -> or cmd + opt/alt + <-

It will make camera find the highlight node position.