Question

function test()
{
$array['cols'][] = array('type' => 'string');
$array['cols'][] = array('type' => 'string');
$array['cols'][] = array('type' => 'string');

$array['rows'][] = array('c' => array( array('v'=>'Name'), array('v'=>22)) );
$array['rows'][] = array('c' => array( array('v'=>'Name1'), array('v'=>26)));
$array['rows'][] = array('c' => array( array('v'=>'Name2'), array('v'=>12)));

return $array;
}
print json_encode(test());

我使用上面的代码来构建使用谷歌图表的组织结构图。我想用名字添加图像和名称。你能告诉我如何修改代码。

Answer 1

我试图解决你的问题。

我们可以使用 {allowHtml：true} 在Google图表中嵌入和处理HTML代码。

function drawChart() {
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Name');
    data.addColumn('string', 'Parent');

    data.addRows([
        [{
            v: 'parent_node',
            f: 'Parent Node'
        },
        null],
        [{
            v: 'child_node_1',
            f: '<b>Child Node</b> <img src="http://www.mapsysinc.com/wp-content/uploads/2013/08/oracle-logo.gif" height="42" width="50"> </img>'
        }, 'parent_node'],
        [{
            v: 'child_node_2',
            f: 'Child Node'
        }, 'parent_node']
    ]);

    var chart = new google.visualization.OrgChart(document.querySelector('#chart_div'));
    chart.draw(data, {
        allowHtml: true
    });
}
google.load('visualization', '1', {
    packages: ['orgchart'],
    callback: drawChart
});

我在这里创建了示例请检查它：https://jsfiddle.net/1gvwLy8n/5/

如何在谷歌图表中添加图像

1 个答案: