# Processing js help (graveyard scene)

**URL:** <https://discourse.processing.org/t/processing-js-help-graveyard-scene/29647>\
**Category:** Project Guidance\
**Created:** [April 26, 2021, 8:15am UTC](https://discourse.processing.org/t/processing-js-help-graveyard-scene/29647 "2021-04-26T08:15:50Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Nameless](https://avatars.discourse-cdn.com/v4/letter/n/779978/32.png) [@Nameless](https://discourse.processing.org/u/Nameless)\
**Post date:** [April 26, 2021, 8:15am UTC](https://discourse.processing.org/t/processing-js-help-graveyard-scene/29647/1 "2021-04-26T08:15:50Z")

</div>

I am a beginner in coding. I like to code. Can someone help me to create a code a graveyard scene (I’m writing a story).

Pls help me. I would greatly appreciate it.

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [April 26, 2021, 2:12pm UTC](https://discourse.processing.org/t/processing-js-help-graveyard-scene/29647/2 "2021-04-26T14:12:10Z")

</div>

When you have an image you can just load the image and display as a background

---

<div class="post-metadata">

**Author:** ![Nameless](https://avatars.discourse-cdn.com/v4/letter/n/779978/32.png) [@Nameless](https://discourse.processing.org/u/Nameless)\
**Post date:** [April 26, 2021, 2:44pm UTC](https://discourse.processing.org/t/processing-js-help-graveyard-scene/29647/3 "2021-04-26T14:44:13Z")

</div>

Thank you for replying. I want it to be like a line art or animation…

and how do I insert an image.

---

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [April 26, 2021, 2:49pm UTC](https://discourse.processing.org/t/processing-js-help-graveyard-scene/29647/4 "2021-04-26T14:49:25Z")

</div>

Hello,

There Processing website has tutorials, examples, references and much more!

_[https://processing.org/](https://processing.org/)_

Also look for Coding Train on YouTube.

`:)`

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [April 26, 2021, 2:50pm UTC](https://discourse.processing.org/t/processing-js-help-graveyard-scene/29647/5 "2021-04-26T14:50:40Z")

</div>

**For Images**

Check [reference | p5.js](https://p5js.org/reference/#group-Image)

See loadImage and image

**For Line Art**

And for line art, see commands line or rect and arc to make tombstones (see also link below)

---

<div class="post-metadata">

**Author:** ![javagar](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/javagar/32/11434_2.png) [@javagar](https://discourse.processing.org/u/javagar)\
**Post date:** [April 26, 2021, 2:51pm UTC](https://discourse.processing.org/t/processing-js-help-graveyard-scene/29647/6 "2021-04-26T14:51:19Z")

</div>

Here is a sample public domain image:

![640px-CalvaryCemeteryQueens_edit](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/2/2cc5779c075e7506f921e76a030bcb3d50b6c618.jpeg)

Here is some sample p5.js code for displaying it:

```auto
let graveyard_image;
/*
Public domain photo of Calvary Cemetery, Queens, New York
Downloaded from https://en.wikipedia.org/wiki/Cemetery
on April 26, 2021

Original photo by Plowboylifestyle
https://en.wikipedia.org/wiki/User:Plowboylifestyle
*/

function preload() {
  graveyard_image = loadImage("640px-CalvaryCemeteryQueens_edit.jpeg");
}
function setup() {
  createCanvas(640, 426);
}

function draw() {
  image(graveyard_image, 0, 0);
}

```

Download the image and place it in the same directory or folder as the code, or place the image in a different directory or folder and modify the code accordingly.

Be sure to check the references that @Chrisir and @glv have posted.

_EDIT (April 26, 2021):_

Also see [p5.js: Examples: Shape Primitives](https://p5js.org/examples/form-shape-primitives.html).

… and here is an adaptation of the [p5.js Flocking example](https://p5js.org/examples/simulate-flocking.html):

- [Flocking in the Graveyard](https://editor.p5js.org/javagar/sketches/jjCttfJbx)