date:20170110

Re: [visualization-api] titleTextStyle Property with Dual-Y Column Chart

2017-01-10 Thread Aaron Best

Thanks Daniel for getting back to me.

On Tuesday, January 10, 2017 at 10:54:07 AM UTC-6, Daniel LaLiberte wrote:
>
> I would guess you are using the Material Column Chart, given your 'chart' 
> option.  There are several options not supported for the Material charts.  
> See https://github.com/google/google-visualization-issues/issues/2143
> I just added titleTextStyle to the list since it was missing.
>
> On Tue, Jan 10, 2017 at 11:18 AM, Aaron Best  > wrote:
>
>>
>>
>> When using the dual-Y Column Chart I can not add the property 
>> 'titleTextStyle' to the options variable. Is there a reason for this or is 
>> this a bug?
>>
>>
>>
>> var options = {
>> chart: {
>>   title: 'Contract vs Actual Cost',
>>   *titleTextStyle: { color: '#000', fontSize: 30, },*
>>   subtitle: 'Based on a scale of 1 to 1000'
>> },
>> hAxis: {
>>   title: 'Costs',
>>   viewWindow: {
>> min: [7, 1000, 0],
>> max: [17, 1000, 0]
>>   }
>> },
>> vAxis: {
>>   title: 'Rating (scale of 1-10)'
>> }
>> };
>>
>> -- 
>> 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 post to this group, send email to google-visua...@googlegroups.com 
>> .
>> Visit this group at 
>> https://groups.google.com/group/google-visualization-api.
>> To view this discussion on the web visit 
>> https://groups.google.com/d/msgid/google-visualization-api/75ab945f-12bf-4f5d-87b3-37baab9986ea%40googlegroups.com
>>  
>> 
>> .
>> For more options, visit https://groups.google.com/d/optout.
>>
>
>
>
> -- 
> Daniel LaLiberte 
> dlali...@google.com5CC, Cambridge MA
>

-- 
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 post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/google-visualization-api/896d974d-adaa-45f3-b767-caaf581964a9%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Re: [visualization-api] Table set maximum height

2017-01-10 Thread 'Daniel LaLiberte' via Google Visualization API

Understandable that you want the max-height behavior.  I'm not sure how
difficult this might be if I take it on as a change to the Table chart, and
I am inclined to not touch it for now.

You might need some dynamic behavior to make this work, such as catching
the 'ready' and getting the size of the rendered table to then set the size
of the wrapper.

To hopefully help you find a solution, here is a partial copy of a test
utility I have used to generate the many variations in tables.  Use
initAndDraw as the onload callback.

var dataTable;

/**
 * Set up data table for all table charts.
 */
function setDataTable1() {
  dataTable = createSomeTable();
}

var idNum = 0;

/**
 * Create a table chart with the parameters.
 * @param {?(number|string)} wWidth wrapper width.
 * @param {?(number|string)} wHeight wrapper height.
 * @param {?(number|string)} width
 * @param {?(number|string)} height
 * @param {!Object} options
 */
function createTableChart(wWidth, wHeight, width, height, options) {
  var id = 'table' + (idNum++);
  var section = document.createElement('div');
  section.innerHTML = '' + id + '' +
  'container' +
  ' width: ' + width + ' height: ' + height + '' +
  ' table options: ' + JSON.stringify(options) +
  '';
  document.getElementById('tables').appendChild(section);


  var wrapper = document.createElement('div');
  wrapper.id = id;
  wrapper.cssText = '';
  if (wWidth != null) {
wrapper.style.width =
(typeof wWidth === 'number' ? wWidth + 'px' : wWidth);
  }
  if (wHeight != null) {
wrapper.style.height =
(typeof wHeight === 'number' ? wHeight + 'px' : wHeight);
  }
  try {
wrapper.style.outline = '10px solid rgba(200, 200, 200, 0.5)';
  } catch (e) {}
  section.appendChild(wrapper);

  var container = document.createElement('div');
  container.id = id;
  container.cssText = '';
  if (width != null) {
container.style.width =
(typeof width === 'number') ? width + 'px' : width;
  }
  if (height != null) {
container.style.height =
(typeof height === 'number') ? height + 'px' : height;
  }
  try {
container.style.outline = '5px solid rgba(128, 128, 128, 0.5)';
  } catch (e) {}

  // Test with table-cell container.
  //container.style.display = 'table-cell';

  // Test if drawn with invisible container.
  //container.style.display = 'none';
  wrapper.appendChild(container);
  var chart = new google.visualization.Table(container);
  chart.draw(dataTable, options);
  //container.style.display = null;
}


/**
 * Initialize everything and draw the charts.
 */
function initAndDraw() {
  setDataTable1();

  var wrapperWidth = '100%';
  var wrapperHeight = '100%';

  // not specified, too small, too large, 100%
/*
  var containerWidths = [null, 200, 600, '100%'];
  var containerHeights = [null, 150, 250];
  var chartWidths = [null, 180, 400, '50%', '100%'];
  var chartHeights = [null, 150, '50%', '100%'];
*/
  var containerWidths = [null, 600, '100%'];
  var containerHeights = [null, 250];
  var chartWidths = [null, 180, '100%'];
  var chartHeights = [null, 150, '100%'];

  var pagingOptions = [0, 5];
//  var frozenColumns = [-1, 2];
  var frozenColumns = [-1];

  for (var contWidth in containerWidths) {
var containerWidth = containerWidths[contWidth];
for (var contHeight in containerHeights) {
  var containerHeight = containerHeights[contHeight];
  for (var cWidth in chartWidths) {
var chartWidth = chartWidths[cWidth];
if (typeof chartWidth === 'number' &&
typeof containerWidth === 'number' &&
chartWidth > containerWidth) { continue; }
for (var cHeight in chartHeights) {
  var chartHeight = chartHeights[cHeight];
  if (typeof chartHeight === 'number' &&
  typeof containerHeight === 'number' &&
chartHeight > containerHeight) { continue; }
  for (var fc in frozenColumns) {

for (var po in pagingOptions) {
  var pageSize = pagingOptions[po];
  var page = pageSize > 0 ? 'enable' : 'disable';
  createTableChart(
  wrapperWidth, wrapperHeight,
  containerWidth,
  containerHeight, {
width: chartWidth,
height: chartHeight,
page: page,
pageSize: pageSize,
frozenColumns: frozenColumns[fc]
  });
}
  }
}
  }
}
  }


}


On Tue, Jan 10, 2017 at 2:59 PM, Suzanne Paley 
wrote:

> Changing the max-height to height isn't useful to me, because I don't want
> the enclosing div to be any larger than it needs to be, either.
>
> On Tuesday, January 10, 2017 at 11:43:43 AM UTC-8, Daniel LaLiberte wrote:
>>
>> There may be limitations regarding use of max-height.  I don't have
>> confidence regarding that question because I haven't tested it much.   But
>> there may be a way to

Re: [visualization-api] Table set maximum height

2017-01-10 Thread Suzanne Paley

Changing the max-height to height isn't useful to me, because I don't want 
the enclosing div to be any larger than it needs to be, either.

On Tuesday, January 10, 2017 at 11:43:43 AM UTC-8, Daniel LaLiberte wrote:
>
> There may be limitations regarding use of max-height.  I don't have 
> confidence regarding that question because I haven't tested it much.   But 
> there may be a way to work with what it can do.  Here is a variation of 
> your example that appears to work correctly, but I moved your container to 
> a wrapper, and changed the max-height to just height.  Then the table_div 
> just has height:100%. https://jsfiddle.net/dlaliberte/Lw5h7c2y/
>
> It even shrinks if you have fewer rows than needed to fill the height.
>
> On Tue, Jan 10, 2017 at 2:28 PM, Suzanne Paley  > wrote:
>
>> I know the Table visualization takes parameters for height and width, but 
>> what I really want is a parameter for max-height.  I've tried not supplying 
>> a height parameter and just constraining the height of the enclosing div, 
>> but then if the table exceeds the div dimensions in both directions, I need 
>> to scroll down to the bottom of the table in order to find the horizontal 
>> scrollbar (this is on Chrome on a Linux desktop, and I don't have a 
>> horizontal scroll gesture -- I need to user the scrollbar), and the table 
>> header won't be fixed.  Example at https://jsfiddle.net/0mgg48bz/.  I 
>> can get the scroll behavior I want by specifying my max-height as the 
>> height option when drawing the table, but then if the data would ordinarily 
>> take up much less vertical space than my max-height, it expands to fill it, 
>> which I don't want.  Is there a way to get it to only take up as much space 
>> as needed, unless that space would exceed my max dimensions, and then have 
>> sensible scrollbars?
>>
>> -- 
>> 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 post to this group, send email to google-visua...@googlegroups.com 
>> .
>> Visit this group at 
>> https://groups.google.com/group/google-visualization-api.
>> To view this discussion on the web visit 
>> https://groups.google.com/d/msgid/google-visualization-api/7a235027-ec05-468e-82e6-9bba9b44f8ea%40googlegroups.com
>>  
>> 
>> .
>> For more options, visit https://groups.google.com/d/optout.
>>
>
>
>
> -- 
> Daniel LaLiberte 
> dlali...@google.com5CC, Cambridge MA
>

-- 
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 post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/google-visualization-api/b29612b6-91dc-470e-8de7-a7650ef2b008%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Re: [visualization-api] Table set maximum height

2017-01-10 Thread 'Daniel LaLiberte' via Google Visualization API

There may be limitations regarding use of max-height.  I don't have
confidence regarding that question because I haven't tested it much.   But
there may be a way to work with what it can do.  Here is a variation of
your example that appears to work correctly, but I moved your container to
a wrapper, and changed the max-height to just height.  Then the table_div
just has height:100%. https://jsfiddle.net/dlaliberte/Lw5h7c2y/

It even shrinks if you have fewer rows than needed to fill the height.

On Tue, Jan 10, 2017 at 2:28 PM, Suzanne Paley 
wrote:

> I know the Table visualization takes parameters for height and width, but
> what I really want is a parameter for max-height.  I've tried not supplying
> a height parameter and just constraining the height of the enclosing div,
> but then if the table exceeds the div dimensions in both directions, I need
> to scroll down to the bottom of the table in order to find the horizontal
> scrollbar (this is on Chrome on a Linux desktop, and I don't have a
> horizontal scroll gesture -- I need to user the scrollbar), and the table
> header won't be fixed.  Example at https://jsfiddle.net/0mgg48bz/.  I can
> get the scroll behavior I want by specifying my max-height as the height
> option when drawing the table, but then if the data would ordinarily take
> up much less vertical space than my max-height, it expands to fill it,
> which I don't want.  Is there a way to get it to only take up as much space
> as needed, unless that space would exceed my max dimensions, and then have
> sensible scrollbars?
>
> --
> 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 post to this group, send email to google-visualization-api@
> googlegroups.com.
> Visit this group at https://groups.google.com/
> group/google-visualization-api.
> To view this discussion on the web visit https://groups.google.com/d/
> msgid/google-visualization-api/7a235027-ec05-468e-82e6-
> 9bba9b44f8ea%40googlegroups.com
> 
> .
> For more options, visit https://groups.google.com/d/optout.
>



-- 
Daniel LaLiberte 
dlalibe...@google.com    5CC, Cambridge MA

-- 
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 post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/google-visualization-api/CAOtcSJNwRoAbnpB4rJ3wiR58ZBqgP5hwt3TRWCJ2mvCc%2Bvr3hQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.

[visualization-api] Table set maximum height

2017-01-10 Thread Suzanne Paley

I know the Table visualization takes parameters for height and width, but
what I really want is a parameter for max-height. I've tried not supplying
a height parameter and just constraining the height of the enclosing div,
but then if the table exceeds the div dimensions in both directions, I need
to scroll down to the bottom of the table in order to find the horizontal
scrollbar (this is on Chrome on a Linux desktop, and I don't have a
horizontal scroll gesture -- I need to user the scrollbar), and the table
header won't be fixed. Example at https://jsfiddle.net/0mgg48bz/. I can
get the scroll behavior I want by specifying my max-height as the height
option when drawing the table, but then if the data would ordinarily take
up much less vertical space than my max-height, it expands to fill it,
which I don't want. Is there a way to get it to only take up as much space
as needed, unless that space would exceed my max dimensions, and then have
sensible scrollbars?

--
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 post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit
https://groups.google.com/d/msgid/google-visualization-api/7a235027-ec05-468e-82e6-9bba9b44f8ea%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Re: [visualization-api] Re: Bar chart freezes if click second time on a bar

2017-01-10 Thread Hector diaz valenzuela

Thanks! It work for me!

El viernes, 6 de abril de 2012, 6:24:25 (UTC-7), asgallant escribió:
>
> Ok, I see what you are talking about.  The "problem" is that the second 
> click is "deselecting" the column, so the chart.getSelection() call is 
> returning an empty array, which is why you are getting that error.  If you 
> clear the selection at the end of your event listener, like this:
>
> google.visualization.events.addListener(chart, 'select', function(){
> alert(chart.getSelection()[0].row);
> chart.setSelection();  // nulls out the selection 
> }); 
>
> then you can click the same bar repeatedly without any issues.
>
> On Friday, April 6, 2012 9:12:31 AM UTC-4, Ram wrote:
>>
>> Thank You  asgallant... I am also tried in Play ground like below 
>> codingI got freezing chart in Playground. Also I got error as " 
>> "Uncaught TypeError: Cannot read property 'row' of undefined 
>> (retrieve_cache?unique_id=d5541b9085ac908f60fae4763aba5cef3b2fdb30,58)"
>>  " 
>>
>> *My Play ground Code:*
>>
>>>
>>> function drawVisualization() {
>>>   // Create and populate the data table.
>>>   var data = new google.visualization.DataTable();
>>>   var raw_data = [['Austria', 1336060, 1538156, 1576579, 1600652, 
>>> 1968113, 1901067],
>>>   ['Bulgaria', 400361, 366849, 440514, 434552, 393032, 
>>> 517206],
>>>   ['Denmark', 1001582, 1119450, 993360, 1004163, 979198
>>> , 916965],
>>>   ['Greece', 997974, 941795, 930593, 897127, 1080887, 
>>> 1056036]];
>>>   
>>>   var years = [2003, 2004, 2005, 2006, 2007, 2008];
>>>   
>>>   data.addColumn('string', 'Year');
>>>   for (var i = 0; i  < raw_data.length; ++i) {
>>> data.addColumn('number', raw_data[i][0]);
>>>   }
>>>   
>>>   data.addRows(years.length);
>>>   for (var j = 0; j < years.length; ++j) {
>>> data.setValue(j, 0, years[j].toString());
>>>   }
>>>   for (var i = 0; i  < raw_data.length; ++i) {
>>> for (var j = 1; j  < raw_data[i].length; ++j) {
>>>   data.setValue(j-1, i+1, raw_data[i][j]);
>>> }
>>>   }
>>>   
>>>   // Create and draw the visualization.
>>>   var chart=new google.visualization.BarChart(document.getElementById(
>>> 'visualization'));
>>>   chart.draw(data,
>>>{title:"Yearly Coffee Consumption by Country",
>>> width:600, height:400,
>>> vAxis: {title: "Year"},
>>> hAxis: {title: "Cups"}}
>>>   );
>>>   google.visualization.events.addListener(chart, 'select', function(){
>>> 
>>> alert(chart.getSelection()[0].row);  //Alert displayed on First. 
>>> Again if i click same bar,Chart Freezes. 
>>>   
>>>   });
>>> }
>>
>>  
>>
>> On Fri, Apr 6, 2012 at 6:23 PM, asgallant > > wrote:
>>
>>> I plugged that listener code into the Viz playground's BarChart example 
>>> (changing "timedata" to "data" to make it compatible), and it worked fine; 
>>> it didn't freeze at all.  The problem must be somewhere else in your code, 
>>> can you post the code or a link to the page?
>>>
>>>
>>> On Friday, April 6, 2012 7:49:02 AM UTC-4, Ram wrote:

 I have added Click event for each bar in Visualization Bar Chart. If i 
 click first time on a Bar, the event triggers and my expected result 
 displays properly. But Again if i click on same Bar, event triggers but 
 the 
 Chart freezes. After i am not able to interact with chart. My Bar chart 
 Click event is given below. Note: i have Bar chart with 4 columns and n 
 no.of rows.


 


 My Click Event: 

 google.visualization.events.addListener(chart, 'select', function(){
  var row = chart.getSelection()[0].row; 
 *//Chart freezes in this line if i click a bar second time* var column 
 = chart.getSelection()[0].column;
 var seluser= timedata.getValue(row, 0);
 alert('You selected ' + timedata.getValue(row, 0)); 
 alert(row+","+column); //These lines run properly when click first time 
 on Bar in Bar Chart.
 });



 -- 
>>> 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/-/lxQUCCXPdUgJ.
>>>
>>> To post to this group, send email to google-visua...@googlegroups.com 
>>> .
>>> To unsubscribe from this group, send email to 
>>> google-visualization-api+unsubscr...@googlegroups.com .
>>> For more options, visit this group at 
>>> http://groups.google.com/group/google-visualization-api?hl=en.
>>>
>>
>>
>>
>> -- 
>> BY
>>
>> R.RAMPRASAD
>>
>>

-- 
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

Re: [visualization-api] titleTextStyle Property with Dual-Y Column Chart

2017-01-10 Thread 'Daniel LaLiberte' via Google Visualization API

I would guess you are using the Material Column Chart, given your 'chart'
option.  There are several options not supported for the Material charts.
See https://github.com/google/google-visualization-issues/issues/2143
I just added titleTextStyle to the list since it was missing.

On Tue, Jan 10, 2017 at 11:18 AM, Aaron Best  wrote:

>
>
> When using the dual-Y Column Chart I can not add the property
> 'titleTextStyle' to the options variable. Is there a reason for this or is
> this a bug?
>
>
>
> var options = {
> chart: {
>   title: 'Contract vs Actual Cost',
>   *titleTextStyle: { color: '#000', fontSize: 30, },*
>   subtitle: 'Based on a scale of 1 to 1000'
> },
> hAxis: {
>   title: 'Costs',
>   viewWindow: {
> min: [7, 1000, 0],
> max: [17, 1000, 0]
>   }
> },
> vAxis: {
>   title: 'Rating (scale of 1-10)'
> }
> };
>
> --
> 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 post to this group, send email to google-visualization-api@
> googlegroups.com.
> Visit this group at https://groups.google.com/
> group/google-visualization-api.
> To view this discussion on the web visit https://groups.google.com/d/
> msgid/google-visualization-api/75ab945f-12bf-4f5d-87b3-
> 37baab9986ea%40googlegroups.com
> 
> .
> For more options, visit https://groups.google.com/d/optout.
>



-- 
Daniel LaLiberte 
dlalibe...@google.com    5CC, Cambridge MA

-- 
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 post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/google-visualization-api/CAOtcSJN1DNjRJOygii_B3MOo8dJY2B2JJ%3DyZha6vf_BrfK--RA%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.

[visualization-api] titleTextStyle Property with Dual-Y Column Chart

2017-01-10 Thread Aaron Best



When using the dual-Y Column Chart I can not add the property 
'titleTextStyle' to the options variable. Is there a reason for this or is 
this a bug?



var options = {
chart: {
  title: 'Contract vs Actual Cost',
  *titleTextStyle: { color: '#000', fontSize: 30, },*
  subtitle: 'Based on a scale of 1 to 1000'
},
hAxis: {
  title: 'Costs',
  viewWindow: {
min: [7, 1000, 0],
max: [17, 1000, 0]
  }
},
vAxis: {
  title: 'Rating (scale of 1-10)'
}
};

-- 
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 post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/google-visualization-api/75ab945f-12bf-4f5d-87b3-37baab9986ea%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Re: [visualization-api] titleTextStyle Property with Dual-Y Column Chart

Re: [visualization-api] Table set maximum height

Re: [visualization-api] Table set maximum height

Re: [visualization-api] Table set maximum height

[visualization-api] Table set maximum height

Re: [visualization-api] Re: Bar chart freezes if click second time on a bar

Re: [visualization-api] titleTextStyle Property with Dual-Y Column Chart

[visualization-api] titleTextStyle Property with Dual-Y Column Chart

8 matches

Site Navigation

Mail list logo

Footer information