Use custom svg icon in fancytree

Question

How do I show my SVG icons in fancytree? I am doing something like following:

$("#tree").fancytree({
        activeVisible: true,
        checkbox: true,
        selectMode: 3,
        source: {
            url: "/category/GetCategories",
        },
        lazyLoad: function (event, data) {
            data.result = {
                url: "/category/SubCategories/" + data.node.key
            }
        },
        loadChildren: function (event, data) {
            if (data.node.isSelected()) {
                data.node.visit(function (subNode) {
                // Load all lazy/unloaded child nodes
                // (which will trigger `loadChildren` recursively)
               // subNode.setExpanded();
                if (subNode.isUndefined() && subNode.isExpanded()) {
                    subNode.load();
                }
            });
            }
        },
        postProcess: function (event, data) {
            data.result = data.response.map((v) => { return { title: v.name, selected: v.isShared, key: v.id, lazy: v.hasChildren, folder: true, icon: { html: v.icon } }; });
        }
})

In v.icon I am getting an svg icon. If I define postProcess as following

postProcess: function (event, data) {
            data.result = data.response.map((v) => { return { title: v.name, selected: v.isShared, key: v.id, lazy: v.hasChildren, folder: true, icon: v.icon }; });
        }

it will set the value of src of the img as the svg element. How can I show the svg icons instead of the img tag?

Answer 1

solved it by setting postProcess callback as following:

postProcess: function (event, data) {
            data.result = data.response.map((v) => {
                return {
                    ...
                    icon: { text: v.icon } || true,
                    ...
                }
            });
        },