我想更改我的图例,我必须删除分页并将所有标题放在一两行中。我想更改图标。
现在是这个样子
我想要这样的东西
我输入了 scrollArrows: 'none' 但它不起作用。 这是我在 Controller 中的代码:
var optionsMobile = {
width: '100%',
height: '100%',
pointSize: 5,
series: {
pointShape: 'circle'
},
chartArea: {
width: '80%',
height: '70%'
},
legend: {
position: 'bottom',
textStyle: {
color: 'white'
},
pagingTextStyle: { color: '#666' },
scrollArrows: 'none'
},
backgroundColor: 'transparent',
titleTextStyle: {
color: 'white',
height: "40px"
},
hAxis: {
textStyle: {
color: 'white'
}
},
vAxis: {
textStyle: {
color: 'white'
}
},
};
最佳答案
根据configuration options ...
Set
legend.maxLines
to a number greater than one to add lines to your legend.
This option currently works only withlegend.position: 'top'
Note: The exact logic used to determine the actual number of lines rendered is still in flux.
var options = {
legend: {
maxLines: 2,
position: 'top'
}
};
请参阅以下工作片段...
google.charts.load('current', {
packages: ['corechart']
}).then(function () {
var data = google.visualization.arrayToDataTable([
['x', 'NYCLS 2016 Boys', 'NYCLS 2016 Girls', 'NYCLS 2017 Boys', 'NYCLS 2017 Girls'],
[1, 10, 15, 20, 25],
[2, 12, 18, 24, 30],
[3, 14, 21, 28, 35],
[4, 16, 24, 32, 40]
]);
var options = {
legend: {
maxLines: 2,
position: 'top'
},
width: 360
};
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>
关于javascript - 谷歌图表 - 图例,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46724606/