HTML2CANVAS Error - Uncaught (in promise) DOMException: Failed to execute 'createPattern' on 'CanvasRenderingContext2D' - html2canvas

I`ve been trying to run the following code to export 7 DIVs into a PDF. However I have been getting the following error (in Chrome console):
Uncaught (in promise) DOMException: Failed to execute 'createPattern' on 'CanvasRenderingContext2D': The image argument is a canvas element with a width or height of 0.
at https://html2canvas.hertzen.com/dist/html2canvas.min.js:20:181816
at https://html2canvas.hertzen.com/dist/html2canvas.min.js:20:1976
at Object.next (https://html2canvas.hertzen.com/dist/html2canvas.min.js:20:2081)
at https://html2canvas.hertzen.com/dist/html2canvas.min.js:20:1463
at Object.next (https://html2canvas.hertzen.com/dist/html2canvas.min.js:20:2081)
at https://html2canvas.hertzen.com/dist/html2canvas.min.js:20:1023
at new Promise (<anonymous>)
at a (https://html2canvas.hertzen.com/dist/html2canvas.min.js:20:774)
at Ds.renderBackgroundImage (https://html2canvas.hertzen.com/dist/html2canvas.min.js:20:180785)
at Ds.<anonymous> (https://html2canvas.hertzen.com/dist/html2canvas.min.js:20:186005)
The strange thing is that this code did work a few times in my other laptop, but stopped working after a while. In my friend`s laptop apparently it did work as well.
I have seen posts saying this is due to asynchronous code, but I'm not getting!
function save() {
document.getElementById("status_etapa_3").className = "completo";
document.getElementById("status_etapa_4").className = "atual";
$('html, body').animate({ scrollTop: 0 }, 'fast');
var d = new Date()
var pdf = new jsPDF('p', 'pt', 'a4');
var jornadas = document.getElementsByClassName('jornada_container')
var page_height = pdf.internal.pageSize.getHeight()
var remaining_height = page_height
var y = 0
var adjusted_height = 0
var lenght = jornadas.length
for (let i = 0; i < jornadas.length; i++) {
html2canvas(jornadas[i]).then(function(canvas) {
adjusted_height = (jornadas[i].offsetHeight*(pdf.internal.pageSize.getWidth()/jornadas[i].offsetWidth))
if((y+adjusted_height) > pdf.internal.pageSize.getHeight()){
pdf.addPage()
y = 0
}
imgData = canvas.toDataURL('image/jpeg', 1.0)
pdf.addImage(imgData, "JPEG", 0, y, pdf.internal.pageSize.getWidth(), adjusted_height)
console.log(i + " " + lenght)
y = y + adjusted_height + 10
if((i+1) == lenght){
pdf.save('Infracommerce_Escopo_Executivo_' + d.getFullYear() + "-" + (d.getMonth()+1) + "-" + d.getDate())
}
})}
}
Does anyone have any idea?
Thank you in advance!!

Related

Google Apps Script Error Exception: Questions cannot have duplicate choice values

keep getting this annoying error, tried making a new sheet and new form and issue is repeating itself
Nov 8, 2022, 1:08:30 PM Error Exception: Questions cannot have duplicate choice values.
at [unknown function](Code:21:27)
at [unknown function](Code:11:30)
at populateQuestions(Code:10:14)
at openForm(Code:3:3)
The script used from YouTube link
function openForm(e)
{
populateQuestions();
}
function populateQuestions() {
var form = FormApp.getActiveForm();
var googleSheetsQuestions = getQuestionValues();
var itemsArray = form.getItems();
itemsArray.forEach(function(item){
googleSheetsQuestions[0].forEach(function(header_value, header_index) {
if(header_value == item.getTitle())
{
var choiceArray = [];
for(j = 1; j < googleSheetsQuestions.length; j++)
{
(googleSheetsQuestions[j][header_index] != '') ? choiceArray.push(googleSheetsQuestions[j][header_index]) : null;
}
//item.asMultipleChoiceItem().setChoiceValues(choiceArray);
// If using Dropdown Questions use line below instead of line above.
item.asListItem().setChoiceValues(choiceArray);
}
});
});
}
function getQuestionValues() {
var ss= SpreadsheetApp.openById('1jVxeFFi8LxHGUJ2L3suzjf9iokZN2RI5Vu1hcGCOWrc');
var questionSheet = ss.getSheetByName('Static');
var returnData = questionSheet.getDataRange().getValues();
return returnData;
}
tried to follow the tutorial https://www.youtube.com/watch?v=PRJ4bKk9JE8&t=268s

Creating OBX segments from multiple DB rows

I have a DB source which I am transforming into HL7. In the transform, I have a step to connect to the database and retrieve rows for OBX segments, there can be no rows or multiple rows.
I'm successfully getting all the values, but I'm having trouble getting them written into OBX segments. They're all the same, and all the last row retrieved.
Database values:
OBX3 OBX5
Test123 This is a new referral
Test456 Person
Test789 Anxiety
The result I'm getting in the message is:
OBX|0||Test789||Anxiety
OBX|1||Test789||Anxiety
OBX|2||Test789||Anxiety
Code:
var erefID = msg['erefid'].toString();
var dbConn = DatabaseConnectionFactory.createDatabaseConnection(driver,address,username,password);
var sql = "SELECT OBX3,OBX5 from table where column =" + erefID;
var results = dbConn.executeCachedQuery(sql);
var resultSize = results.size();
logger.info('query results ' + results);
logger.info('result size ' +resultSize);
var obx3 = "";
var obx5 = "";
while(results.next()){
var i=0
obx3 = results.getString(1);
logger.info('obx3 ' + obx3);
obx5 = results.getString(2);
logger.info('obx5 '+obx5);
while(i<resultSize)
{
createSegment('OBX', tmp,i);
tmp['OBX'][i]['OBX.1']['OBX.1.1'] = i;
tmp['OBX'][i]['OBX.3']['OBX.3.1'] = obx3;
tmp['OBX'][i]['OBX.5']['OBX.5.1'] = obx5;
i++;
}
}
dbConn.close();
Switched around the while statements, works now
while(i<resultSize){
var i=0
obx3 = results.getString(1);
logger.info('obx3 ' + obx3);
obx5 = results.getString(2);
logger.info('obx5 '+obx5);
while(results.next()){
createSegment('OBX', tmp,i);
tmp['OBX'][i]['OBX.1']['OBX.1.1'] = i;
tmp['OBX'][i]['OBX.3']['OBX.3.1'] = obx3;
tmp['OBX'][i]['OBX.5']['OBX.5.1'] = obx5;
i++;
}
}

Getting error in bokeh button callback: unexpected attribute 'callback' to Button, similar attributes are js_event_callbacks

I am getting error in bokeh button callback: unexpected attribute 'callback' to Button, similar attributes are js_event_callbacks.I copied from working example: is there a way to save bokeh data table content. Code where error ocurrs is presented bellow:
savebutton.callback = CustomJS(
args=dict(source_data=s1),
code="""
var inds = source_data.selected.indices;
var data = source_data.data;
var out = "x, y\\n";
for (i = 0; i < inds.length; i++) {
out += data['x'][inds[i]] + "," + data['y'][inds[i]] + "\\n";
}
var file = new Blob([out], {type: 'text/plain'});
var elem = window.document.createElement('a');
elem.href = window.URL.createObjectURL(file);
elem.download = 'selected-data.txt';
document.body.appendChild(elem);
elem.click();
document.body.removeChild(elem);
""",
)
I have searched if this error has occured to anybody else, but found nothing yet.
That example was working on Bokeh 1.4.0, and you're probably using Bokeh 2+.
It should work if you replace savebutton.callback = ... with savebutton.js_on_click(...).

Google maps downloadUrl does not return 200

My code is based on the example of google code:
https://developers.google.com/maps/articles/phpsqlinfo_v3
and was working fine.
I need to change a former 'gid' (Integer) field to 'id' (String) to get saved to the database and used to display a new labeled symbol on the map.
The strange thing is, that the url, that is build in the code to call the addrow.php file is OK. When I capture this string with alert(url), and I manually use this string, the new data is added to the database.
In my script, the call seems to fail (responseCode == 200 && data.length <=1), since no data is written to the database and the alert from the 'else-clause' is displayed as short pop-up.
Here's the code I use in my project (to save data from a form):
//save new marker to Postgis-database and add new markerwithlabel on the fly
function saveData(){
var gender = escape(document.getElementById("gender").value);
var hoehe = InZahl(document.getElementById("hoehe").value);
var breite = InZahl(document.getElementById("breite").value);
var id = escape(document.getElementById("id").value);
var vital = document.getElementById("vital").value;
var typ = document.getElementById("typ").value;
var ein_mehr = document.getElementById("ein_mehr").value;
var st_durchm = document.getElementById("st_durchm").value;
var frucht = document.getElementById("frucht").value;
var anmerk = document.getElementById("anmerk").value;
var latlng = marker.getPosition();
var url = "./mapdata/addrow.php?gender=" + gender +
"&hoehe=" + hoehe + "&lat=" + latlng.lat() + "&lng=" + latlng.lng() +
"&breite=" + breite + "&id=" + id + "&typ=" + typ + "&ein_mehr=" +ein_mehr + "&st_durchm=" + st_durchm +
"&frucht=" + frucht +
"&vital=" + vital + "&anmerk=" + anmerk;
downloadUrl(url, function (data, responseCode) {
if (responseCode == 200 && data.length <=1) {
infowindow.close();
marker.setDraggable(false);
marker.setIcon('./images/mm_purple.png');
marker.labelContent = id;
marker.setMap(map);
downloadUrl("./mapdata/getxml_get_last.php", function (data1) {
var xml = parseXml(data1);
var ms = xml.documentElement.getElementsByTagName("m");
var gid = ms[0].getAttribute("gid");
var html_n = "<div id='InfoWindow'><p style='font-weight:bold;'>" + id + "</p> \n\<p>Höhe:" + hoehe + " Breite: "+ breite +
"<br />\n\Typ: "+typ+" Stämme: "+ein_mehr+" St-Durchm: "+ st_durchm + "<br />\n\Vitalität: "+vital+" Fruchtbehang: "+frucht+
"<p/>\n\<p style='text-align:right;'><a href='sm_juniperus.php?operation=ssearch&ResetFilter=0&SearchField=gid&FilterType=%3D&FilterText="+ gid +
"' target='_blank'> Daten editieren </a></p></div>";
infowindow.setContent(html_n);
bindInfoWindow(marker, map, infowindow, html_n);
(function(i, marker, gid) {
var origIcon = marker.getIcon();
new LongPress(marker, 1000);
google.maps.event.addListener(marker, 'longpress', function(e) {
marker.setDraggable(true);
marker.setIcon(mmcross);
});
google.maps.event.addListener(marker, 'dragend', function(){
updatePosition(marker, gid);
marker.setIcon(origIcon);
});
})(i,marker,gid);
//add new marker to markerCluster-Array and to markerArray
markerCluster.addMarker(marker,false);
markerArray.push(marker);
i++;
}); // End add new marker
}
else {
alert("Your data couldn't be saved!");
}
}); // End downloadUrl
}; // END saveData()
As I said, my code worked fine, but after 3 evenings passed to solve this, I thought it would be time to ask for help.
If anybody has an idea, where the mistake lies, I would apreciate any hint.
Just to confirm, you're aware that you by doing
if (responseCode == 200 && data.length <=1) {
you are saying 'if the request is successful and the data it returns is only one character or below in length'? I am unsure if this is intended or not, because this way the code inside the if statement is only ran if the response is successful but contains only 1 or 0 characters.

easeljs cannot dispatch event

I want to dispatch my event,but it doesn't work. this is my code and I've deleted some irrelevant parts .
(function(window){
function HeroSelectView(){
this.initialize();
}
createjs.EventDispatcher.initialize(HeroSelectView.prototype);
HeroSelectView.prototype = new createjs.Container();
var selectedName;
HeroSelectView.prototype.Container_initialize=HeroSelectView.prototype.initialize;
HeroSelectView.prototype.initialize=function(){
this.Container_initialize();
this.initView();
}
HeroSelectView.prototype.initView = function(){
for (var i = 0; i < heroArray.length; i++) {
heroArray[i].x=100+40*i;
heroArray[i].y=200;
this.addChild(heroArray[i]);
heroArray[i].addEventListener("click",onSelectHero);
};
}
function onSelectHero(event){
selectedName=event.target.name;
var myevent = {
type: "selectedEvent",
param: selectedName
};
//var myevent=new createjs.Event("selectedEvent"); //createjs 0.7 doesnot work either.
this.dispatchEvent(myevent);
}
window.HeroSelectView=HeroSelectView;
}(window))
in the onSelectedHero, at first I tried it with createjs-0.61. you can see the "myevent" .But there is an error " TypeError: Argument 1 of EventTarget.dispatchEvent is not an object.". Then I tried it with version 0.7, but still got the same error. How can I fix this?
Thanks