multiple y axes on a line graph using logarithmic scale

2,639 views
Skip to first unread message

Bharat

unread,
Aug 18, 2011, 4:59:30 PM8/18/11
to Google Visualization API
Is it possible to have a left Y axis and a right Y axis in a line
graph with different logarithmic scales? if yes then can you please
provide a sample code snippet?
Thanks.
Bharat

asgallant

unread,
Aug 19, 2011, 9:24:39 AM8/19/11
to google-visua...@googlegroups.com
Use the vAxes option to define each axis, then use the series option to assign different lines to each axis.  You can replace the vAxis option in the visualization playground's Line Chart example with this:

vAxes: {
   0: {logScale: true},
   1: {logScale: true}
},
series: {
   0: {targetAxisIndex: 0},
   1: {targetAxisIndex: 0},
   2: {targetAxisIndex: 1},
}



Bharat

unread,
Aug 19, 2011, 12:17:11 PM8/19/11
to Google Visualization API
Thank you. This works.
One of my vertical axis series is number of wells (say vAxis 1 above
for instance) and I would like to force it to display "Integer" values
instead of fractions. Is that possible?
Bharat

asgallant

unread,
Aug 19, 2011, 2:40:55 PM8/19/11
to google-visua...@googlegroups.com
The axis values are calculated automatically at the minValue, maxValue, and 1/4 increments of the axis between them (ex: 0, 25, 50, 75, 100).  I wrote a function that calculates the maxValue based on a given largest value in the series, minimum axis value, and whether the scale is linear or logarithmic

/*  this function finds the smallest integer value >= val that gives integer values for the 
 *  25%, 50%, and 75% axis increments, given a minimum value of min
 *  parameters:
 *      val = the value to start at
 *      min = the minimum axis value
 *      log = boolean, true if the axis has a logarithmic scale
 *  returns the max axis value
 */

function findMaxAxisValue(valminlog{
    var max Math.ceil(val);
    if (log{
        while(Math.pow(max0.25!== parseInt(Math.pow(max0.25)){
            max++;
        }
    }
    else {
        while ((max min)/!== parseInt((max min)/4){
            max++;
        }
    }
    return max;
}

Bharat

unread,
Aug 20, 2011, 12:09:28 PM8/20/11
to Google Visualization API
Thanks for your response. I am trying to plot number of wells on the
second axis which start with 0 and go up to 48 in a span of 10 years.
This has to be shown on a logarithm scale. So here is how I was
trying to call this function:

findAxisValue(48,0,true);

The value that I got back was 81 in the Firebug.

So I specified the maxValue for the second series as 81 following the
"Configuration Options" specified here:

http://code.google.com/apis/chart/interactive/docs/gallery/linechart.html

But the graph plots the following values:

2.5, 3.6, 15.8, 39.8, 100.0

If I specify a maxValue as 1000 however, I see integer values on my
second axis as follows:

1, 10, 100, 1000, 10000

I am leaning towards adding just 1000 to the maximum number of wells
(here 48 for example). Is that a good rule of thumb? Or am I doing
something wrong?

Thanks for all your help.

Bharat

Bharat

unread,
Aug 20, 2011, 12:10:00 PM8/20/11
to Google Visualization API

Jinji

unread,
Aug 21, 2011, 12:04:42 PM8/21/11
to google-visua...@googlegroups.com
Also note you can use the viewWindow option to the axis boundaries explicitly. This is different than minValue/maxValue as minValue/maxValue can only expand the range and never narrow it, while viewWindow can do both.

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To post to this group, send email to google-visua...@googlegroups.com.
To unsubscribe from this group, send email to google-visualizati...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.


asgallant

unread,
Aug 22, 2011, 9:20:29 AM8/22/11
to google-visua...@googlegroups.com
The logarithmic scale uses 1 as the baseline, not zero, so try findAxisValue(48,1,true); and set your min value to 1.  

On a related note, it appears that the line charts are ignoring parts of the viewWindow options for log scale axes.

Bharat

unread,
Aug 22, 2011, 12:08:39 PM8/22/11
to Google Visualization API
Thanks gentlemen for your help, I am coming up to speed fast.

Is there a way that we can force the vertical axis for a logarithmic
scale to to up in multiples of 10. So for example, can I ask it to
start at 1,000 then go to 10,000 and then 100,000 and finally to
1,000,000?

Bharat

Dhanesh Mane

unread,
Aug 26, 2011, 9:24:50 AM8/26/11
to Google Visualization API
Hey asgallant,

the solution you gave in your first comment works well with "line
graph" but I am looking to add y axis to "Annotated Time Line" chart.
please let me know how to do it.

Annotated Time Line chart ► http://code.google.com/apis/chart/interactive/docs/gallery/annotatedtimeline.html

Thanks
Dhanesh Mane
> http://code.google.com/apis/ajax/playground/?type=visualization#line_...

asgallant

unread,
Aug 26, 2011, 11:39:49 AM8/26/11
to google-visua...@googlegroups.com
Ahh, AFAIK, there is no support for logarithmic scales in the Annotated Timeline charts.
Reply all
Reply to author
Forward
0 new messages