Iceberger Remixed and Improved – Iceberg Simulator

Posted In: Fun | Water

The code has been updated to allow for multiple chunks of icebergs now, which can occur via melting if you draw an iceberg a certain way.

Draw (or choose) an iceberg and visualize how it will float and melt

I was so impressed with the interactive Iceberger tool that Josh Tauberer (@JoshData) made that I had to modify it and add some additional features. Click here to see the original. My additions allow you to conjure up pre-made “icebergs” to see how they float and also allow some interaction. Try “poking” the icebergs you make.

Josh and I were both inspired by a tweet by Megan Thompson-Munson (@GlacialMeg).

Instructions
You can choose between 3 different iceberg creation options:

  • Draw Iceberg – the original Iceberger option. Choose this option and draw any shape you want and see how it floats.
  • Select State – Choose this option and select from one of the states of the United States to see how it will float.
  • Select Shape = Choose this option and select from one of the premade shapes to see how it will float.

Once the iceberg has been created, you can also affect it in a couple of different ways:

  • Click on the Iceberg – This lets you push on the left side of the iceberg to induce some rotation and see if there are multiple stable orientations. Click it several times in a row if you want to flip the iceberg over. If you push on the right size it will rotate the iceberg clockwise and if you push on the left size, it will rotate counter clockwise. if you push in the middle third of the iceberg, it will push it straight down.
  • Melting – You can select between different options – No melting, slow medium and fast. This took awhile to code correctly. Previously, I’d just scale parts of the iceberg but this new code actually takes material away from the surface of the iceberg in a uniform way. It works more like you would expect melting ice to behave.
  • Changing the Sky – You can change the colors of the sky between sunrise, midday and sunset colors.
  • Showing forces – You can toggle whether to show the center of buoyancy (B) and center of gravity (B) of the iceberg.

Some Physics – no equations
The force of gravity (G) affects the entire body regardless of where it is or how it is oriented. If you show the forces, the red dot labeled G shows where the center of mass of the iceberg is. The blue dot labeled B shows where the center of buoyancy is. This is the center of mass of the part of the iceberg that is submerged. The force acting on the submerged part is equal to the volume of water displaced. If the center of buoyancy is below the center of gravity, then the forces will be equal and object will be in stable equilibrium. If the center of buoyancy is somewhere other than under the center of gravity, then the buoyant force will be pushing up on a different place than the gravity force and this will induce a rotation until they are directly over one another.

The code has been updated so that multiple icebergs are now allowed. Melting can separate a single piece of iceberg into multiple pieces, just as in real life. The melting process was a bit difficult to program because of the complexity of shapes that could be produced.

If you have additional suggestions for shapes or countries to add to the list or other improvements to make, let me know in the comments. Also if you are using this as a teaching tool, I’d love to hear how you are incorporating it into your curriculum.

Sources and Tools:
This visualization uses HTML/CSS/Javascript code from the Iceberger app to simulate the buoyancy of icebergs. Melting was accomplished with the help of code from the turf.js, polygon-offset and simplify.js javascript libraries. Additional elements of the UI and other features are also made using HTML, CSS and javascript.

Iceberger simulation




28 Comments »


28 Responses to Iceberger Remixed and Improved – Iceberg Simulator

  1. Anna says:

    Hi, I’m getting a tattoo done if my favourite iceberg I saw in Antarctica. I’d love to get the below surface shape as close to realistic as possible. Would someone be able to help me with drawing this? My appointment is 18 Jan

  2. Andrew says:

    Nice work!
    The melting should be coded for the submerged section to melt faster than the section exposed only to air. The square should melt into interesting, pseudo-organic shapes and tumbling over, rather than just becoming smaller.

  3. Paddy says:

    Love this, but the North of Ireland is missing from the outline of Ireland

  4. Ed Roste says:

    Love all the work you have done on the website. Good visualization of the California data. And this page is fun to play with. However, in this iceberg graphic, you should rename Canada “Continental Canada” (much like you’ve done with the US) because you have left out all the many arctic islands that are part of Canada and make up probably 15-20% of our sovereign territory.

  5. Maks says:

    Can there be a hexagon-shape iceberg?

  6. We should add Canadian provinces. Cuz I fell like Canada is overshadowed by the usa

  7. Suzanne Hubbard says:

    The iceberg Titanic stayed afloat better than the ship Titanic.

  8. Tharin Blumenschein says:

    Can you add Brazil to the list?

  9. Master says:

    Chido

  10. Akari2436 says:

    We should add the central asia countries! (Kazakhstan, Uzbekistan, Tajikistan, Kyrgyzstan and Turkmenistan)

  11. FoundonReddit says:

    Why no Pakistan in the country drop down list?

  12. Susanne says:

    Nice! Have you considered accounting for the submerged ice melting faster than the ice that is above water? That would be really cool and allow icebergs to roll over spontanously

    • chris says:

      It used to do that before I changed the melting algorithm. I’m not sure how I would do that with my new algorithm but I’ll think about it.

  13. Michalis says:

    Greece, with all its islands, is gonna be fun to see melt!

  14. Matt says:

    No cats?

  15. Abbas says:

    Beware! Europe part of Turkey which consist of Istanbul doesnt included in Turkey map!

  16. David Finch says:

    That’s specifically why I was making a dumbbell-shaped object…

  17. george says:

    I’m not gonna say that I drew things that I drew in my friend’s notebooks in middle school, but I definitely drew what I drew in my friend’s notebooks in middle school. And I ran a fun little “experiment” about the buoyancy of different sizes and shapes. Thank you for helping me brighten my day a bit 🙂

  18. Cody says:

    The witch pre-made must be made of wood, not ice.

  19. Emir Fassad says:

    The sim doesn’t do well with dumbbell-shaped objects when calculating melting.

    • chris says:

      yes, I’ve tried several different ways to simulate melting, but none work well, partly because I don’t want the object to break into multiple pieces which a dumbbell would.

    • chris says:

      The newer version of this simulation now handles dumbbell objects better as they can melt and separate at thinner parts into multiple chunks.

Leave a Reply

Your email address will not be published. Required fields are marked *