Выбор данных для графика по клику google charts

252
26 апреля 2018, 09:54

Вот есть код: https://jsfiddle.net/3eygq8vf/1/

google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Team');
data.addColumn('date', 'asd');
data.addColumn({type: 'string', role: 'tooltip','p': {'html': true}});

data.addRows([
['Spartak', new Date(2010,05,25),createCustomHTMLContent('Spartak','Simferopol','Kapitolij')],
['Oreanda', new Date(2010,06,10),createCustomHTMLContent('Oreanda','Yalta',1)],
['Effekt', new Date(2010,06,24),createCustomHTMLContent('Effekt','Chernovcy',1)],
['Spartak', new Date(2010,07,24),createCustomHTMLContent('Spartak','Simferopol','Forum')],
['Lukomore',new Date(2010,09,15),createCustomHTMLContent('Lukomore','Mariupol','Big')],
['Adrenalin City',new Date(2010,12,06),createCustomHTMLContent('Adrenalin City','Luck','Red')],
['Raketa', new Date(2010,12,16),createCustomHTMLContent('Raketa','Evpatoriya','Mars')],
['Bajda 3D', new Date(2010,12,28),createCustomHTMLContent('Bajda 3D','Zaporozhe','Big')]
]);
var options = {
legend: {position: 'none'},
height: 450,
lineWidth:4,
lineDashStyle:[15,2,3,3],
pointSize:10,
colors:['#af0000'],
tooltip: {isHtml: true},
hAxis:{
textStyle : {
fontSize: 14 // or the number you want
 }
},
vAxis:{
textStyle : {
fontSize: 14,
}
}
};
var chart = new google.visualization.ScatterChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
function createCustomHTMLContent(name,city, hall) {
return '<div>' +
'<br/>' +
'<table class="medals_layout" style="font-family:DINPro">' + '<tr>' +
'<td><b>Name: </b>' + name + '</td>'+ '</tr>' + '<tr>' +
'<td><b>City: </b>' + city + '</td>' + '</tr>' + '<tr>' +
'<td><b>Hall: </b>' + hall + '</td>' + '</tr>'+ '</table>' + '</div>';
} 

Как сделать что-бы при клике по выбранному году появлялся нужный график, и каким образом менять эти данные.

READ ALSO
Как сделать слайдер для партнеров

Как сделать слайдер для партнеров

Что бы был адаптивный, с бесконечной и непрерывной прокруткой, для партнеровпример вот:

168
передача json в переменную с помощью axios

передача json в переменную с помощью axios

Нужно получить с сервера json-файл и записать эти данные в переменную

129
Замены в строке [дубликат]

Замены в строке [дубликат]

На данный вопрос уже ответили:

126