Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>feature-mapNew to Visual Studio Code? Get it now.
feature-map

feature-map

Md Kamruzzaman

|
134 installs
| (1) | Free
feature map for application
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Feature-map README

When developing software, it is important to create a feature map that outlines how each feature affects the others. This ensures that the software remains stable and doesn't break during development.

Features

You can configure both the feature names and their child features in order to establish connections between different parts of your software. For instance, if you open a JSON file and right-click on it, you may see a "Feature Map" option in the menu. By clicking on it, you will be able to view a chart that visually represents the relationships between various features and their sub-features.

For example: Open a json file and right click on it you will see a Feature Map show menu click on it it will show you a chard of your writing relation.

run

diagram

Json file formate Example : 1 (Single Json)

[
    {
        "id": 100,
        "label": "Task manager.\n Different user can crete there task\n and can also assign to other",
        "shape": "box",
        "children": [
            {
                "id": 101,
                "label": "Create Task"
            },
            {
                "id": 102,
                "label": "Delete Task",
                "shape": "triangle",
                "to": [
                    {
                        "to": 303,
                        "font": {
                            "multi": true
                        },
                        "label": "Notify <b>Assignee user</b>"
                    }
                ]
            },
            {
                "id": 103,
                "label": "Update Task",
                "to": [
                    {
                        "to": 303,
                        "font": {
                            "multi": true
                        },
                        "label": "Notify <b>Assignee user</b>"
                    },
                    {
                        "to": 302,
                        "font": {
                            "multi": true
                        },
                        "label": "Notify <b>Assignee user</b>"
                    }
                ]
            }
        ],
        "to": [
            {
                "to": 300,
                "font": {
                    "multi": true
                },
                "label": "Notify <b>All</b>"
            },
            3
        ]
    },
    {
        "id": 200,
        "label": "Calender manager.\n Different user can crete there event\n and can also assign to other",
        "children": [
            {
                "id": 201,
                "label": "Create Event",
                "to": [
                    {
                        "to": 101,
                        "font": {
                            "multi": true
                        },
                        "label": "Create <b>Task</b>"
                    },
                    300
                ]
            },
            {
                "id": 202,
                "label": "Delete Event",
                "to": [
                    301,
                    302
                ]
            },
            {
                "id": 203,
                "label": "Update Event",
                "to": [
                    301,
                    302
                ]
            }
        ],
        "to": [
            {
                "to": 100,
                "label": "Has relation"
            }
        ]
    },
    {
        "id": 300,
        "label": "Notification",
        "shape": "triangleDown",
        "children": [
            {
                "id": 301,
                "label": "Mail"
            },
            {
                "id": 302,
                "label": "SMS"
            },
            {
                "id": 303,
                "label": "Portal"
            }
        ]
    }
]

Json file formate Example : 2 (Multiple Json)

features.json

{
    "FeaturesFiles":[
        "Untitled-2-1.json",
        "Untitled-2-2.json",
        "Untitled-2-3.json"
    ]
}

Untitled-2-1.json

{
    "id": 100,
    "label": "Task manager.\n Different user can crete there task\n and can also assign to other",
    "shape": "box",
    "children": [
        {
            "id": 101,
            "label": "Create Task"
        },
        {
            "id": 102,
            "label": "Delete Task",
            "shape": "triangle",
            "to": [
                {
                    "to": 303,
                    "font": {
                        "multi": true
                    },
                    "label": "Notify <b>Assignee user</b>"
                }
            ]
        },
        {
            "id": 103,
            "label": "Update Task",
            "to": [
                {
                    "to": 303,
                    "font": {
                        "multi": true
                    },
                    "label": "Notify <b>Assignee user</b>"
                },
                {
                    "to": 302,
                    "font": {
                        "multi": true
                    },
                    "label": "Notify <b>Assignee user</b>"
                }
            ]
        }
    ],
    "to": [
        {
            "to": 300,
            "font": {
                "multi": true
            },
            "label": "Notify <b>All</b>"
        },
        3
    ]
}

Untitled-2-2.json

{
    "id": 200,
    "label": "Calender manager.\n Different user can crete there event\n and can also assign to other",
    "children": [
        {
            "id": 201,
            "label": "Create Event",
            "to": [
                {
                    "to": 101,
                    "font": {
                        "multi": true
                    },
                    "label": "Create <b>Task</b>"
                },
                300
            ]
        },
        {
            "id": 202,
            "label": "Delete Event",
            "to": [
                301,
                302
            ]
        },
        {
            "id": 203,
            "label": "Update Event",
            "to": [
                301,
                302
            ]
        }
    ],
    "to": [
        {
            "to": 100,
            "label": "Has relation"
        }
    ]
}

Untitled-2-3.json

{
    "id": 300,
    "label": "Notification",
    "shape": "triangleDown",
    "children": [
        {
            "id": 301,
            "label": "Mail"
        },
        {
            "id": 302,
            "label": "SMS"
        },
        {
            "id": 303,
            "label": "Portal"
        }
    ]
}

Right click on file features.json and select Feature Map show

Shape names

circle, ellipse, database, box, diamond, dot, square, triangle, triangleDown, text, star, hexagon, circle

Release Notes

Multiple json file support

1.2.1

Update documentation

1.2.0

Multiple json file support

1.1.1

Bug fix

1.1.0

Position save and reload

1.0.0

Show relation among other feature, Drag option


Enjoy!

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft