Aktionen

Working with p5: Unterschied zwischen den Versionen

Aus exmediawiki

← Zum vorherigen Versionsunterschied
 
(13 dazwischenliegende Versionen derselben Benutzerin werden nicht angezeigt)
Zeile 1: Zeile 1:
<br>
back to [[Material%26Process-25 | material&process summer 2025]]<br>
<br>
=== p5 ===
=== p5 ===
<br>
<br>
first a link to the [https://editor.p5js.org/ editor], for working in a browser
<br>
<br>
==== for working in a browser ====
link to the [https://editor.p5js.org/ editor],
<br>
==== for working locally ====
some explanation for [https://exmediawiki.khm.de/index.php/Testp5 working locally]
some explanation for [https://exmediawiki.khm.de/index.php/Testp5 working locally]
<br>
<br>
<br>
<br>
in our seminars, when working with technologies and machines like laser cutter and risograph printing:
==== for creating certain output ====
when working with technologies and machines like laser cutter and risograph printing<br>
 
it is necessary to extract svg from our p5-sketches, so we need the following libraries and the version 0.7.1 of p5<br>
it is necessary to extract svg from our p5-sketches, so we need the following libraries and the version 0.7.1 of p5<br>


Zeile 12: Zeile 23:
==== Copy and paste the following libraries inside the <head> tags of the index.html of the P5: ====
==== Copy and paste the following libraries inside the <head> tags of the index.html of the P5: ====
<br>
<br>
  <head>
<head>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.1/p5.min.js"></script>
     <script src="https://cdn.jsdelivr.net/npm/p5@1.11.5/lib/p5.js"></script>
 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.11.3/addons/p5.sound.min.js"></script>
    <script src="https://unpkg.com/p5.js-svg@1.3.1"></script>
<script src="https://cdn.jsdelivr.net/npm/p5.js-svg@1.6.0/dist/p5.svg.min.js"></script>
   
     <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.1/addons/p5.dom.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.1/addons/p5.sound.min.js"></script>
     <link rel="stylesheet" type="text/css" href="style.css">
     <link rel="stylesheet" type="text/css" href="style.css">
     <meta charset="utf-8" />
     <meta charset="utf-8" />


   </head>
   </head>
 
<br><br>
 
===== in your sketch.js put in the following: =====
<br>
 
 
function keyPressed() {
  if (key == 's') {
    save("example.svg");
  }    //if
}  //function keypresssed
<br>
<br>
<br>
<br>
<br>

Aktuelle Version vom 16. Juni 2025, 13:28 Uhr


back to material&process summer 2025

p5



for working in a browser

link to the editor,

for working locally

some explanation for working locally

for creating certain output

when working with technologies and machines like laser cutter and risograph printing

it is necessary to extract svg from our p5-sketches, so we need the following libraries and the version 0.7.1 of p5


Copy and paste the following libraries inside the <head> tags of the index.html of the P5:


<head> 

   <script src="https://cdn.jsdelivr.net/npm/p5@1.11.5/lib/p5.js"></script>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.11.3/addons/p5.sound.min.js"></script>

<script src="https://cdn.jsdelivr.net/npm/p5.js-svg@1.6.0/dist/p5.svg.min.js"></script> 

   <link rel="stylesheet" type="text/css" href="style.css">
   <meta charset="utf-8" />

 </head>



in your sketch.js put in the following:



function keyPressed() { 

 if (key == 's') {
   save("example.svg");
  }    //if

} //function keypresssed


Abgerufen von „https://exmediawiki.khm.de/index.php?title=Working_with_p5&oldid=10420“