如果我有一个这样的数据行:
google.charts.load('current', {'packages':['line']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('date', 'Date');
data.addColumn('number', 'User');
data.addRows([
[new Date(), 41],
]);
var options = {
chart: {
title: 'Active Users',
},
width: 900,
height: 500
};
var chart = new google.charts.Line(document.getElementById('linechart_material'));
chart.draw(data, options);
}
如何在这种情况下显示一个点?现在,重点是存在,但没有突出显示。这个问题只出现在材料图表中,而不是经典。
答案 0 :(得分:1)
需要为单行数据设置pointSize
的选项
但是,它是在材料图表上不起作用的几个选项之一 看到这个问题 - > Tracking Issue for Material Chart Feature Parity #2143
相反,建议使用 Core 图表,并使用以下选项...
theme: 'material'
请参阅以下工作代码段...
google.charts.load('current', {
callback: drawChart,
packages:['corechart']
});
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('date', 'Date');
data.addColumn('number', 'User');
data.addRows([
[new Date(), 41],
]);
var options = {
height: 500,
theme: 'material',
title: 'Active Users',
width: 900
};
if (data.getNumberOfRows() === 1) {
options.pointSize = 5;
}
var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>