Гиперссылки в объектах d3.js - программирование

Я полный новичок в d3.js или java в целом. Я использую пример с отступом дерева из http://bl.ocks.org/1093025. Мне потребовалось два часа, чтобы заставить это работать на моем локальном компьютере, чтобы дать вам представление о моем уровне мастерства.

Я открыл файл flare.json и начал возиться с ним и смог успешно его обработать. Похоже на это

{
    "name": "Test D3",
    "children": [
        {
            "name": "News",
            "children": [
                {
                    "name": "CNN",
                    "size": 1000
                },
                {
                    "name": "BBC",
                    "size": 3812
                }
            ]
        },
        {
            "name": "Blogs",
            "children": [
                {
                    "name": "Engaget",
                    "size": 3938
                }
            ]
        },
        {
            "name": "Search",
            "children": [
                {
                    "name": "Google",
                    "size": 3938
                },
                {
                    "name": "Bing",
                    "size": 3938
                }
            ]
        }
    ]
}

Что я хочу сделать сейчас, это попытаться добавить гиперссылки. Например, я хочу, чтобы можно было нажать "CNN" и перейти на CNN.com. Есть ли модификация, которую я могу сделать для flare.json, который это сделает?

"children": [ { "name": "Google", "size": 3938, "url": "https://www.google.com" }, { "name": "Bing", "size": 3938, "url": "http://www.bing.com" } ]

nodeEnter.append("svg:a") .attr("xlink:href", function(d){return d.url;}) // <-- reading the new "url" property .append("svg:rect") .attr("y", -barHeight / 2) .attr("height", barHeight) .attr("width", barWidth) .style("fill", color) .on("click", click); // <- remove this if you like

Ответ 1