当前位置:K88软件开发文章中心编程语言JavaScriptJS02 → 文章内容

Highcharts 树状图(Treemap)

减小字体 增大字体 作者:佚名  来源:网上搜集  发布时间:2019-1-11 7:09:25

{            id:





"id_" + region_i,            name:





region,            color:





Highcharts.getOptions().colors[region_i]        };        country_i = 0;        for (var country in data[region]) {            country_p = {                id:





region_p.id + "_" + country_i,                name:





country,                parent:





region_p.id            };            points.push(country_p);            cause_i = 0;            for (var cause in data[region][country]) {                cause_p = {                    id:





country_p.id + "_" + cause_i,                    name:





cause_name[cause],                    parent:





country_p.id,                    value:





Math.round(+data[region][country][cause])                };                region_val += cause_p.value;                points.push(cause_p);                cause_i++;            }            country_i++;        }        region_p.value = Math.round(region_val / country_i);        points.push(region_p);        region_i++;    } var chart = { renderTo:





'container' }; var title = { text:





'Global Mortality Rate 2012, per 100 000 population' }; var subtitle:





{ text:





'Click points to drill down. Source:





<a href="http:





//apps.who.int/gho/data/node.main.12?lang=en">WHO</a>.' }; var series = [{ type:





"treemap", layoutAlgorithm:





'squarified', allowDrillToNode:





true, dataLabels:





{ enabled:





false }, levelIsConstant:





false, levels:





[{ level:





1, dataLabels:





{ enabled:





true }, borderWidth:





3 }], data:





points }]; var json = {}; json.title = title; json.series = series; $('





#container').highcharts(json);});</script></body></html>尝试一下 ?以上实例输出结果为:

上一页  [1] [2] 


Highcharts 树状图(Treemap)