[visualization-api] Re: How to have the Y axis labels show both Celsius and Fahrenheit in a line chart

['Ray Thomas' via Google Visualization API]

This does not work as I thought it might. I used:

<script type="text/javascript">
      // Load Charts and the corechart and barchart packages.
      google.charts.load('current', {'packages':['corechart']});

      // Draw the pie chart and bar chart when Charts is loaded.
      google.charts.setOnLoadCallback(drawChart);

      function drawChart() {

var queryString = encodeURIComponent('SELECT A,B ORDER BY A');
   var query = new 
google.visualization.Query('https://docs.google.com/spreadsheets/d/1tswaWUAbeBijHq4o505w0h7TmbD-qGhR3jBactcbGq0/gviz/tq?gid=464392919&headers=1&tq='
 
+ queryString);
   query.send(handleQueryResponse);
}
     
function handleQueryResponse(response) {
   if (response.isError()) {
   alert('Error in query: ' + response.getMessage() + ' ' + 
response.getDetailedMessage());
   return;
}
  
var data = response.getDataTable();

// Set the column label properly for Fahrenheit
data.setColumnLabel(1, "Fahrenheit");
// Create a new column to hold the Celcius values
data.addColumn("number", "Celcius");
// Get the number of rows in the data
var totalRows= data.getNumberOfRows();
    
for (i = 0; i < totalRows; i++) { 
    fTemp = data.getValue(i,1);
    cTemp = (fTemp - 32) * 0.5556;
    data.setCell(i, 2, cTemp); 
}

var options = {
    series: {
          0: {targetAxisIndex: 0},
          1: {targetAxisIndex: 1}
        },
    vAxes: {
          // Adds titles to each axis.
          0: {title: 'Temp: Fahrenheit'},
          1: {title: 'Temp: Celcius'}
        },
};

var Chart = new 
google.visualization.LineChart(document.getElementById('chart-div'));
Chart.draw(data, options);
}
</script>

And what that gives is:

[image: charts-conversion.jpg]

Almost there, but not good enough. 

I expected the charts to line up with each other but they don't. I will 
have another look at this later, if it works it would be so useful for 
other applications, mph to km/h and so on.
On Friday, December 16, 2022 at 10:30:19 PM UTC-5 Ray Thomas wrote:

> I don't think you can do exactly what you want to do because the scale and 
> grid markers are calculated by the API.
>
> But what you could do is add a calculated column either in the original 
> data or create it before the API processes the data, that contains 
> the fahrenheit values and display that on the right hand side. See the help 
> for series and vAxes at 
> https://developers.google.com/chart/interactive/docs/gallery/linechart?csw=1#dual-y-charts
>  
> and the JSFiddle at https://jsfiddle.net/api/post/library/pure/
>
> Something else you can do is add both values to the tooltips. The help for 
> customizing the tooltips is at 
> https://developers.google.com/chart/interactive/docs/customizing_tooltip_content
>
>
>
>
>
> On Wednesday, December 14, 2022 at 9:39:49 PM UTC-5 gabrield...@gmail.com 
> wrote:
>
>> I'm using the line chart and having some trouble formatting the y-axis 
>> grid markers. The data provided is stored in Celsius, but I'd like the 
>> labels on the left to also show Fahrenheit. For example one of the markers 
>> is showing 22, but I'd like it to show something like 22 / 71.6. This is my 
>> first time using Google Charts and I couldn't find anything in the 
>> documentation about manually adjusting automatic values. Can anyone point 
>> me in the right direction?
>>
>> [image: Screenshot 2022-12-14 at 6.33.27 PM.png]
>>
>>

-- 
You received this message because you are subscribed to the Google Groups 
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to google-visualization-api+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/google-visualization-api/0de27d85-0619-41c5-9a02-db4e90dee05an%40googlegroups.com.