Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Embedding a javascript simulation that uses the p5 library and a custom script


gmo

Question

Hi, 

I am trying to add a simulation to my website. I have everything running with javascript and an index.html on my local workspace, but am wondering how to place it in an online page. I have tried using code injection, but have failed miserably.

I am using the p5.js library for visualization and a local script called Boids-2D .

Does anyone know where and how to put this? Sorry if it is super easy, but I am very new to web development. 

Thanks!

 

This is my local index.html code

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
 
    <title>2D Boids</title>
    <script src="https://cdn.jsdelivr.net/npm/p5@1.1.9/lib/p5.js"></script>
    <script type="text/javascript" src="Boids-2D.js"></script>
</head>
<body></body>
</html>
Link to post
  • Answers 1
  • Created
  • Last Reply

Top Posters For This Question

Popular Days

Top Posters For This Question

Popular Posts

Hi,  I am trying to add a simulation to my website. I have everything running with javascript and an index.html on my local workspace, but am wondering how to place it in an online page. I have t

Ok, so I have figured it mostly out. But I am still getting some issues. The remaining issue is that my window is in the wrong place and it is just above the footer, while it should be sandwiched

1 answer to this question

Recommended Posts

  • 0

Ok, so I have figured it mostly out. But I am still getting some issues.

The remaining issue is that my window is in the wrong place and it is just above the footer, while it should be sandwiched between two texts, where the code block is.

I have injected into a code block this as html:

<body>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
 
    <title>2D Boids</title>
    <script src="https://cdn.jsdelivr.net/npm/p5@1.1.9/lib/p5.js"></script>
 
 <script>
// HERE I PASTED MY SUPER LONG SCRIPT
</script>
 
</body>
 

 

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...