Isometrisch grid

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Traineeship Front-end developer (WO, 0 tot 3 jaar

Functie Zoals beschreven ga je vanaf start aan de slag bij een passende opdrachtgever, hierbij kijken ze echt naar jouw wensen, kennis/ervaring maar ook de reisafstand. Momenteel hebben ze meerdere klanten waarbij ze groepen hebben opgezet wat maakt dat er diverse uitdagende kansen liggen. Naast het werken bij de opdrachtgever, en het volgen van de masterclasses, zul je regelmatig met de andere trainees in contact zijn. Niet alleen op professioneel vlak maar juist ook bij de borrels en kwartaaluitjes! Kortom; een jaar lang hard aan jezelf werken in combinatie met gezelligheid en plezier. Spreek dit jou aan? Dan komen we

Bekijk vacature »

Software Developer

Longship.io gaat de wereld veroveren met baanbrekende software en legendarische... pizza-avonden! Lees hier de vacature van IT Operations Manager! Bij Longship werken we met een team van 5 mensen aan software voor laadpaal operators. Longship is ontstaan in 2020 met als doel om de elektrische mobiliteitstransitie aan te jagen. We zijn nu al een wereldwijde speler doordat we continu voorop lopen in innovatie. Ons platform helpt het versneld elektrificeren van wagenparken, internationaal! Wij zijn een startup met grote ambities die we willen bereiken met een relatief klein en efficiënt team. Je krijg de kans om ontzettend veel te leren van

Bekijk vacature »

Senior Airport Developer ( System engineer)

De functie Nice to know (you) De nieuwe A-pier wordt de duurzaamste van Schiphol. Als deze af is ligt er 4000 vierkante meter zonnepanelen op het dak. En de toiletten? Die spoelen door met regenwater. we gaan ervoor: het creëren van de meest duurzame en hoogwaardige luchthavens ter wereld. een toekomstbestendig en duurzaam Schiphol. Daar werken we elke dag hard aan in team Development & Sustainability. Jij bent regisseur, expert én aanjager van de ontwikkeling van Schiphol. Connecting your world Hoe maak je de ambities en doelstellingen van Schiphol concreet in een project? De waarde voor Schiphol naar eisen die

Bekijk vacature »

Ervaren C#.NET developer

Functieomschrijving We zijn op zoek naar een ervaren C#.NET programmeur voor een moderne werkgever in de regio Prinsenbeek. Als programmeur zal je bezig zijn met het ontwikkelen van op maat gemaakte webapplicaties voor verschillende klanten, waarbij je ervoor zorgt dat complexe processen zo goed mogelijk worden ondersteund. Je takenpakket omvat onder andere: Werken met databases en dataopslagoplossingen, implementeren van beveiligingsoplossingen en het waarborgen van de beveiliging van applicaties en gegevens, evenals het schrijven van technische documentatie en gebruikershandleidingen. Het ontwikkelen en onderhouden van C#.NET-applicaties. Bijdragen aan het ontwerp en de architectuur van softwaretoepassingen. Het schrijven van hoogwaardige en herbruikbare codes.

Bekijk vacature »

Lead developer

Functie Als Lead developer wordt jij onderdeel van een multidisciplinair team van circa 23 software engineers. Als team werken jullie agile en zijn termen als Continuous Integration en Continuous Delivery dagelijkse koek. Jullie werken aan uitdagende en afwisselende projecten met als doel klanten een totaal oplossing aan te kunnen bieden. Jij wordt verantwoordelijk voor complete projecten waarbij jij als verantwoordelijke zorgt dat het project op de juiste manier blijft draaien. Zo haal jij ook de requirements op bij de klant en kijk jij samen met het team en met de salesafdeling hoeveel uren hiervoor nodig zijn. Daarnaast stuur jij jouw

Bekijk vacature »

.NET Developer

Functie omschrijving In deze functie ga je werken als C# Developer. Jij gaat aan de slag met de volgende taken: Maatwerk software bouwen; Huidige softwareprojecten verder uitbouwen en optimaliseren; Ideeën van de klant omzetten naar handige oplossingen en tools; Bovenstaande doe je middels de Microsoft- stack: C#, ASP.NET en MVC/ Entity Framework. Ben je net afgestudeerd aan een HBO opleiding Informatica, aarzel dan niet om te solliciteren. Dit is namelijk de ideale startersfunctie! Bedrijfsprofiel Deze organisatie is gevestigd in de regio van Boxtel. Het is van oorsprong een familiebedrijf, die gestart zijn met het bouwen van websites. Dit is door

Bekijk vacature »

Junior Front end developer Onderwijssoftware

Functie Als Junior front end developer kom jij terecht in een klein, maar hecht team bestaande uit 5 andere developers (waarvan 2 senioren, 2 medior en 1 junior). Met de gezamenlijke missie om “ieder kind te helpen met onze software” wordt er dagelijks gepassioneerd en hard gewerkt aan ons in-house ontwikkeld platform. Deze software is gebaseerd is op AI, machine Learning en wetenschappelijke inzichten. Dagelijks zul jij werken met onze high traffic webapplicatie. We hebben ruim 300.00 gebruikers en meer dan 2 miljard records waar je te maken mee krijgt! Verder zul jij je bezighouden met: – Het ontwikkelen van

Bekijk vacature »

Full Stack PHP Developer

Functieomschrijving Ervaren PHP Developer gezocht! Wij zijn op zoek naar een ervaren PHP Developer die het IT team van een organisatie in de regio Ermelo gaat versterken. Voor deze functie zijn we op zoek naar een enthousiaste en breed georiënteerde IT-er die deze innovatieve organisatie nog een stap verder gaat brengen. Wij zijn op zoek naar iemand die communicatief goed is en die zelfstandig problemen op kan lossen. Je bent verantwoordelijk voor het samenwerken met een externe partij het is hierbij jouw taak om deze partij uit te dagen op het geleverde werk. Het schrijven van concepten aan de AI

Bekijk vacature »

High level C++ QT Developer

Vacature details Vakgebied: Software/IT Opleiding: Senior Werklocatie: Eindhoven Vacature ID: 13486 Introductie Would you like to be involved in every aspect of software development for our exceptional products, from specification and design to testing and integration? If you're passionate about software development and eager to apply your programming skills to create customer-focused deliverables, then this is the perfect chance for you to expand your expertise. You can become a member of our Machine Control department's data-driven development team, where you'll design and build software solutions that optimize machine productivity. As a senior software design engineer, you'll participate in all phases

Bekijk vacature »

Junior Software Developer (HBO / WO)

Functie omschrijving Wij zijn op zoek naar een Junior Software Developer! Sta jij aan het begin van je carrière en heb je net je HBO of WO-diploma in de richting van ICT of Techniek mogen ontvangen? En heb jij grote affiniteit met software development? Dan hebben wij bij Jelling IT Professionals de perfecte opdrachtgever in de omgeving van Utrecht, die jou tot een volwaardig Fullstack Software Developer gaat opleiden. Binnen deze grote organisatie krijg je ruime en professionele trainingen die jouw in korte tijd vakbekwaam maken. Niet alleen het aan technisch aspect, maar ook zeker jouw persoonlijke ontwikkeling wordt veel

Bekijk vacature »

Junior .NET developer

Functie Als junior .NET Core developer wordt jij onderdeel van ons team met drie breed ontwikkelde software engineers en een flexibele schil met zes ervaren freelancers. Jij gaat mee in de visie van onze organisatie om als IoT partner in deze branche specifieke markt “het” platform te blijven innoveren en deze ook steeds slimmer te maken. Wij hopen dan ook zeker dit in de toekomst te kunnen realiseren met bijvoorbeeld Artificial Intelligence. De architectuur van ons platform is opgemaakt uit een deel eigen protocol, een interface laag en een laag welke de protocollen van derde partijen vertaald naar het eigen

Bekijk vacature »

Front-end Developer (HTML/CSS, Angular/React/Vue,

Functie Je zal aan de slag gaan in een klein, hecht team met front-end development experts die de ambitie delen mooi werk te leveren. Samen met hen zal je werken aan het gebruiksvriendelijk en interactief maken van complexe webapplicaties, websites en mobile apps. Je levert klanten wat ze nodig hebben terwijl je actief aan jezelf blijft werken met de ondersteuning vanuit je werkplek. Talen als Javascript programmeer jij vloeiend en je hebt kennis van frameworks als React en Angular. Je zou je het liefst nog veel meer ontwikkelen in verschillende front-end talen. Deze kennis deel je graag met je collega’s,

Bekijk vacature »

Fasttrack learning & development voor Java dev

Wat je gaat doen: Wij zoeken enthousiaste en ambitieuze junior en medior ontwikkelaars die toe zijn aan de volgende stap in hun carrière. Wij helpen je op je pad naar senior ontwikkelaar door ons fasttrack learning en development programma. Na een kort en intensief programma ga jij aan de slag bij klanten van DPA. Daarnaast krijg je veel ruimte om je te ontwikkelen als persoon en als specialist. De eerste maand gaan we aan de slag om je certificeringen te behalen waaronder OCP (Oracle Certified Professional). Daarnaast nemen we een deepdive in Spring Boot. Ook laten we je kennismaken met

Bekijk vacature »

C# .NET Developer

Functie omschrijving Wij zijn op zoek naar een C# .NET Developer voor een bedrijf in de omgeving van Utrecht! Wil jij werken voor een internationaal bedrijf waar je legio mogelijkheden krijgt als Software Ontwikkelaar? Grijp nu je kans! Je kunt een uitdagende rol gaan vervullen als C#.NET Developer binnen een internationaal bedrijf dat gevestigd is in omgeving van Utrecht. Je zult gaan samenwerken met collega's die over de hele wereld verspreid zitten. Dit bedrijf is zeer vooruitstrevend en werkt met de nieuwste technieken. Als C#.NET Developer ga jij je bezig houden met het volgende: Je blijft op de hoogte van

Bekijk vacature »

Java developer

Als Java Developer bij Sogeti ben je onderdeel van onze toonaangevende community die bestaat uit ruim 100 gepassioneerde professionals. In teamverband lever je mooie prestaties. Daarmee draag je aan bij de meerwaarde die wij leveren aan onze klanten. Geen werkdag is hetzelfde, je bent voortdurend bezig met het oplossen van allerlei complexe vraagstukken binnen bedrijfskritische systemen. Een voorbeeld hiervan is een cliënt-volgsysteem bij Reclassering Nederland. Andere klanten waar wij onder andere voor werken: KPN, Philips, Nationale-Nederlanden, Kamer van Koophandel, ABN AMRO, Bovemij, Arval en de Politie. Werken bij Sogeti Nieuwe ontwikkelingen volgen we op de voet en delen we binnen de

Bekijk vacature »
Lord Gaga

Lord Gaga

02/09/2015 14:02:17
Quote Anchor link
Hallo,

Ik heb een isometrich grid bestaand uit 10x10 tegels van elk 64x32 pixels.
Nu zou ik graag willen dat wanneer men op dat grid klikt, er wordt gekeken op welke tegel precies wordt geklikt.

Op internet staan verschillende formules om dit te controleren, maar ik krijg er geen werkend.

Dit is de code zoals ik het nu heb:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
var onClick = function(event)
{
    for (var x = 0; x < Grid.width; x += 1)
    {
        for (var y = 0; y < Grid.height; y += 1)
        {
            var left = (((Grid.width * Grid.SQUARE_WIDTH) / 2) - (Grid.SQUARE_WIDTH / 2)) + ((y - x) * Grid.SQUARE_HEIGHT);
            var top = (((y + x) * Grid.SQUARE_HEIGHT) / 2);

            // Controle of event.x en event.y binnen de coordinaten van deze tegel vallen.
        }
    }
}


Grid.width is de breedte van het grid, weergegeven in tegels (10).
Grid.height is de hoogte van het grid, weergeven in tegels (10).
Grid.SQUARE_WIDTH is de breedte van een tegel, weergegeven in pixels (64).
Grid.SQUARE_HEIGHT is de hoogte van een tegel, weergegeven in pixels (32).

Zou iemand mij kunnen helpen met de formule en hoe ik die in deze situatie toepas?

Alvast bedankt!
Gewijzigd op 02/09/2015 14:12:25 door Lord Gaga
 
PHP hulp

PHP hulp

03/01/2025 02:34:22
 

02/09/2015 15:30:22
Quote Anchor link
Wat is het voor een grid? Canvas? En waarom bestaat het grid niet uit DOM-elementen waarbij je niet zelf aan het rekenen hoeft?
Gewijzigd op 02/09/2015 15:30:34 door
 
Lord Gaga

Lord Gaga

02/09/2015 16:06:30
Quote Anchor link
Het grid bestaat uit DOM-elementen. Maar dan moet ik alsnog de positie van elke tegel berekenen + zelf controleren of een tegel is aangeklikt.

Intussen zag ik dat event.x en event.y de posities zijn vanaf het scherm, en niet vanaf de parent. Ik heb deze toegevoegd aan de berekening en nu werkt het. :-)

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
var onClick = function(event)
{
    for (var x = 0; x < Grid.width; x += 1)
    {
        for (var y = 0; y < Grid.height; y += 1)
        {
            var left = (((Grid.width * Grid.SQUARE_WIDTH) / 2) - (Grid.SQUARE_WIDTH / 2)) + ((y - x) * Grid.SQUARE_HEIGHT);
            var top = (((y + x) * Grid.SQUARE_HEIGHT) / 2);

            var xRadius = Math.abs((event.x - editor.offsetLeft) - (left + (Grid.SQUARE_WIDTH / 2)));
            var yRadius = Math.abs((event.y - editor.offsetTop) - (top + (Grid.SQUARE_HEIGHT / 2)));

            var radius = (xRadius / Grid.SQUARE_WIDTH) + (yRadius / Grid.SQUARE_HEIGHT);

            if (radius <= 0.5)
            {
                var tile = document.createElement('div');
                {
                    tile.setAttribute('class', 'tile');

                    tile.style.setProperty('left', left + 'px');
                    tile.style.setProperty('top', top + 'px');
                }

                floor.appendChild(tile);

                return false;
            }
        }
    }
};
 

02/09/2015 16:08:52
Quote Anchor link
Mooi. Het helpt soms al als je het aan iemand uitlegt! :)
 
Eddy E

Eddy E

02/09/2015 16:20:08
Quote Anchor link
Waarom dat grid niet gewoon met HTML5 zelf tekenen?
Dan kan je gewoon iets als <span id="grid_h38_b83"> maken.

Met behulp van http://jdan.github.io/isomer/ moet dat niet moeilijk zijn...
Of via http://www.angrycoding.com/2011/04/isometric-grid-generator-based-on-html5.html ...
Gewijzigd op 02/09/2015 21:22:19 door Eddy E
 
Remco van der Velde

Remco van der Velde

03/09/2015 12:18:43
Quote Anchor link
Ik denk dat je te moeilijk denkt, als je toch dom elementen hebt in het grid, waarom geen bind click op zo'n dom element zelf, dan hoef je niet te gaan berekenen waar er en welk element via het grid wordt geklikt.
 
Lord Gaga

Lord Gaga

04/09/2015 10:20:49
Quote Anchor link
@Eddy: Dit is een simpele eindopdracht voor school (vak "DHTML") en daar gebruik ik liever DOM elementen voor.

@Remco: Dat werkt niet omdat die div'jes rechthoekig zijn en elkaar overlappen.
Gewijzigd op 04/09/2015 10:32:34 door Lord Gaga
 



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.