I want to change the font size in my pdf but i can´t
I tried to use doc.setFontSize(2) for example but i only can in a hardcode variable for example
let title = 'Hello world'
doc.setFontSize(2) -----> thats works but if i want to change this below:
let stringRange = padLessTen(segment.dates.start.getHours()) + ":" + padLessTen(segment.dates.start.getMinutes())
+ ' - ' + padLessTen(segment.dates.end.getHours()) + ":" + padLessTen(segment.dates.end.getMinutes())
return `${stringRange}`
};
This is a variable that returns hours and I want to lower the font size of those hours i tried with everything doc.setFontSize(2) or styles: { fontSize(2) } if i return ${stringRange} + doc.setFontSize(2) it said 11:45 {object Object} and dont change the size
Related
function doGet(e){
Logger.log("--- doGet ---");
var tag = "",
value = "";
try {
// this helps during debuggin
if (e == null){e={}; e.parameters = {tag:"test",value:"-1"};}
tag = e.parameters.tag;
value = e.parameters.value;
// save the data to spreadsheet
save_data(tag, value);
return ContentService.createTextOutput("Wrote:\n tag: " + tag + "\n value: " + value);
} catch(error) {
Logger.log(error);
return ContentService.createTextOutput("oops...." + error.message
+ "\n" + new Date()
+ "\ntag: " + tag +
+ "\nvalue: " + value);
}
}
// Method to save given data to a sheet
function save_data(tag, value){
Logger.log("--- save_data ---");
try {
var dateTime = new Date();
// Paste the URL of the Google Sheets starting from https thru /edit
// For e.g.: https://docs.google.com/..../edit
var ss = SpreadsheetApp.openByUrl("https://docs.google.com/spreadsheets/d/1HYJRHfJVgZp16xYt4fipR1bH2BudhuQ4UrDhAf1rBKw/edit");
var dataLoggerSheet = ss.getSheetByName("Datalogger");
// Get last edited row from DataLogger sheet
var row = dataLoggerSheet.getLastRow() + 1;
// Start Populating the data
dataLoggerSheet.getRange("A" + row).setValue(row -1); // ID
dataLoggerSheet.getRange("B" + row).setValue(dateTime); // dateTime
dataLoggerSheet.getRange("C" + row).setValue(tag); // tag
dataLoggerSheet.getRange("D" + row).setValue(value); // value
//dataLoggerSheet.getRange("E" + row).setValue(value); // value
//dataLoggerSheet.getRange("F" + row).setValue(value); // value
// Update summary sheet
summarySheet.getRange("B1").setValue(dateTime); // Last modified date
// summarySheet.getRange("B2").setValue(row - 1); // Count
}
catch(error) {
Logger.log(JSON.stringify(error));
}
Logger.log("--- save_data end---");
}
In the example above, inside the value of "tag" there is data in the format "12345678912 | ABCDEFGHIJ". "Tag" data in column C; I want to print with the first 11 characters in column D. The "tag" data in column C; I want to print it with column E after 12 characters. How can I do that?
To see my overall objective, these two screenshots should show it.
Original Spreadsheet from Form:
enter image description here
Formatted Version of Spreadsheet:
enter image description here
Thank you in advance for your help.
You will have to manipulate the tag string in order to get the values you want.
In order to do this you will have change this:
dataLoggerSheet.getRange("C" + row).setValue(tag); // tag
To this:
dataLoggerSheet.getRange("C" + row).setValue(tag.slice(0,tag.indexOf('|')); //first part of tag
dataLoggerSheet.getRange("D" + row).setValue(tag.slice(tag.indexOf('|') + 2)); // second part of tag
dataLoggerSheet.getRange("E" + row).setValue(value); // value
Explanation
The above snippet makes use of the indexOf and slice methods from JavaScript in order to get the index of the | character in order to be able to split the tag string into two different strings.
Reference
JavaScript Array.prototype.slice();
JavaScript Array.prototype.indexOf().
I am using Rotativa 1.6.1 version for converting views to PDF. Now I am trying to show footer text with images on all pages. I used following code snippets:
string customSwitches = string.Format("--header-html \"{0}\" " +
"--header-spacing \"0\" " +
"--footer-html \"{1}\" " +
"--footer-spacing \"10\" " +
"--footer-font-size \"10\" " +
"--header-font-size \"10\" ", header, footer);
return new Rotativa.ViewAsPdf("_PDF_Desgin.cshtml", List)//_PDF_Desgin.cshtml is control Page
{
FileName = "PdfFileName.pdf",
PageSize = Size.A4,
PageOrientation = Orientation.Landscape,
CustomSwitches = customSwitches
};
But unfortunately it is not working in my case. Can you help me to figure out the correct usage for displaying footer text with images on all generated PDF files.
Thanks and regards,
Viju.
I have figure out the issue and displayed the footer template by using PageMargins attribute.
return new Rotativa.ViewAsPdf("_PDF_Desgin.cshtml", List)//_PDF_Desgin.cshtml is control Page
{
FileName = fileName,
IsJavaScriptDisabled = false,
CustomSwitches = customSwitches,
// CustomSwitches = "--no-stop-slow-scripts --print-media-type --javascript-delay 5000 --disable-smart-shrinking",
PageOrientation = Rotativa.Options.Orientation.Portrait,
PageSize = Rotativa.Options.Size.A4,
PageMargins = new Margins(0, 3, 32, 3),
};
Thanks and regards,
Viju
Im using Stacked area chart of nvd3-angularjs
This is my html
<div ng-controller="Eth2GraphController">
<nvd3-stacked-area-chart
data="GraphData"
noData="No Data For You!"
id="eth2Graphs"
showXAxis="true"
showYAxis="true"
showLegend="true"
interactive="true"
tooltips="true"
objectEquality="true"
margin="{left:100,right:100}"
useInteractiveGuideline="true"
tooltipcontent="toolTipContentFunction()"
xAxisTickFormat="xAxisTickFormatFunction()"
yAxisTickFormat="yAxisTickFormatFunction()"
color="colorFunction()"
legendColor="colorFunction()"
>
<svg></svg>
</nvd3-stacked-area-chart>
</div>
Now, I have a function that should format the tooltipcontent, but its not working. Maybe it has something to do with the useInteractiveGuideline attribute. I used the same tooltipcontent function to edit the tooltip of my other charts, its working on those charts the only difference is that those chart dont use useInteractiveGuideline.
$scope.toolTipContentFunction = function() {
return function(key, x, y, e, graph) {
return '<h3>' + x + '</h3>' +
'<p>' + key + ' ' + y + '</p>';
}
};
I want x to be in the center, and other formatting for the data. How would I do that? Am I using the correct attribute that would format the tooltip?
Change tooltipcontent="toolTipContentFunction()" to:
tooltipContent="toolTipContentFunction"
useInteractiveGuideline must be set to false for the tooltipContent to work. I believe it is because useInteractiveGuideline uses it's own popup.
I've a student form which there's location inside the form, when I run the app and show the form it'll look like this
Location : Jl Excel Road Ring No.36 SINGAPORE, 10110
But I want to make the location in two line like this
Location : Jl Excel Road Ring No.36
SINGAPORE, 10110
here's the gsp
<td><g:message code="location.label"/></td>
<td>${studentInstance.location}</td>
and this is the service in def show
def loc = Location.findByTidAndDeleteFlag(params.tid, "N")
if(loc != null){
studentInstance.location = loc.address1 + " " + loc.city + ", " + loc.zipCode
}
else{
studentInstance.location = ""
}
Use the br tag
studentInstance.location = loc.address1 + "<br/> " + loc.city + ", " + loc.zipCode
Then you can render directly the HTML unescaped like this:
<%=studentInstance.location%>
The default codec is probably HTML in your configuration.
Check the value of grails.views.default.codec
For more information read this:
http://grails.org/doc/2.2.1/ref/Plug-ins/codecs.html
I believe that starting from Grails 2.3.x the default views codec is HTML with XML escaping in order to prevent XSS attacks.
This is a bad approach but you can try
studentInstance.location = loc.address1 + "<br> " + loc.city + ", " + loc.zipCode
Generally, I would have each of the element of address available in view so that the styling is flexible in view than in controller, something raw would look like:
<td><g:message code="location.label"/></td>
<td>${model.address1} <br> ${model.city}, ${model.zipCode}</td>
Is there a more efficient way for displaying a tool tip once a cell is hovered? Using the structure attribute to format the datagrid, is there a way to use formatter to display a dijit toolTip rather than using the html title attribute.
Here is the column in which the toolTip is displaying.
var subscriberGridLayout = [
{
name: " ",
field: "ExpirationDate",
formatter: function(value){
if(value){
expDate = formatDateIE(value);
return toolTip();
}
else
return " ";
},
styles: "text-align: center;",
width: "30px"
},
Here is the function that displays a tooltip icon through the image tag but instead of a dijit toolTip it simply uses html's title to display a popup.
function toolTip(){
src = "'/Subscriber/resources/images/icons/icon_error.gif'/>";
if(dojo.date.difference(today, expDate) <= 0 ){
message = "Credential expired.";
return "<img title='"+ message + "' src=" + src + "";
} else if(dojo.date.difference(today, expDate) <= 60) {
message = "This Subscriber will expire in " + dojo.date.difference(today, expDate) + " days."
+ "
To prevent an interruption in the Subscriber’s access, please sumbit a request to " +
"renew the Subscriber within 30 days of the expiration date.";
return "<img title='"+ message + "' src=" + src + "";
} else {
return " ";
}
}
I would do something like:
new Tooltip({
connectId: grid.domNode,
selector: "td",
getContent: function(matchedNode){
return matchedNode.innerText
}
});
With grid.domNode you can get the generated DOM of your widget. A grid generates a table-structure, so you can get the cells by using the selector and getContent properties.
I must say it's not really the correct way to do it because now you're playing with the internal structure of the Dojo widget. If they once decide not to use a table as DOM structure your code won't work.
But I don't think there is a better way to achieve this, in the end you will always have to translate the Dojo cell to a DOM node (because tooltips are DOM based). You can of course connect a tooltip to each cell, but I tried that before and it was a little buggy (sometimes the tooltip didn't pop up).
I also made a JSFiddle to show you a working example.