Я хочу заполнить эту карту карт google городами из db и количеством пользователей из каждого города.
Для этого я использовал следующий код:
<?
$query_city_users = "SELECT DISTINCT(city) FROM users
WHERE approved = 1";
$city_users = mysql_query($query_city_users, $con) or die(mysql_error());
while ($row_city_users = mysql_fetch_assoc($city_users)) {
$query_users_from_city = "SELECT * FROM users
WHERE approved = 1
AND city= '".$row_city_users['city']."'";
$users_from_city = mysql_query($query_users_from_city, $con) or die(mysql_error());
$totalRows_users_from_city = mysql_num_rows($users_from_city);
?>
<?=$row_city_users['city'] ?> -
<?=$totalRows_users_from_city ?> <br>
В PHP это нормально работает... это перекликается со списком городов и количеством пользователей в каждом городе. Возникающая проблема связана с тем, что в моем сценарии Charts Script заполняются данные из вышеперечисленных запросов.
<!------ MAP CHARTS------->
<script type='text/javascript' src='https://www.google.com/jsapi'></script>
<script type='text/javascript'>
google.load('visualization', '1', {'packages': ['geochart']});
google.setOnLoadCallback(drawMarkersMap);
function drawMarkersMap() {
var data = google.visualization.arrayToDataTable([
['City', 'Users Number'],
['<?=$row_city_users['city'] ?>', '<?=$totalRows_users_from_city ?>']
]);
var options = {
region: 'IT',
displayMode: 'markers',
colorAxis: {colors: ['lightblue', 'blue'],
backgroundColor: 'blue',
keepAspectRatio: 'true',
}
};
var chart = new google.visualization.GeoChart(document.getElementById('italy'));
chart.draw(data, options);
};
</script>
<? } // end while ?>
Используя этот код, карта выводит только один город из массива... Я знаю, что я пропустил что-то в коде, поэтому, пожалуйста, помогите... Мой вопрос будет состоять в том, как правильно заполнить диаграмму google массивами, которые я запросил?
PS. Я прочитал связанные вопросы о stackoverflow, но они не помогли мне в этом случае.
Это связано с тем, что ваш объект диаграммы создается каждый раз в пределах цикла. Вы можете переместить следующий код из цикла как
var rawData = [['City', 'Users Number']];
var options = {
region: 'IT',
displayMode: 'markers',
colorAxis: {colors: ['lightblue', 'blue'],
backgroundColor: 'blue',
keepAspectRatio: 'true',
}
Затем замените функцию drawMarkersMap на
function drawMarkersMap() {
rawData.push(['<?=$row_city_users['city'] ?>', '<?=$totalRows_users_from_city ?>']);
};
Затем снова за пределами цикла вы должны использовать
var data = google.visualization.arrayToDataTable(rawData);
var chart = new google.visualization.GeoChart(document.getElementById('italy'));
chart.draw(data, options);
Поддерживайте порядок кода. Возможно, вам придется исправить некоторые незначительные ошибки, поскольку у меня нет данных для тестирования