1
這是當我創建一個與谷歌可視化庫可視化持續惡化:谷歌可視化沒有使用全部空間(曾經)
有左邊一個很好的75個像素至少和這個圖的右邊,再加上另一個30-40的頂部和底部。沒有理由,餡餅本身不可能更大,當我提供足夠的空間時,沒有理由讓右邊的傳說被包裝。
我該如何解決這個問題?
這是當我創建一個與谷歌可視化庫可視化持續惡化:谷歌可視化沒有使用全部空間(曾經)
有左邊一個很好的75個像素至少和這個圖的右邊,再加上另一個30-40的頂部和底部。沒有理由,餡餅本身不可能更大,當我提供足夠的空間時,沒有理由讓右邊的傳說被包裝。
我該如何解決這個問題?
PieChart
是最糟糕的上漿
,但你可以使用選項進行微調 - >chartArea
看到下面的工作片斷......
與調整
google.charts.load('current', {
callback: drawChart,
packages: ['corechart']
});
function drawChart() {
var data = google.visualization.arrayToDataTable([
['cateory', 'value'],
['1 - snail mail', 100],
['2 - de-elevatd', 200],
['3 - default', 900],
['4 high', 100],
]);
var chart = new google.visualization.PieChart(document.getElementById('chart'));
chart.draw(data, {
chartArea: {
height: '100%',
width: '100%',
// prevent highlight color of slice from being cutoff on hover
top: 8,
bottom: 8
}
});
}
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart"></div>
無需調整
google.charts.load('current', {
callback: drawChart,
packages: ['corechart']
});
function drawChart() {
var data = google.visualization.arrayToDataTable([
['cateory', 'value'],
['1 - snail mail', 100],
['2 - de-elevatd', 200],
['3 - default', 900],
['4 high', 100],
]);
var chart = new google.visualization.PieChart(document.getElementById('chart'));
chart.draw(data);
}
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart"></div>