2016-02-24 8 views
1

Мне нужно установить высоту диаграммы столбца google с помощью карты google. отображая график по человеческим отношениям. я мог бы отличить категорию мужчин и женщин. но население мудрым должно варьировать высоту графика.set google column chart height с google map

var data = google.visualization.arrayToDataTable([ 
[ '村名', '男性',{ role: "style" }, '女性', { role: "style" } ], 
[関本村,3,2], 
[下長竹村,152,70], 
[中里村,30,35], 
[永塚村,3,2], 
[落幡村,7,1], 
[関本村,3,2], 
]); 
var options = { 
     width:300, 
     height:200, 
     backgroundColor: 'transparent', 
     colors: ['#58ACFA','#FFC0CB'], 
     legend: {position: 'none', textStyle: {color: 'white', fontSize: 12}}, 
     bar: { groupWidth: '5%' }, 
     baselineColor: 'transparent', 
     vAxis: { gridlines: { count: 0, color: 'transparent' }, }, 
     hAxis: { textPosition: 'bottom',textStyle: {color: 'white', fontSize: 15}}, 
     isStacked: true, 
    }; 

высота: 200 показывает высоту диаграммы так же.

enter image description here

должны отображать различную высоту каждого графика .. любую идею ??

+0

легче было бы дать ответ с рабочим примером что у вас есть сейчас, по крайней мере, некоторые образцы данных - но мне кажется, что высота может быть рассчитана по данным для всех диаграмм - до их рисования ... – WhiteHat

+0

вопрос отредактирован с данными примера – VJS

ответ

1

Похоже, вам нужно рассчитать относительный размер, основанный на совокупности каждой строки.

Вы можете использовать средневзвешенное значение, а затем умножить его на некоторый общий размер всех диаграмм.

Здесь я использую 500. Однако вы заметите большое несоответствие между числами min и max. Не уверен, насколько хорошо получится диаграмма, высота 8 пикселей ...

Возможно, вы можете использовать какой-то множитель, чтобы приблизить их. Просто хотел, чтобы продемонстрировать возможность ...

google.charts.load('current', { 
 
    packages: ['corechart'], 
 
    callback: drawChart 
 
}); 
 

 
function drawChart() { 
 
    var popSize; 
 
    var sizeArray = []; 
 
    var showResult; 
 
    var tempDiv; 
 
    var totalSize = 500; 
 
    var total = 0; 
 

 
    var data = google.visualization.arrayToDataTable([ 
 
    ['??', '??','??'], 
 
    ['???',3,2], 
 
    ['????',152,70], 
 
    ['???',30,35], 
 
    ['???',3,2], 
 
    ['???',7,1], 
 
    ['???',3,2], 
 
    ]); 
 

 

 
    for (var i = 0; i < data.getNumberOfRows(); i++) { 
 
    popSize = data.getValue(i, 1) + data.getValue(i, 2); 
 
    sizeArray.push(popSize); 
 
    total += popSize; 
 
    } 
 

 
    showResult = document.getElementById('displaySizes'); 
 
    for (var i = 0; i < sizeArray.length; i++) { 
 
    sizeArray[i] = (sizeArray[i]/total) * totalSize; 
 
                
 
    // example purposes only 
 
    tempDiv = showResult.appendChild(document.createElement('DIV')); 
 
    tempDiv.innerHTML = sizeArray[i].toFixed(2); 
 
    } 
 
}
<script src="https://www.gstatic.com/charts/loader.js"></script> 
 
<div id="displaySizes"></div>

затем использовать sizeArray в ваших вариантов ...

var options = { 
    width: 300, 
    height: sizeArray[i], 
    ... 
+0

pr Имитивный пример, надеюсь, что это поможет ... – WhiteHat

Смежные вопросы