An intermodal container is a standardized "box", into which one can load almost any freight one would like to transport.

An intermodal containers can be used for different modes of transportation: it can be loaded on train cars, on trucks, and on ships. Thanks to intermodal containers, shipments (e.g., mobile phones from China, pineapples from South America, or chocolate from Switzerland) can be transported from source to destination across multiple modes of transportation. For example, it can be shipped by train from a factory to a harbor, transported by ship across an ocean, and hauled by truck to its final destination, all without having to be individually loaded and unloaded.

To ensure that a container fits and can be properly attached, a whole bunch of international standards specify all the relevant aspects, such as the exact length, width, and height. Because these standards are released by the International Standards Organization (ISO), the containers are also known as ISO containers.

There are different kinds of ISO containers; the most common type is the 1AA container, which is 40 feet long, 8 feet wide, and 8.5 feet tall. Another type is the 1CC container, which is half as long.

Decomposition

Let's decompose a container, as seen from the long side.

Before we start with the decomposition, let's have a closer look.

Yes, there are three different colors: orange, dark orange, and bright orange.

There are different ways to compose this graphic. We will pick an approach that allows us to produce areas in all the three colors given only a single base color. Specifically, we will create a large rectangle in the base color, then we will overlay different areas of that rectangle with smaller semi-transparent bright or dark rectangles.

Hover with your mouse over the graphic. Do you see how the dark and bright cirles are semi-transparent, and the checkerboard pattern shows through?

Now let's overlay those circle over a rectangle that is colored in a given base color, e.g., in our own container_orange.

Back to our container:

So, we can compose the container from a background rectangle that is 40 foot long and 8.5 foot tall. We overlay that with two dark semi-transparent rectangles on either end and along the bottom of the container. Then we overlay it with a sequence of ribs: each rib consists of a narrow dark semi-transparent rectangle, a fully transparent gap, and a narrow bright semi-transparent rectangle.

Implementation

Let's implement a function to compose a container:

def container(type: str, foot: float, color: Color) -> Graphic

To compose the container we saw above, we would call the function as follows:

container("1AA", 80, container_orange)

The function takes the following parameters:

• type -- type type of ISO container, either "1AA" or "1CC"
• foot -- a scaling factor: it specifies how many pixes should be used to draw something that is one foot long (we use feet as the unit of length because the ISO standard defines container sizes in feet, not in meters)
• color -- the base color of the container

A 1AA container is 40 feet long, a 1CC container is 20 foot long. Both are 8 feet and 6 inches (8.5 feet) tall. We draw 42 ribs for a 1AA container, and 21 ribs for a 1CC container.

What You Learned

In terms of graphics programming, you practiced composing graphics by pinning them at various points. You also learned how to create partially transparent colors, and how overlaying graphics that are partially transparent on top of other graphics affects the resulting color.

Besides informatics, you also learned about freight containers. You may want to explore other activities centered around containers to discover more about this idea that revolutionized transportation in today's interconnected world!