Ok, the simple way for you is to use the ChartWrapper#setView method. Call
this before you call wrap.draw();:
wrap.setView({
// set the chart to use column 0 for the slice labels, column 1 for the
slice values, and column 2 for the tooltip display
columns: [0, {
label: 'Foo',
type: 'number',
calc: function (dt, row) {
return {v: dt.getValue(row, 1), f: dt.getFormattedValue(row,
2)};
}
}]
});
On Thursday, January 10, 2013 12:43:09 PM UTC-5, Justawebbie wrote:
>
> I am sorry I can be confusing at times. No this is a different set of
> charts for a totally different page. I even forget sometimes what I am
> doing and asking. :oP
>
> I am just not sure how to add the view you showed me on this set of code
> because it is set up a bit different than the other thread.
>
> Take care, justawebbie
>
>
>
> On Wednesday, January 9, 2013 1:07:10 PM UTC-9, asgallant wrote:
>>
>> Are you looking to integrate this alongside the changing bar colors in
>> the other thread? If so, it may be more productive to handle all of this
>> in one thread, so I don't get different sets of code mixed up; as I
>> frequently lose track of who is asking what around here >;o)
>>
>> On Wednesday, January 9, 2013 4:43:29 PM UTC-5, Justawebbie wrote:
>>>
>>> I am not sure I am understanding where to place it correctly to use it.
>>> I am sorry. I will get this sooner or later. Would you mind showing how to
>>> place it within my code above? Thank you so much for the help you have been
>>> giving me.
>>>
>>> Thanks again!
>>>
>>>
>>>
>>>
>>> On Tuesday, January 8, 2013 11:42:48 AM UTC-9, asgallant wrote:
>>>>
>>>> You can use whatever you want for the label. I just called it "Foo" as
>>>> a placeholder.
>>>>
>>>> On Tuesday, January 8, 2013 2:26:42 PM UTC-5, Justawebbie wrote:
>>>>>
>>>>> I am just a bit confused but not to bad. The label: 'Foo' what would
>>>>> i really use there? All my data is pulled from a spreadsheet. I am going
>>>>> to give it a go and hope I can do this.
>>>>>
>>>>> Thanks so much for the help! here I go wish me luck!
>>>>>
>>>>>
>>>>>
>>>>> On Tuesday, January 8, 2013 10:14:10 AM UTC-9, asgallant wrote:
>>>>>>
>>>>>> With PieCharts, you can only change the formatted value of the data
>>>>>> presented to the chart (which will change what gets displayed in the
>>>>>> tooltip), you can't create fully custom tooltips (yet?). If changing
>>>>>> the
>>>>>> formatted value is what you want, then you can do that by using the
>>>>>> "view"
>>>>>> parameter of the ChartWrapper to modify the data presented to the chart.
>>>>>> Use it like this:
>>>>>>
>>>>>> view: {
>>>>>> // set the chart to use column 0 for the slice labels, column 1
>>>>>> for the slice values, and column 2 for the tooltip display
>>>>>> columns: [0, {
>>>>>> label: 'Foo',
>>>>>> type: 'number',
>>>>>> calc: function (dt, row) {
>>>>>> return {v: dt.getValue(row, 1), f:
>>>>>> dt.getFormattedValue(row, 2)};
>>>>>> }
>>>>>> }]
>>>>>> }
>>>>>>
>>>>>> On Tuesday, January 8, 2013 1:20:52 PM UTC-5, Justawebbie wrote:
>>>>>>>
>>>>>>> I have two charts feeding onto one page using google spreadsheets.
>>>>>>> I want to add a column to my spreadsheets and have them feed to the
>>>>>>> charts
>>>>>>> as well. How can I add the tooltips for each chart using my
>>>>>>> spreadsheets.
>>>>>>>
>>>>>>> here is my working code so far:
>>>>>>>
>>>>>>> <!DOCTYPE html>
>>>>>>> <html>
>>>>>>> <head>
>>>>>>> <meta http-equiv="Content-Type" content="text/html;
>>>>>>> charset=UTF-8"></meta>
>>>>>>> <title>Home Page</title>
>>>>>>> <!--Load the AJAX API-->
>>>>>>> <script type="text/javascript" src="
>>>>>>> http://www.google.com/jsapi";></script>
>>>>>>> <script type="text/javascript">
>>>>>>> //Load the Visualization API and the ready-made Google
>>>>>>> table visualization
>>>>>>> google.load('visualization', '1',
>>>>>>> {'packages':['corechart']});
>>>>>>> </script>
>>>>>>>
>>>>>>> <script type='text/javascript'>
>>>>>>>
>>>>>>> function drawA() {
>>>>>>> // Define the chart using setters:
>>>>>>> var wrap = new google.visualization.ChartWrapper();
>>>>>>> wrap.setChartType('PieChart');
>>>>>>> wrap.setDataSourceUrl('
>>>>>>> http://spreadsheets.google.com/tq?key=0AjlSK7_zXoNHdE5oOHE0cTlNd2pQbzF0T3RsbE9PZ3c&pub=1'
>>>>>>> );
>>>>>>> wrap.setContainerId('energy-source-1');
>>>>>>> wrap.setOptions({'legend':['right',
>>>>>>> 'end'],'colors':['#5dbbeb','#f39f28','#aedfe9', '#528dcc'],
>>>>>>> 'is3D':'True','width':515,'height':400});
>>>>>>> wrap.draw();
>>>>>>> wrap.getChart();
>>>>>>> }
>>>>>>>
>>>>>>> function drawB() {
>>>>>>> // Define the chart using setters:
>>>>>>> var wrap = new google.visualization.ChartWrapper();
>>>>>>> wrap.setChartType('PieChart');
>>>>>>> wrap.setDataSourceUrl('
>>>>>>> http://spreadsheets.google.com/tq?key=0AjlSK7_zXoNHdDl1TXBPVGdoWmpIVFF2Z0xkTzhHSWc&pub=1'
>>>>>>> );
>>>>>>> wrap.setContainerId('energy-source-2');
>>>>>>>
>>>>>>> wrap.setOptions({'legend':'none','colors':['#5dbbeb','#f39f28','#aedfe9',
>>>>>>>
>>>>>>> '#528dcc'], 'is3D':'True','width':315,'height':315});
>>>>>>> wrap.draw();
>>>>>>> }
>>>>>>>
>>>>>>>
>>>>>>>
>>>>>>> function drawVisualization() {
>>>>>>> drawA();
>>>>>>> drawB();
>>>>>>>
>>>>>>> }
>>>>>>>
>>>>>>>
>>>>>>> google.setOnLoadCallback(drawVisualization);
>>>>>>> </script>
>>>>>>> </head>
>>>>>>> <body>
>>>>>>>
>>>>>>> <div style="width:95%; height:auto; float:left; margin:0;
>>>>>>> padding:0;">
>>>>>>>
>>>>>>> <div id="energy-source-1" style="float:left;"></div>
>>>>>>> <div id="energy-source-2" style="float:left;margin-top:50px;
>>>>>>> margin-left:-150px;" ></div>
>>>>>>> </div>
>>>>>>> </body>
>>>>>>> </html>
>>>>>>>
>>>>>>
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To view this discussion on the web visit
https://groups.google.com/d/msg/google-visualization-api/-/jqjOPB2--XIJ.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/google-visualization-api?hl=en.
