html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function () {

​

    // create data

    var data = [

      {from: "Solar Energy", to: "Shading",  weight: 10, custom_field: "info 1"},

      {from: "Shading",      to: null,       weight: 7,  custom_field: "info 2"},

      {from: "Shading",      to: "Facade",   weight: 3,  custom_field: "info 3"},

      {from: "Facade",       to: null,       weight: 2,  custom_field: "info 4"},

      {from: "Facade",       to: "Interior", weight: 1,  custom_field: "info 5"}

    ];

​

    // create a chart and set the data

    var chart = anychart.sankey(data);

​

    // set the width of nodes

    chart.nodeWidth("50%");

​

    // configure labels

    chart.node().labels().useHtml(true);

    chart.node().labels().format(

      "<span style='font-weight:bold'>{%name}</span><br>{%value}"

    );

    chart.flow().hovered().labels().enabled(false);

    chart.dropoff().normal().labels().enabled(true);

    chart.dropoff().labels().padding(10);

​

    // configure tooltips

    chart.node().tooltip().format("value: {%value}");

    chart.flow().tooltip().format("value: {%value}\n\n{%custom_field}");

    chart.dropoff().tooltip().format("value: {%value}\n\n{%custom_field}");

​

    // configure the chart title

    chart.title("Sankey Diagram: Labels and Tooltips (Tokens)");

​

    // set the container id

    chart.container("container");

​

    // initiate drawing the chart

    chart.draw();

});