canvas x/y

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Full stack Developer / .NET / Angular / Azure

Dit ga je doen Jij gaat je als Full Stack .NET Developer voornamelijk bezighouden met: Het vertalen van concepten naar passende innovatieve en duurzame oplossingen; Het ontwikkelen van bedrijf kritische en gebruiksvriendelijke applicaties voor de internationale markt en intern gebruik; Bouwen aan software om het Internet of Things netwerk te ondersteunen; Het maken en onderhouden van interfaces tussen systemen aan de hand van API's; Het onderhouden en blijven verbeteren van de ontwikkelde software. Hier ga je werken Binnen deze organisatie zal jij als Full Stack .NET Developer een belangrijke rol krijgen en ga je dagelijks de uitdaging aan om maatwerk

Bekijk vacature »

Medior/Senior Software Developers gezocht in de Ra

Functie Op dit moment staan er posities open voor de volgende functies: Front-end, Back-End & Fullstack software developer. Als Front-End software developer werk je met JavaScript en de bijbehorende technologieën zoals TypeScript, Angular, React, Vue en Svelte. Als Back-End software developer ben je bezig in NodeJS en doe je dit met behulp van AWS, NoSQL, REST en GraphQL. Je krijgt leuke en uitdagende opdrachten met een gemiddelde duur van anderhalf jaar. Hier werk je in een team met andere IT’ers aan het ontwikkelen en verbeteren van software. Je wordt begeleid door een accountmanager die fungeert als jouw aanspreekpunt. Het team

Bekijk vacature »

Full stack .NET developer Microsoft 365

Wat ga je doen als Full stack .NET developer Microsoft 365? Je stelt je op als sparringpartner voor het team en PO over toekomstige functionaliteiten, architectuur en mogelijke nieuwe producten. Je bent mede-verantwoordelijk voor het vertalen en omzetten van een user story in een passend technisch design. Je implementeert functionaliteiten op basis van een technisch design en user story. Je bent mede-verantwoordelijk voor het beheer van Azure DevOps, waaronder het beheer van GIT, Build Pipelines, Release Pipelines en geautomatiseerde testen. Hier herken jij jezelf in Hbo werk- en denkniveau of hoger aangevuld met relevante certificeringen en/of cursussen; Minimaal 3 jaar

Bekijk vacature »

.NET software developer

Functie omschrijving Voor een gewilde werkgever in omgeving Roosendaal zijn wij op zoek naar een back-end software developer met een aantal jaar werkervaring. Je krijgt een plekje in het workflow team en je zal betrokken worden bij het bouwen van nieuwe software, en het optimaliseren van bestaande code. Je werkt bij dit bedrijf in een Scrum team waarin je soms klantcontact hebt. Jouw werkzaamheden zullen er als volgt uit zien: Je krijgt een plekje op de in-house IT afdeling. Deze afdeling bestaat uit zo'n 12 collega's, verdeeld over verschillende specialisaties (BI, Beheer, Business software & workflow). De vacature staat open

Bekijk vacature »

SQL Database ontwikkelaar

Functie omschrijving Wil jij meewerken aan het creëren van slimme software om magazijnen als een geoliede machine te laten lopen? Wij zoeken een zorgvuldig persoon, iemand die niet snel de hand omdraait voor complexe algoritmes. Denk jij dat jij de SQL ontwikkelaar bent die wij zoeken? Lees snel verder en wie weet zitten we binnenkort samen aan tafel! Jouw werkzaamheden zullen er als volgt uitzien: Je houdt je bezig met het ontwerpen en ontwikkelen van MS SQL server databases, dit doe je met T-SQL als programmeer laag. Je gaat aan high-end software oplossingen werken, dit doe je voor de optimalisatie

Bekijk vacature »

C++ Ontwikkelaar

Functieomschrijving Ben jij toe aan een nieuwe uitdaging en werk je graag en goed in C++ en C#? Dan zijn we op zoek naar jou! Dit bedrijf is dé specialist op het gebied van automatiseringssoftware voor een specifieke branche en ze zijn per direct op zoek naar versterking in hun development team. Wat jij gaat doen binnen jouw rol als C++ ontwikkelaar; Je vertaalt de wensen van gebruikers naar een functioneel ontwerp. Je houdt je bezig met het ontwerpen, programmeren en testen van product aanpassingen. Je gaat nieuwe product releases implementeren in de projectteams. Je gaat de effecten van nieuwe

Bekijk vacature »

Oracle APEX developer

Wat je gaat doen: Als Oracle APEX ontwikkelaar bij DPA werk je samen met collega’s aan de meest interessante opdrachten. Je zult je ervaring met SQL, PL/SQL, JavaScript, HTML en CSS inzetten om wensen van opdrachtgevers te vertalen naar technische oplossingen. Je werk is heel afwisselend, omdat DPA zich niet beperkt tot een specifieke branche. Zo ben je de ene keer bezig binnen de zorgsector, de andere keer is dit bij de overheid. Wat we vragen: Klinkt goed? Voor deze functie breng je het volgende mee: Je hebt een hbo- of universitaire opleiding afgerond Je hebt 2 tot 5 jaar

Bekijk vacature »

Software Ontwikkelaar PHP

Functie omschrijving Software Ontwikkelaar PHP gezocht! Wij zijn op zoek naar een ervaren PHP Software Ontwikkelaar om het team van onze opdrachtgever te versterken! De ideale kandidaat zal fungeren als verlengstuk van klanten en complexe technische vraagstukken met enthousiasme benaderen. Naast het werken met de nieuwste technologieën, ben je in staat om aan meerdere projecten tegelijkertijd te werken. Als je deze uitdaging aangaat, werk je nauw samen met front-end developers en draag je bij aan het realiseren van grote veranderingen bij klanten. Het bedrijf zoekt iemand die zichzelf graag uitdaagt en altijd streeft naar het leveren van de beste resultaten.

Bekijk vacature »

Infrastructure Developer

Vacature details Vakgebied: Software/IT Opleiding: Senior Werklocatie: Eindhoven Vacature ID: 12945 Introductie Our client is one of the most innovative companies within the Netherlands. Currently we are looking for an Infrastructure Platform Engineer. Within this role you will be developing the infrastructure. Functieomschrijving Within this role you are responsible in the development of our distributed data and compute platform infrastructure. You will design, develop and implement new features and fixes. Next to this you will integrate and configurate other packages that supports the development of tuning applications within the organisation. You will support customer sites remotely. Design and implement the

Bekijk vacature »

Front-end developer (Medior/Senior)

Functie Het front-end team bestaat momenteel uit 4 collega’s en is hard aan het groeien! Samen leveren jullie een essentiële bijdrage aan de applicaties die ze voor hun klanten realiseren. Je werkt in het front-end team samen met de back-end teams en product owners om te zorgen dat de applicaties een fijne gebruikerservaring opleveren. Jouw expertise zorgt ervoor dat de juiste keuzes gemaakt worden qua techniek en ontwerp, van back-end tot aan gebruiker. In samenspraak met je team bepalen jullie de beste keuze voor techniek. Ook is er altijd ruimte om nieuwe technieken te ontdekken. Eisen • Je hebt gedegen

Bekijk vacature »

Front end developer

Functie Jij als ervaren Front end developer bent een expert het gebied van Javascript en React. Je wordt onderdeel van een multidisciplinair team bestaande uit een PO, twee Front end developers, een DevOps/Back end developer, een UX/UI designer en een projectmanager. Verder is er iemand verantwoordelijk voor de HR en is de algemeen directeur nauw betrokken bij alle projecten. Dagelijks hou jij je bezig met de verschillende projecten die zijn opgenomen in de sprint. Daarnaast denk je mee over mogelijke oplossingen om de behoefte van de klant op de beste manier in te vullen. Verder spar jij intern met collega’s

Bekijk vacature »

Junior PHP (Laravel) Developer

Functie omschrijving Wij zijn op zoek naar een PHP Laravel Developer! Sta je aan het begin van je carrière en ben je op zoek naar een leuke baan? Lees dan verder! Voor een softwarebedrijf in omgeving van Schiphol zijn wij op zoek naar een ervaren PHP (Laravel) Developer. Je gaat je bezighouden met het ontwikkelen van innovatieve bedrijfsapplicaties. Samen met het team, bestaande uit designers en developers, maak je mooie oplossingen voor bedrijven in diverse branches. Je zorgt dat de opgeleverde websites perfect werken en de klant meer dan tevreden is. Je kunt rekenen op een afwisselende baan met leuke

Bekijk vacature »

.NET Developer Azure

Dit ga je doen Het ontwerpen en bouwen van diverse applicaties (C#, ASP.NET, MVC); Het ontwikkelen van Webservices (WCF); Het meewerken aan de transitie naar Azure; Het samenwerken met collega's binnen een Scrumteam en meedenken over de User Stories; Het bouwen van unittesten; Meedenken over nieuwe tooling, ontwikkelingen en technologieën in de markt. Hier ga je werken Je komt te werken bij een organisatie die verantwoordelijk is voor de ontwikkeling van verschillende portalen. Deze portalen worden gebruikt door diverse partijen en jouw taak is om ervoor te zorgen dat deze optimaal functioneren. Je wordt onderdeel van een Scrumteam en werkt

Bekijk vacature »

Frontend Developer - Leeuwarden

Als Frontend Developer bouw jij mee aan het onderwijs van de toekomst! In een scrum team werken met jonge en enthousiaste collega’s, moderne technieken, ruimte voor eigen ontwikkeling en op een proactieve wijze kunnen meewerken aan innovatie binnen het onderwijs. Magister is het state-of-the-art softwarepakket dat scholen in het voortgezet onderwijs op alle fronten ontzorgt. Van leerlingenadministratie tot het ondersteunen van individuele leerlijnen, van toegang tot digitaal lesmateriaal tot het plannen van het lesrooster. In de Magister app bedient Magister ruim 2,5 miljoen gebruikers waarvan, dagelijks meer dan 600.000 unieke. Hiermee is Magister de absolute marktleider in onderwijsland. Wat vragen

Bekijk vacature »

C#.NET Developer

Functieomschrijving We are looking for a dutch native speaker In deze uitdagende functie ga je werken als onderdeel van het development team, in de functie van C#.NET Developer, Je gaat maatwerk software bouwen voor diverse klanten. Ook optimaliseer je bestaande software en bouw je API koppelingen. Je bent vooral met back-end development bezig. Je krijgt veel vrijheid in deze functie en je krijgt de kans om mee te denken in bedrijfsprocessen. Deels thuiswerken is geen enkel probleem! Bedrijfsprofiel Deze organisatie is gevestigd in de regio van Boxtel. Het is van oorsprong een familiebedrijf, die gestart zijn met het bouwen van

Bekijk vacature »
Jan R

Jan R

20/07/2020 10:50:51
Quote Anchor link
Hi,

ik slaag er niet in om de juiste X/Y coördinaten te vinden.
Zoals te zien in de code heb ik al een paar mogelijkheden geprobeerd.

https://www.janr.be/html2canvas/

Met de huidige code werkt het perfect onder edge op local server. Echter via chrome of op een productie server lukt het niet.

Kan iemand eens een kritische blik werpen?

Jan
 
PHP hulp

PHP hulp

26/09/2023 04:40:26
 
Ad Fundum

Ad Fundum

20/07/2020 11:22:23
Quote Anchor link
Wat bedoel je precies met 'de juiste coordinaten'?
 
Jan R

Jan R

20/07/2020 13:40:17
Quote Anchor link
wat zouden xy coördinaten kunnen zijn:)
 
Thomas van den Heuvel

Thomas van den Heuvel

20/07/2020 14:55:05
Quote Anchor link
Waarvan? Je bedoelt waarom de muispointer niet de punt van je "penseel" is in de "screenshot"?

Ik denk dat dit op een of andere manier met schaal te maken heeft.

Probeer maar eens een diagonale lijn te trekken van de linker bovenhoek naar de rechter onderhoek. De lijn start precies op de muispointer, maar naarmate je de rechter onderhoek nadert wordt de afstand tussen de getrokken lijn en de muispointer groter.
 
Jan R

Jan R

20/07/2020 18:01:23
Quote Anchor link
Inderdaad. De X/Y kloppen niet. zoals je ziet in de javascript heb ik al enkele pogingen ondernomen. getMousePos, getMousePos1 en getMousePos2 en dan nog de andere die ik al gewist heb.

De canvas is 800X600 wat ook doorkomt in js. Deze komt niet door als je werkt met css :(
Ik heb al gekeken naar de border ed echter zonder succes. Er zou iets met de schaal kunnen. Ik vind het niet.

Ter herinnering. EXACT dezelfde code, die jullie nu kunnen zien, onder edge 83 werkte lokaal maar niet op productie. Ook een ander resultaat in chrome.

Even ter verduidelijking. De bedoeling is als iemand een fout ziet op de site, hij deze kan kopiëren naar een print-screen aantekeningen maken en dan posten naar de webbeheerder. Het post deel werkt.

1 persoon heeft een foto genomen zonder te bewerken en dan gepost.

Jan

update. Er was blijkbaar een bug in edge 83. Vandaag 84 ontvangen en nu lukt ongeveer alles :)

Aan allen welke meewerkten: BEDANKT

Jan

Toevoeging op 20/07/2020 19:11:21:

Voor wie wilt. Blijft nog een paar weken staan. Misschien zijn er nog geïnteresseerden.
Gewijzigd op 20/07/2020 19:09:35 door Jan R
 
Ad Fundum

Ad Fundum

20/07/2020 21:02:59
Quote Anchor link
Het is zeker een leuk idee. Het zou nog beter zijn als het ook cross-platform zou werken. Op mijn systeem (Linux, KDE Plasma, Firefox ESR) zit er een witrand onder de screenshot, en de schaal van de getekende lijn klopt niet. De X/Y-schaal van de getekende lijn is te groot vanuit de oorsprong, waardoor alles vergroot naar rechts onder getekend wordt. Misschien heeft het te maken met dat ik een 4k-scherm heb?

Afgezien van het issue met de coordinaten gebruik je een grote JS-library html2canvas. Misschien ben je via Google op een draad van SO gekomen (https://stackoverflow.com/questions/4912092/using-html5-canvas-javascript-to-take-in-browser-screenshots) maar html2canvas heeft vrij veel issues (https://github.com/niklasvh/html2canvas/issues) en het is inmiddels ingehaald door de JavaScript-functie getDisplayMedia(). Zie ook https://www.w3.org/TR/screen-capture en https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getDisplayMedia .
getDisplayMedia() wordt ondersteund op alle moderne (desktop) browsers, zie ook https://caniuse.com/#search=getDisplayMedia .

Het zou mooi zijn als we in (vanilla) JS een voorbeeld hebben van het maken, annoteren en opsturen van een screenshot..
 
Jan R

Jan R

21/07/2020 08:37:36
Quote Anchor link
Hi,

De witrand onderaan is logisch. Het scherm bevat dan ook een groot deel wit onderaan. GetDisplayMedia ga ik eens bekijken. Als ik het goed zie/lees met de gebruiker eerst toestemming geven en is dit uitsluitend voor media. Niet voor stilstaand beeld.
Mijn bron: https://html2canvas.hertzen.com/ staat ook vermeld in mijn html.

Jan

Toevoeging op 21/07/2020 19:41:04:

Het begint op iets te trekken
 
Ad Fundum

Ad Fundum

21/07/2020 21:34:45
Quote Anchor link
Het nadeel van html2canvas is dat de rendering van de HTML minder compleet, en niet hetzelfde is, als die van een browser. Het kan daardoor helaas geen generieke oplossing zijn, want hoe complexer een site is, hoe groter de kans dat de screenshot helemaal niet lijkt op de site of webapp. Daarom kwam ik met getDisplayMedia(), omdat je daarmee exact kunt zien wat een browser laat zien. Je kunt er zelf meer mee, zoals (i.c.m. WebRTC) iemand live laten meekijken op de site, dat geeft nog veel meer informatie over wat er fout is.

Overigens is het voorbeeld met html2canvas een geslaagde proof of concept, dat laat zien wat de mogelijkheden zijn.
 
Jan R

Jan R

22/07/2020 07:09:29
Quote Anchor link
Volledig akkoord maar hoe kan ik met getDisplayMedia of een ander commando een screendump maken naar een canvas? Ik vind enkel streamen van media als ik hierop zoek.

Jan
 
Yoop Overmaat

Yoop Overmaat

22/07/2020 10:54:32
Quote Anchor link
De x/y = coordinaten van html5 canvas liggen in de linkerbovenhoek van je canvas.
Misschien dat het zo lukt, zoek eens op screenshot i.p.v. screendump.

Voorbeeld:
Link: https://www.tutorialspoint.com/Can-you-take-a-screenshot-of-the-page-using-HTML5-Canvas
 
Jan R

Jan R

22/07/2020 11:04:16
Quote Anchor link
Laat dat nu dezelfde lib zijn als waarmee ik werk :)
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.