I've a Google form/sheet which collects data creating cells that are so large that navigating up and down rows becomes tricky.
The below function should resize all rows (except the header row 1) to 50.
However, when it runs, all rows Auto-fit the data, again making it again unwieldy.
var sheetResponses = 'Form responses 3';
var ss = SpreadsheetApp.getActiveSpreadsheet();
var responsesSheet = ss.getSheetByName(sheetResponses);
var responseData = responsesSheet.getDataRange().getValues();
// Sets all rows to a height of 50
function resizeRowsTo50() {
responsesSheet.setRowHeights(2,responseData.length,50);
};
Can anyone spot what I've done wrong? Even if I manually resize all of the rows to a uniform height beforehand, the function reverts them back to fit the data.
Thanks in advance.
Edit: Link to Sheet
It appears that setWrap and setWraps override any manual or
programmed (setRowHeight/setRowHeights) row height adjustment.
The documentation for setWrap and setWraps says "Cells with wrap enabled (the default) resize to display their full content" (emphasis is mine). That is, the cell width remains unchanged, and the row height changes to enable display of the entire content.
It goes on... "Cells with wrap disabled display as much as possible in the cell without resizing or running to multiple lines". In the later case, the amount of text displayed otherwise depends on the width of the column.
By comparison, when the settings are adjusted manually (the row height set to 50 pixels and text wrapping set to wrap), the row does not revert to auto-fit.
I've re-run my initial tests and I believe that I may misinterpreted your auto-fit comments when comparing my results. My apologies.
The auto-fit outcome appears deliberate on Google's part - even though the effect is very different to the effect of the manual "Wrap" adjustment. These are relatively new commands (at the time of writing) and there are very few examples to be found online.
I've raised this as a feature issue and we'll see whether that generates any clarification and/or change.
I found a poor decision for me in this tricky way:
- set Wrap to text wrapping;
- set setRowHeight;
- cut the string to such symbols amount which is enough for setted Row Height.
(but you still can see "fit to data" when you trying to resize your row)
I mean I fit my data to my rows hight before google sheet fit hight to my data:)
Related
I'm iterating over a table with variable row sizes. Some rows cause the table to flow outside of the slide. To fix, I thought I'd set a maximum table size and add up all of the row sizes after setting the text and if it's too big create a new slide.
However, each row is always the same height. My assumption is that since it's not rendered in the UI yet, that all the rows remain the same size. I thought refreshing the slide would do it but it is not. I'm new to App Script (1 day).
updateRow(row, data);
slide.refreshSlide();
tableHeight += row.getMinimumHeight();
As an aside, I also attempted to get the size of the table using the
Table.getHeight()
Table.getInherentHeight()
methods but they continued to return null for a reason I didn't understand.
I am currently trying to write some Google Apps Script script that would allow my Google sheet table to fit to data, but with some row height cap.
The easiest way that came into my mind was first fit everything to data, and then walk over every row to check whether its height is more than some value and then fix it if it is too high.
sheet.autoResizeRows(startRow, numRows)
for (var i=0;i<numRows;i++){
var curHeight = sheet.getRowHeight(startRow + i)
Logger.log(curHeight)
if (curHeight > 50){
sheet.setRowHeight(startRow + i, 50)
}
}
However, what I found out is that .getRowHeight() always returns 20.0 - the default value.
Thus, do I miss something or .getRowHeight() does not work properly with fit to data rows, and if not is there a workaround?
your code is perfect.
So by-default the row size of google spreadsheet is 20 or 21 pixel.
hence:
if you want to set a fixed provided height to all rows then use "if(curHeight != 50)"
which will set height irrespective of whether the current height is higher or lower than the new value provided.
Else, if you just want to check your script, change the value to a value lesser than the default height i.e. if(curHeight > 10)
can I ask if you ever got a solution to this?
I'm having exactly the same problem. I wrote a function to "prettify" a sheet to make all the row heights the same (based on the greatest row height required to fit the data), but it fails because, as you found, sheet.getrowHeight() always seems to return the default value of 20 pixels, rather than the actual row height on the sheet.
I work with ssrs with a dynamic row data in matrix/tablix. There is possibility when I have more than one page (say it two pages) where the data just fill half of the second page and leave a blank space below (half page blank space on the second page). How is the way to fill this blank space with empty rows? (whether rendering empty rows in the tablix, or inserting background image, or anything. I don't have any solution yet as it is dynamic data with many possibilities of the blank space size on the page)
Unfortunately there aren't any settings in the reporter that support this behavior. There are however several workarounds you could use to get the wanted result.
[1]
You could determine the amount of rows that fit on the first page and on the second page, just in case you have items above the
table on the first page. Before you send the datasource to the
reporter count the total rows and check if it exceeds the first page.
Then calculate the number of rows missing to fill an entire second
page (or third/fourth... if you ever get more data). Finally you add
empty rows/objects at the end of your datasource, which will of cource
cause the pages to be filled to the end.
As was pointed out before, this solution is only possible when working
with fixed row heights. If certain columns can have multi-line cells
then these could be checked as well and taken in account when
calculating the number of rows being displayed on the page. This makes
it slightly more complicated but is still a valid solution if you can
predict which columns might be troublesome.
[2]
A second solution would be to hide the table borders and place the table inside a rectangle that spans the maximum size of the
page. The borders of this rectangle can be used to display the table
outer borders and columns can be displayed by adding lines inside the
rectangle. This will cause the columns to fill the last page of the
report automatically. Unfortunately this isn't a solution to display
horizontal grid lines.
[3]
A third approach is adding an extra table directly below your table
with the same size of columns. Using the same method as from the first
solution you could fill the second table to represent the empty rows.
You'll probably have the same issue as with the first solution when
dealing with multi-line rows though.
I believe solution [1] and [3] will offer the most exact solution, if you're willing to do the math. If you don't want any horizontal lines then I suggest using approach [2].
Using an image to overlay the borders is of course another option but then you'll have the same issues when dealing with the multi-line rows. If you plan on working with fixed row heights, where you leave space for multi-line cells then this is becomes a valid approach but so does solutions [1] and [3].
Update:
If you only need the filled pages for printing you could make sure you add enough empty rows to fill at least the entire last page, these may go to a new page (1 new page, not 2... you can use a simple calculated guess for this) and exclude the last page when printing.
So this is the situation:
I have a Google Spreadsheet with an attached Google Apps Script.
Based on data in the spreadsheet I want to create a document that can be printed onto label stickers. In other words, I have to create an m×n matrix of elements that are of a fixed size (w×h mm). I'd much prefer to be able to do all operations in the web browser, and I can't really see why this should not be possible, but none of the options I have tried so far have resulted in a document where I have the necessary level of layout control:
Creating a Spreadsheet where each cell contains the text for a label.
However, I can only set the cell height and width in pixels, not in
millimetres, and on printing margins that I cannot control are added to the document. (And, in order to limit the display
of the cell contents in the vertical direction I have to do a strange
workaround by merging my cell with the cell below it. What’s with
that?)
Creating a Document with a table where each cell contains the
text for a label. In this case I can set the minimum height of a
cell, but I cannot limit the maximum height. If it were possible to detect the current height of a table cell, I could truncate strings that overflow the cell, but this information is not available. Alternatively, if I could modify the underlying HTML representation of the document I could modify the relevant attributes, but this is not possible either.
Creating an HTML document
with a table where each cell contains the text for a label. In this
case I can directly set the width and height of the cell and use the
overflow attribute to restrict the contents to the given extents.
However, I cannot create an HTML file in my Docs area, so instead I tried to use a
ModelessDialog to contain my table. This sort of works in that in
Firefox and Safari (though not in Google Chrome!) I can print out
the table, but only the first page of it. This is due to the body
of the HTML automatically getting wrapped in a
<div id="guest" style="height:100%; overflow: auto">
and I have not figured out a way of getting rid of this.
Does anyone have a suggestion for how to achieve what I want?
I have an HTML table that can be more than 1K rows and a dozen or so columns.
I want the columns to be a fixed size (controllable by the user) and not grow/shrink either vertically or horizontally. So visually the contents of a particular table cell will be on one line and the overflow gets cut off at the end of the cell.
Doing performance analysis in Chrome on a large table the main performance killer is overflow:hidden.
I've tried putting the contents of each cell inside of an input, since that would replicate the same visual behavior, but that has a similar performance impact.
What do people recommend to improve performance?
If necessary I don't have to use a table tag, but would prefer to stick with the table tag if good performance can be achieved.
Update 1: I've included a file that demonstrates the performance issue here. Warning the file is pretty massive (25MB) and will slow down your computer. By default the table does not have overflow set to hidden, and once the table has been loaded (can take a while) the browser performance relatively smoothly.
However, if you edit the file and uncomment lines 12-15 and then open it. You'll see after loading browser around the table is significantly less responsive.
FYI: I have run into this problem on the iPad/iOS causing performance problems with a page that has about a hundred rows in a table with table-layout:fixed.
As soon as a cell, or a div in a cell, gets an attribute that forces it the cell to be drawn individually, it takes about 300ms instead of 100ms to draw (which causes the UI to feel abysmally slow for my situation).
Either of two properties (position:relative or overflow:hidden) caused the problem for me, removing them optimised the speed but caused text overflow if cell text was too wide for the fixed width columns.
The slowdown was happening even after tables were drawn, because I am dynamically popping up an absolute div over the table. When profiling the javascript (using (new Date).getTime()), the slowdown in measured in places in the javascript that have nothing to do with the table.
[edit: added following as part solution]
Put all cell content inside a span element (so can measure offsetWidth of content rather than width of containing block element).
After appending the row into the document, test if each span.offsetWidth is greater than the column width, if so add the "overflow:hidden" to the style (or via a class) of the containing block.
Can skip 1 and 2 above for some columns (if it is known that the cell content will never need clipping).
Caveats:
Measurements only made for iOS5 Safari (I didn't profile any other browser).
Works for us because we dynamically create table rows (processing your example using javascript would be slow?).
Most cells for our data do not overflow (clipping is only required sparsely - only a limited number of cells).
Compromised initial page load (generation of table in page went from 80ms to 800ms).
But sped up dynamic combo popup (340ms down to 130ms) giving much better keyboard responsiveness.
For your situation, might be fast to first using variable width columns, measure offsetWidth of all columns, setting column widths to pixel widths and setting overflow:hidden only on columns where offsetWidth of column is greater than the pixel width you will be using for the column.
You could try using a tiled approach. It is a pretty typical approach to making things like infinitely side-scrollable games efficiently.
Put all of your data into a Javascript array, and then have N + 1 rows in a table that has N rows visible. When you scroll down, the last item would move into view. At the moment that you have scrolled far enough that the first item moves out of view, you shift all of the data up a row and reset the scroll position back to where it started. Done correctly, the shift would be completely transparent to the user. You would only ever be working with N + 1 rows in an N-rows-visible table.
I've done this before, but under very specific UI constraints. I kind of shutter at the thought of making this consistent using the built-in browser scrollbars and such.
first off, the amount of markup required to have a table is much larger than just using divs with clear:both css for a new row. so that's the first performance hit.
also, you are setting the overflow as a class ( ? )
<style type="text/css"> .ovfl { overflow:hidden; }</style>
<td class="ovfl"></td>
As an aside, 1000 rows is a weight to deliver.
With divs you at least have an easier opportunity to throw those out of sight ( beyond the scroll ) into a div with display:none until the visitor scrolls to them.
few skins to cat mostly likely on this job,
Hope had some good thoughts.
Webkit bug 75001 is related to this problem and it covers the work being done to solve it (also see bugzilla dependencies for information).