Search the Community

Gráfico está saindo invertido; com o valor mais alto com a coluna mais baixa que a coluna com o valor menor. Passando o mouse pelas colunas observo que os valores estão corretos. Mas as colunas não ficam desenhadas na altura correta. Se alguém puder ajudar, agradeço. <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> <script type="text/javascript"> google.charts.load('current', {'packages':['corechart', 'bar']}); google.charts.setOnLoadCallback(drawStuff); function drawStuff() { var button = document.getElementById('change-chart'); var chartDiv = document.getElementById('chart_div'); var data = google.visualization.arrayToDataTable([ ['Celulas', 'Pessoas', 'Visitantes'], <?php if (is_array($total_pessoas_reuniao)) { Foreach ($total_pessoas_reuniao as $raw) { $celula = $raw['celula']; $pessoas = $raw['totalpessoas']; $visitantes= $raw['totalVisitantes']; ?> ['<?php echo $celula; ?>','<?php echo $pessoas; ?>','<?php echo $visitantes; ?>'], <?php } } ?> ]); var celulasOptions = { width: 700, height: 450, chart: { title: 'Dados das células', subtitle: 'Dados comparativos das células' }, series: { 0: { axis: 'Pessoas' }, 1: { axis: 'Visitantes' } }, axes: { y: { Pessoas: {label: 'Quantidade de pessoas'}, visitantes: {side: 'right', label: 'Quantidade de visitantes'}, }, }, bar: { groupWidth: '60%' }, legend: { position: "relative" }, backgroundColor: 'white', chartArea: {left:20,top:0,width:'100%',height:'75%'}, }; var classicOptions = { width: 700, series: { 0: {targetAxisIndex: 0}, 1: {targetAxisIndex: 1} }, title: 'Nearby galaxies - distance on the left, brightness on the right', vAxes: { // Adds titles to each axis. 0: {title: 'Quantidade'}, 1: {title: 'pessoas'} } }; function drawCelulasChart() { var celulasChart = new google.charts.Bar(chartDiv); celulasChart.draw(data, google.charts.Bar.convertOptions(celulasOptions)); button.innerText = 'Change to Classic'; button.onclick = drawClassicChart; } function drawClassicChart() { var classicChart = new google.visualization.ColumnChart(chartDiv); classicChart.draw(data, classicOptions); button.innerText = 'Change to Celulas'; button.onclick = drawCelulasChart; } drawCelulasChart(); }; </script> <div id="chart_div" style="padding:10px !important;"></div>

Olá pessoas, estou utilizando o Google Charts, e me venho a necessidade de usar imagem nos gráficos. Alguém já usou, e sabe como fazer?

Pessoal, primeiramente boa tarde! Seguinte, estou utilizando o chartJS para manipular um gráfico, mas estou com um problema, os valores que eu seto no data dele, forjam valores automáticos na temperatura, mas eu queria setar manualmente esses valores da temperatura, alguém sabe como faço para manipular esses dados? (apenas da temperatura). Esse é meu código JS <script> var ctx = document.getElementById('myChart').getContext('2d'); var chart = new Chart(ctx, { // The type of chart we want to create type: 'line', // The data for our dataset data: { labels: ["0", "5", "10", "15", "20", "25", "30", "35","40","45","50","55","60","65","70","75","80","85","90","95","100","105","110","115","120","125","130","135"], datasets: [{ label: "Rampa de temperatura - mostura", backgroundColor: 'transparent', borderColor: '#FFB22B', borderWidth: 3, radius: 5, data: [102, 130, 201, 340,220,150,450,560,670,560,810,150,160,150,105,103,120,110,180,310,410,510,310,110,310,410,510,110,], }] }, // Configuration options go here options: { title:{ display: true, fontSize: 20, text: "RAMPA DE TEMPERATURA" }, labels:{ fontStyle: "bold" }, scales: { xAxes: [{ display: true, scaleLabel: { display: true, labelString: 'Tempo em minutos' } }], yAxes: [{ display: true, scaleLabel: { display: true, labelString: 'Temperatura em ºC' } }] } } }); </script>