{"id":435,"date":"2022-05-19T10:32:12","date_gmt":"2022-05-19T10:32:12","guid":{"rendered":"https:\/\/djoko.nl\/home6\/?p=435"},"modified":"2022-07-02T04:24:59","modified_gmt":"2022-07-02T04:24:59","slug":"sterren-met-class-in-p5","status":"publish","type":"post","link":"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/","title":{"rendered":"sterren met class in p5"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">P5 is de omzetting van Processing in een library in javascript. In deze blog wordt in stappen getoond hoe je een class-functie kunt maken javascript. We maken een sterrenhemel, zie hieronder.<\/p>\n\n\n\n<iframe style=\"height: 230px; border: 0px solid;\" src=\"https:\/\/djoko.nl\/home6\/p5\/ster\/index_1a_2.html\"><\/iframe>\n\n\n\n<!--more-->\n\n\n\n<p class=\"wp-block-paragraph\">In vijf stappen gaan we hier met P5-javascript aan de slag. Hier is de eerste tutorial. Het bestand vind je in deze <a href=\"https:\/\/djoko.nl\/home6\/p5\/ster\/sterren_1a.zip\">download-link<\/a>.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-vimeo wp-block-embed-vimeo wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"videotut_sterren_1a_b2.mp4\" src=\"https:\/\/player.vimeo.com\/video\/725367368?dnt=1&amp;app_id=122963\" width=\"580\" height=\"326\" frameborder=\"0\" allow=\"autoplay; fullscreen; picture-in-picture; clipboard-write; encrypted-media\"><\/iframe>\n<\/div><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Hieronder staat het tweede deel met een for-loop. De bestanden (versie b dus) vind je in deze <a href=\"https:\/\/djoko.nl\/home6\/p5\/ster\/sterren_1b.zip\">download-link<\/a>.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-vimeo wp-block-embed-vimeo wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"videotut_sterren_1b_2.mp4\" src=\"https:\/\/player.vimeo.com\/video\/725418499?dnt=1&amp;app_id=122963\" width=\"580\" height=\"326\" frameborder=\"0\" allow=\"autoplay; fullscreen; picture-in-picture; clipboard-write; encrypted-media\"><\/iframe>\n<\/div><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">En hieronder is deel 3 waarbij we een class-function maken. De bestanden (versie c dus) vind je in deze <a href=\"https:\/\/djoko.nl\/home6\/p5\/ster\/sterren_1c.zip\">download-link<\/a>. Javascript is niet officieel een object-geori\u00ebnteerde progammeertaal maar we noemen het toch een class.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-vimeo wp-block-embed-vimeo wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"tut_1c_1.mp4\" src=\"https:\/\/player.vimeo.com\/video\/725628509?dnt=1&amp;app_id=122963\" width=\"580\" height=\"326\" frameborder=\"0\" allow=\"autoplay; fullscreen; picture-in-picture; clipboard-write; encrypted-media\"><\/iframe>\n<\/div><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">En dan nu tutorial nummer 4. De class-functie wordt uitgebreid en we maken een Array (lijst) waar we alle instances van de class Ster in zetten. De bestanden vind je hier: <a href=\"https:\/\/djoko.nl\/home6\/p5\/ster\/sterren_1c.zip\">d<\/a><a href=\"https:\/\/djoko.nl\/home6\/p5\/ster\/sterren_1d.zip\">ownload-link<\/a>.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-vimeo wp-block-embed-vimeo wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"tut4_1a_1.mp4\" src=\"https:\/\/player.vimeo.com\/video\/725969928?dnt=1&amp;app_id=122963\" width=\"580\" height=\"326\" frameborder=\"0\" allow=\"autoplay; fullscreen; picture-in-picture; clipboard-write; encrypted-media\"><\/iframe>\n<\/div><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Tot slot het script om de sterrenlucht  te realiseren, zoals die helemaal bovenaan te zien is. In deze tutorial wordt niet life getypt, alleen de nieuwe scriptregels worden uitgelegd, hier de <a href=\"https:\/\/djoko.nl\/home6\/p5\/ster\/sterren_1e.zip\">link<\/a> naar de bestanden &#8220;e&#8221;. De class zou nu beter eenvoudiger zijn, zonder de parameters.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-vimeo wp-block-embed-vimeo wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"tut5_1.mp4\" src=\"https:\/\/player.vimeo.com\/video\/726003725?dnt=1&amp;app_id=122963\" width=\"580\" height=\"326\" frameborder=\"0\" allow=\"autoplay; fullscreen; picture-in-picture; clipboard-write; encrypted-media\"><\/iframe>\n<\/div><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>P5 is de omzetting van Processing in een library in javascript. In deze blog wordt in stappen getoond hoe je een class-functie kunt maken javascript. We maken een sterrenhemel, zie hieronder.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[10,1],"tags":[],"class_list":["post-435","post","type-post","status-publish","format-standard","hentry","category-programmeren","category-uncategorized"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.2 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>sterren met class in p5 - djoko<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/\" \/>\n<meta property=\"og:locale\" content=\"nl_NL\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"sterren met class in p5 - djoko\" \/>\n<meta property=\"og:description\" content=\"P5 is de omzetting van Processing in een library in javascript. In deze blog wordt in stappen getoond hoe je een class-functie kunt maken javascript. We maken een sterrenhemel, zie hieronder.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/\" \/>\n<meta property=\"og:site_name\" content=\"djoko\" \/>\n<meta property=\"article:published_time\" content=\"2022-05-19T10:32:12+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-07-02T04:24:59+00:00\" \/>\n<meta name=\"author\" content=\"Jean-Fran\u00e7ois Roebers\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Geschreven door\" \/>\n\t<meta name=\"twitter:data1\" content=\"Jean-Fran\u00e7ois Roebers\" \/>\n\t<meta name=\"twitter:label2\" content=\"Geschatte leestijd\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minuut\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/\"},\"author\":{\"name\":\"Jean-Fran\u00e7ois Roebers\",\"@id\":\"https:\/\/djoko.nl\/home6\/#\/schema\/person\/f3d259e86ce771777335741dba143a1c\"},\"headline\":\"sterren met class in p5\",\"datePublished\":\"2022-05-19T10:32:12+00:00\",\"dateModified\":\"2022-07-02T04:24:59+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/\"},\"wordCount\":205,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/djoko.nl\/home6\/#\/schema\/person\/f3d259e86ce771777335741dba143a1c\"},\"articleSection\":[\"programmeren\",\"Uncategorized\"],\"inLanguage\":\"nl-NL\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/\",\"url\":\"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/\",\"name\":\"sterren met class in p5 - djoko\",\"isPartOf\":{\"@id\":\"https:\/\/djoko.nl\/home6\/#website\"},\"datePublished\":\"2022-05-19T10:32:12+00:00\",\"dateModified\":\"2022-07-02T04:24:59+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/#breadcrumb\"},\"inLanguage\":\"nl-NL\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/djoko.nl\/home6\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"sterren met class in p5\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/djoko.nl\/home6\/#website\",\"url\":\"https:\/\/djoko.nl\/home6\/\",\"name\":\"djoko\",\"description\":\"reflectie op creatie van beeld, woord en muziek\",\"publisher\":{\"@id\":\"https:\/\/djoko.nl\/home6\/#\/schema\/person\/f3d259e86ce771777335741dba143a1c\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/djoko.nl\/home6\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"nl-NL\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\/\/djoko.nl\/home6\/#\/schema\/person\/f3d259e86ce771777335741dba143a1c\",\"name\":\"Jean-Fran\u00e7ois Roebers\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"nl-NL\",\"@id\":\"https:\/\/djoko.nl\/home6\/wp-content\/uploads\/2025\/09\/djoko_logo.jpg\",\"url\":\"https:\/\/djoko.nl\/home6\/wp-content\/uploads\/2025\/09\/djoko_logo.jpg\",\"contentUrl\":\"https:\/\/djoko.nl\/home6\/wp-content\/uploads\/2025\/09\/djoko_logo.jpg\",\"width\":148,\"height\":48,\"caption\":\"Jean-Fran\u00e7ois Roebers\"},\"logo\":{\"@id\":\"https:\/\/djoko.nl\/home6\/wp-content\/uploads\/2025\/09\/djoko_logo.jpg\"},\"description\":\"Mijn interesse in vormgeving en ontwerpen in het algemeen, gebruik van programmeertalen en digitaal gereedschap, relaties met geschiedenis en wiskunde, combineer ik in deze blog.\",\"sameAs\":[\"http:\/\/djoko.nl\/home6\",\"https:\/\/www.linkedin.com\/in\/jean-franois-roebers-a14408\/\"],\"url\":\"https:\/\/djoko.nl\/home6\/index.php\/author\/jean_admin\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"sterren met class in p5 - djoko","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/","og_locale":"nl_NL","og_type":"article","og_title":"sterren met class in p5 - djoko","og_description":"P5 is de omzetting van Processing in een library in javascript. In deze blog wordt in stappen getoond hoe je een class-functie kunt maken javascript. We maken een sterrenhemel, zie hieronder.","og_url":"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/","og_site_name":"djoko","article_published_time":"2022-05-19T10:32:12+00:00","article_modified_time":"2022-07-02T04:24:59+00:00","author":"Jean-Fran\u00e7ois Roebers","twitter_card":"summary_large_image","twitter_misc":{"Geschreven door":"Jean-Fran\u00e7ois Roebers","Geschatte leestijd":"1 minuut"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/#article","isPartOf":{"@id":"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/"},"author":{"name":"Jean-Fran\u00e7ois Roebers","@id":"https:\/\/djoko.nl\/home6\/#\/schema\/person\/f3d259e86ce771777335741dba143a1c"},"headline":"sterren met class in p5","datePublished":"2022-05-19T10:32:12+00:00","dateModified":"2022-07-02T04:24:59+00:00","mainEntityOfPage":{"@id":"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/"},"wordCount":205,"commentCount":0,"publisher":{"@id":"https:\/\/djoko.nl\/home6\/#\/schema\/person\/f3d259e86ce771777335741dba143a1c"},"articleSection":["programmeren","Uncategorized"],"inLanguage":"nl-NL","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/","url":"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/","name":"sterren met class in p5 - djoko","isPartOf":{"@id":"https:\/\/djoko.nl\/home6\/#website"},"datePublished":"2022-05-19T10:32:12+00:00","dateModified":"2022-07-02T04:24:59+00:00","breadcrumb":{"@id":"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/#breadcrumb"},"inLanguage":"nl-NL","potentialAction":[{"@type":"ReadAction","target":["https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/djoko.nl\/home6\/index.php\/2022\/05\/19\/sterren-met-class-in-p5\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/djoko.nl\/home6\/"},{"@type":"ListItem","position":2,"name":"sterren met class in p5"}]},{"@type":"WebSite","@id":"https:\/\/djoko.nl\/home6\/#website","url":"https:\/\/djoko.nl\/home6\/","name":"djoko","description":"reflectie op creatie van beeld, woord en muziek","publisher":{"@id":"https:\/\/djoko.nl\/home6\/#\/schema\/person\/f3d259e86ce771777335741dba143a1c"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/djoko.nl\/home6\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"nl-NL"},{"@type":["Person","Organization"],"@id":"https:\/\/djoko.nl\/home6\/#\/schema\/person\/f3d259e86ce771777335741dba143a1c","name":"Jean-Fran\u00e7ois Roebers","image":{"@type":"ImageObject","inLanguage":"nl-NL","@id":"https:\/\/djoko.nl\/home6\/wp-content\/uploads\/2025\/09\/djoko_logo.jpg","url":"https:\/\/djoko.nl\/home6\/wp-content\/uploads\/2025\/09\/djoko_logo.jpg","contentUrl":"https:\/\/djoko.nl\/home6\/wp-content\/uploads\/2025\/09\/djoko_logo.jpg","width":148,"height":48,"caption":"Jean-Fran\u00e7ois Roebers"},"logo":{"@id":"https:\/\/djoko.nl\/home6\/wp-content\/uploads\/2025\/09\/djoko_logo.jpg"},"description":"Mijn interesse in vormgeving en ontwerpen in het algemeen, gebruik van programmeertalen en digitaal gereedschap, relaties met geschiedenis en wiskunde, combineer ik in deze blog.","sameAs":["http:\/\/djoko.nl\/home6","https:\/\/www.linkedin.com\/in\/jean-franois-roebers-a14408\/"],"url":"https:\/\/djoko.nl\/home6\/index.php\/author\/jean_admin\/"}]}},"_links":{"self":[{"href":"https:\/\/djoko.nl\/home6\/index.php\/wp-json\/wp\/v2\/posts\/435","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/djoko.nl\/home6\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/djoko.nl\/home6\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/djoko.nl\/home6\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/djoko.nl\/home6\/index.php\/wp-json\/wp\/v2\/comments?post=435"}],"version-history":[{"count":24,"href":"https:\/\/djoko.nl\/home6\/index.php\/wp-json\/wp\/v2\/posts\/435\/revisions"}],"predecessor-version":[{"id":473,"href":"https:\/\/djoko.nl\/home6\/index.php\/wp-json\/wp\/v2\/posts\/435\/revisions\/473"}],"wp:attachment":[{"href":"https:\/\/djoko.nl\/home6\/index.php\/wp-json\/wp\/v2\/media?parent=435"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/djoko.nl\/home6\/index.php\/wp-json\/wp\/v2\/categories?post=435"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/djoko.nl\/home6\/index.php\/wp-json\/wp\/v2\/tags?post=435"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}