在Google Sankey Chart上显示下线
Cyr*_*ard 7 google-visualization
我想使用Google Sankey Chart来显示有多少玩家参加了测验,完成了测试,并赢得或失去了测验.我有以下代码:
google.charts.load('current', {'packages':['corechart','sankey']});
google.charts.setOnLoadCallback(drawChart);
//console.log(gameAssets);
function drawChart() {
var sankeydata = new google.visualization.DataTable();
sankeydata.addColumn('string', 'From');
sankeydata.addColumn('string', 'To');
sankeydata.addColumn('number', "Number of Players");
sankeydata.addRows([
[ "Number of Players","Completions", 391 ],
["Completions","Successful Completions",160],
["Number of Players","Exit" ,768],
["Completions","Unsuccessful Completions",231]
]);
// Sets chart options.
var options = {
width: 970,
sankey: {
node: {
width: 4 ,
colors: ['#883b90'],
label: {
fontSize: 14
}
},
link: {
color: { fill: '#f4eee2' }
}
}
};
var sankey_chart = new google.visualization.Sankey(document.getElementById('sankey_basic'));
sankey_chart.draw(sankeydata, options)
}
Run Code Online (Sandbox Code Playgroud)
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="sankey_basic" style="width: 900px; height: 300px;"></div>
Run Code Online (Sandbox Code Playgroud)
我遇到的问题是没有完成测验的玩家(在Sankey图表上显示为"退出")位于最后一列(与成功完成和不成功完成相同的列).我宁愿把它与完成程度放在同一水平上.即使是更好的选择,也可以像google Analytics一样显示下降,红色箭头指向下方,如下所示:
是否可以使用Google Charts？
听起来你正在寻找__CODE__同时迭代所有列表.
google.charts.load('current', {'packages':['corechart','sankey']});
google.charts.setOnLoadCallback(drawChart);
//console.log(gameAssets);
function drawChart() {
var sankeydata = new google.visualization.DataTable();
sankeydata.addColumn('string', 'From');
sankeydata.addColumn('string', 'To');
sankeydata.addColumn('number', "Number of Players");
sankeydata.addRows([
[ "Number of Players","Completions", 391 ],
["Completions","Successful Completions",160],
["Number of Players","Exit" ,768],
["Completions","Unsuccessful Completions",231]
]);
// Sets chart options.
var options = {
width: 970,
sankey: {
node: {
width: 4 ,
colors: ['#883b90'],
label: {
fontSize: 14
}
},
link: {
color: { fill: '#f4eee2' }
}
}
};
var sankey_chart = new google.visualization.Sankey(document.getElementById('sankey_basic'));
sankey_chart.draw(sankeydata, options)
}
Run Code Online (Sandbox Code Playgroud)
归档时间：
查看次数：
582 次
最近记录：
从Google Visualization饼图(核心图表)中删除悬停工具提示 18
标签中的Google图表 - 隐藏标签中的图表大小和位置不正确 9
组织结构图 - 树,在线,动态,可折叠,图片 - 在D3中 7
使用javascript google条形图时如何设置正确的高度 6
如何调试google jsapi可视化核心图本身中发生的JavaScript错误？ 6
Google 图表 - 标签未显示 5
Google图表会调用onmouseover事件 2
如何从Google Scatter Charts选项中获取工具提示值 2
谷歌可视化 - 设置饼图切片颜色 1
使用绑定的Google脚本生成查询对象 0