{"id":704,"date":"2024-01-10T07:45:37","date_gmt":"2024-01-10T12:45:37","guid":{"rendered":"https:\/\/blogs.mathworks.com\/graphics-and-apps\/?p=704"},"modified":"2026-01-30T11:45:42","modified_gmt":"2026-01-30T16:45:42","slug":"creating-ridgeline-plots-from-pulsars-to-pop-culture","status":"publish","type":"post","link":"https:\/\/blogs.mathworks.com\/graphics-and-apps\/2024\/01\/10\/creating-ridgeline-plots-from-pulsars-to-pop-culture\/","title":{"rendered":"Creating Ridgeline Plots: From Pulsars To Pop Culture"},"content":{"rendered":"
\n
\n

\"Open<\/a><\/p>\n

\n
In 1979, an English rock band produced what Rolling Stone would describe as one of the best albums of all time<\/span> with an album cover that would become iconic in data visualization. Joy Division's album Unknown Pleasures<\/span><\/a> (1979) features a stack of wavy lines that depict activity emanating from the first pulsar star discovered, PSR B1919+21. Starting with the death of a star, we'll look at the timeline of events that led to this pop culture classic and then we'll learn how to create ridgeline plots in 2D, 3D, and polar coordinates in MATLAB.<\/div>\n
\"\"<\/div>\n
Joy Division - Unknown Pleasures album cover.<\/div>\n
Factory Records<\/span><\/div>\n

The backstory<\/h2>\n

Collapse of a supergiant<\/h3>\n
Millions of years ago a star within the Milky Way galaxy exploded into a supernova leaving behind an extremely compressed, densely packed neutron star with a diameter of about 19 km (12 mi) containing more than 466,000 times the mass of Earth. As a result of the quick collapse and extreme compression, the star\u2019s rotation accelerated in the same way an ice skater spins faster by pulling their arms toward their body. The star formed a magnetic field a quadrillion times stronger than Earth\u2019s with magnetic dipoles offset from its rotation axis. With every rotation of the star, every 1.337 seconds, a beam of electromagnetic radiation emitting from its magnetic poles sweeps across space at the speed of light like a lighthouse beacon waiting to be discovered.<\/div>\n

Discovery of a 1000-year-old signal<\/h3>\n
In 1967 Jocelyn Bell Burnell, a postgraduate student at the University of Cambridge, was studying radio signals from quasars using a custom-built radio telescope. The telescope happened to intercept pulsating beams of electromagnetic radiation that departed PSR B1919+21 one thousand years prior and the radiation happened to be within the radio frequency range of the telescope. As the radio waves reached the telescope\u2019s antennas, the signal was amplified and converted to a voltage signal that moved a pen along a continuously scrolling sheet of paper producing the strip chart<\/span> shown below. The power and regularity of this recurrent extraterrestrial signal with a fixed period of ~1.3 seconds seemed artificial at first, earning it the nickname LGM <\/span>(little green men), but it was soon realized that Bell and her team had discovered pulsar stars and the world had its first visualization of a pulsating neutron star.<\/div>\n
\"\"<\/div>\n
A strip chart showing the first confirmed observation of PSR B1919+21, initially named CP1919.<\/div>\n
Churchill Archives Center and the Hewish family, ref. HWSH Acc 355<\/span>.<\/div>\n

A creative leap into digital data visualization<\/h3>\n
Around the time Bell published her work (1968, Nature<\/span><\/a>), data visualization was entering the digital revolution. Harold Craft, Jr, a graduate student at Cornell University, set out to investigate whether there were patterns in the variation of pulsar waveforms. Craft recorded radio signals from PSR B1919+21 using the most sensitive radio telescope available at the time, located at the Arecibo Observatory in Puerto Rico. Rather than creating analog strip charts in real-time, the radio signals Craft recorded were digitized and stored to disk providing the flexibility to apply digital transformations to the data and to create visualizations that were not previously possible.<\/div>\n
To visually analyze the underlying structure of the pulsar\u2019s radio signal, Craft segmented the continuous radio signal into ~120 ms temporal windows centered at each pulse and plotted each segment as black lines in a vertical stack, bottom to top, at a fixed vertical interval. The proximity of the curves caused the lines from different segments to overlap making it difficult to distinguish between each segment of data, so Craft wrote a program to fill the area under each curve. This visualization is known today as a ridgeline plot<\/span> or a joyplot<\/span> (hmmm, I wonder why). Craft also considered plotting the filled curves in 3D by orienting each curve upward which, he noted, was aesthetically pleasing but unsuitable for visual analysis. Craft didn\u2019t find a pattern to the varying waveforms but published his findings, along with his ridgeline plots, in his PhD thesis (Craft Jr, 1970<\/span><\/a>).<\/div>\n
\"\"<\/div>\n
A photo of Craft's original ridgeline plot on pg. 215 of this thesis.<\/div>\n
I've created an animation that illustrates what makes a pulsar signal 'pulse', depicting the star's electromagnetic beacon sweeping across a receiver. The data used to produce the ridge lines are simulated with random variation that mimics the characteristics of real pulsar radio signals. The source of this variation, potentially interstellar plasma or solar wind, remains a topic of debate.<\/div>\n
\"pulsarDemo.gif\"<\/div>\n
Animation of a pulsar star's electromagnetic signal.<\/div>\n

A scintillating visualization gone viral<\/h3>\n
Four months after Craft submitted his thesis, his ridgeline plot of PSR B1919+21 was published on a full page in Scientific American (1971<\/span><\/a>). It appeared again in 1974 in the book Graphis Diagrams: The Graphic Visualization of Abstract Data <\/span>with white lines against a black background and again in 1977 in the Cambridge Encyclopedia of Astronomy<\/span> in its original form, with black lines against a white background.<\/div>\n
A copy of the Cambridge Encyclopedia of Astronomy was at a cafe at the Manchester Central library where Joy Division\u2019s guitarist Bernard Sumner happened to be taking a work break. Sumner found the article and immediately felt a connection with the stacked wavy lines in Craft's ridgeline plot. He sent the image to Peter Saville, the graphics artist for the band\u2019s record label, who imprinted the lines in white against a black album cover with no other graphics or text.<\/div>\n
Nearly immediately after the release of Unknown Pleasures <\/span>in 1979 the image acquired a cult following and continues to make its way through graphic designer and data visualization circles. It has appeared on t-shirts, knitted sweaters, leather jackets, other album art, Disney apparel, and tattoos. Versions of Craft\u2019s ridgeline plot have even appeared in MathWorks\u2019 Mini Hack competition<\/span><\/a> and in the MATLAB Central File Exchange<\/span><\/a>!<\/div>\n

Creating ridgeline plots in MATLAB<\/h2>\n

Acquire the data<\/h3>\n
I couldn't track down Harold Craft, Jr.'s original PSR B1919+21 data. However, creative coder Michael Zoellner<\/a> extracted the data from an svg image of the ridgeline plot. The data file, pulsar.csv<\/span>, is available in a number of places (Mike Bostock's blog<\/a>, Veli's blog<\/a>, borgar's GitHub<\/a>). Since the data were extracted from an image without a y-axis, it is an approximation of the original data, and the scale is arbitrary.<\/div>\n
\n
\n
datasource = 'https:\/\/github.com\/MATLAB-Graphics-and-App-Building\/matlab-gaab-blog-2024\/raw\/3eb648f40f1ba8e5517138f34d23567ab3af6d29\/RidgelinePlotsJoyDivision\/pulsar.csv'<\/span>;<\/div>\n<\/div>\n
\n
pulsardata = readmatrix(datasource).';<\/div>\n<\/div>\n<\/div>\n
pulsar.csv contains an 80x300 matrix of values from 80 pulses with 300 samples each. I prefer working with data that are organized such that each column is a variable and each row is an observation or sample from that variable. I transpose the data to fit this description so that pulsardata<\/span> has 80 columns, one for each pulse, and 300 rows, one for each sample. Column n<\/span> is data from the nth<\/sup> curve from the top of Craft's image.<\/div>\n
\n
\n
[nSamples,nPulses] = size(pulsardata)<\/div>\n
\n
\n
\n
nSamples = <\/span> 300<\/div>\n<\/div>\n<\/div>\n
\n
\n
nPulses = <\/span> 80<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n

2D Ridgeline plot (aka Joyplot)<\/h3>\n
We'll start by recreating Craft's original 2D ridgeline plot. The 80 lines need to be vertically stacked at a fixed interval by adding vertical offsets to each pulse. I selected an interval that approximates the space between lines in Craft's original image.<\/div>\n
\n
\n
interval = 8;<\/div>\n<\/div>\n
\n
vertOffsets = (nPulses-1)*interval : -interval : 0;<\/div>\n<\/div>\n
\n
ydata = pulsardata + vertOffsets;<\/div>\n<\/div>\n<\/div>\n
Create x coordinates for the 300 samples with a range that reflects the scale of the pulsar data. I chose to center the x values at x=0.<\/div>\n
\n
\n
xdata = linspace(-220,220,nSamples);<\/div>\n<\/div>\n<\/div>\n
Ridgeline without fill. <\/span>Let's take a look at Craft's first version before he decided to fill the ridge lines (figure below, left).<\/div>\n
\n
\n
figure(Color='w'<\/span>)<\/div>\n<\/div>\n
\n
tiledlayout(1,2,TileSpacing='Tight'<\/span>,Padding='tight'<\/span>)<\/div>\n<\/div>\n
\n
nexttile<\/div>\n<\/div>\n
\n
plot(xdata,ydata,'k-'<\/span>);<\/div>\n<\/div>\n
\n
axis equal tight off<\/span><\/div>\n<\/div>\n
\n
title('Ridgeline without fill'<\/span>)<\/div>\n<\/div>\n<\/div>\n
Ridgeline with fill. <\/span>Now we add the fill. It may seem as easy as plotting each pulse as a filled region using polyshape<\/span><\/a> or patch<\/span><\/a> but in both cases, the region would be closed so each pulse would have a straight horizontal baseline connecting the two endpoints. We don't want that. Instead, I'll fill the curves using a white edgeless patch<\/span> and will plot black lines on top of the otherwise invisible patches. We also have to be careful about the order in which the lines are plotted. We'll plot them from top to bottom to get the right overlap (figure below, right).<\/div>\n
\n
\n
nexttile()<\/div>\n<\/div>\n
\n
hold on<\/span><\/div>\n<\/div>\n
\n
for <\/span>i = 1:nPulses<\/div>\n<\/div>\n
\n
\u00a0\u00a0\u00a0\u00a0patch(xdata, ydata(:,i),'w'<\/span>,EdgeColor='none'<\/span>)<\/div>\n<\/div>\n
\n
\u00a0\u00a0\u00a0\u00a0plot(xdata,ydata(:,i),'k-'<\/span>)<\/div>\n<\/div>\n
\n
end<\/span><\/div>\n<\/div>\n
\n
axis equal tight off<\/span><\/div>\n<\/div>\n
\n
title('Ridgeline with fill'<\/span>)<\/div>\n<\/div>\n
\n
\n
<\/div>\n<\/div>\n<\/div>\n<\/div>\n
Invert colors<\/span>. <\/span>For the final step to recreate the Joy Division album cover, we'll invert the colors by setting the figure and patch colors to black and the line color to white, and increase the line width.<\/div>\n
\n
\n
figure(Color='k'<\/span>)<\/div>\n<\/div>\n
\n
hold on<\/span><\/div>\n<\/div>\n
\n
for <\/span>i = 1:nPulses<\/div>\n<\/div>\n
\n
\u00a0\u00a0\u00a0\u00a0patch(xdata, ydata(:,i),'k'<\/span>,EdgeColor='none'<\/span>)<\/div>\n<\/div>\n
\n
\u00a0\u00a0\u00a0\u00a0plot(xdata,ydata(:,i),'w-'<\/span>,'LineWidth'<\/span>,1)<\/div>\n<\/div>\n
\n
end<\/span><\/div>\n<\/div>\n
\n
axis equal tight off<\/span><\/div>\n<\/div>\n
\n
\n
<\/div>\n<\/div>\n<\/div>\n<\/div>\n

3D ridgeline plots<\/h3>\n
Recall that Craft considered displaying the pulses in 3D rather than overlapping 2D lines. Here are two ways to recreate that idea.<\/div>\n

3D waterfall plot<\/h4>\n
A waterfall<\/span><\/a> plot adds a third dimension to the ridgeline plot. Instead of overlapping filled curves like a flat collage of paper cutouts, each curve is oriented upward in the z direction.<\/div>\n
\n
\n
figure(Color='k'<\/span>)<\/div>\n<\/div>\n
\n
axes(Units='normalized'<\/span>,Position=[0 0 1 1])<\/div>\n<\/div>\n
\n
h = waterfall(xdata,vertOffsets,pulsardata');<\/div>\n<\/div>\n
\n
h.EdgeColor = 'w'<\/span>;<\/div>\n<\/div>\n
\n
h.FaceColor = 'k'<\/span>;<\/div>\n<\/div>\n
\n
axis equal tight off<\/span><\/div>\n<\/div>\n
\n
\n
<\/div>\n<\/div>\n<\/div>\n<\/div>\n
Note that each vertical slice created by waterfall<\/span> is a closed polygon. You could hide the vertical and horizontal edge lines by setting axis limits that clip those edges.<\/div>\n
\n
xlim(xlim()*.99)<\/div>\n
minZ = min(pulsardata,[],'all'<\/span>);<\/div>\n
zlim([minZ*.99, inf])<\/div>\n<\/div>\n

3D line plot<\/h4>\n
Instead of using waterfall<\/span>, 3D lines could be plotted using plot3<\/span><\/a> and filled using patch<\/span>, adhering to the same principles employed in the filled ridgeline plot.<\/div>\n
\n
\n
figure(Color='k'<\/span>)<\/div>\n<\/div>\n
\n
axes(Units='normalized'<\/span>,Position=[0 0 1 1])<\/div>\n<\/div>\n
\n
hold on<\/span><\/div>\n<\/div>\n
\n
for <\/span>i = 1:nPulses<\/div>\n<\/div>\n
\n
\u00a0\u00a0\u00a0\u00a0yvec = vertOffsets(i) .* ones(nSamples,1);<\/div>\n<\/div>\n
\n
\u00a0\u00a0\u00a0\u00a0patch(xdata, yvec, pulsardata(:,i),'k'<\/span>,EdgeColor='none'<\/span>)<\/div>\n<\/div>\n
\n
\u00a0\u00a0\u00a0\u00a0plot3(xdata,yvec,pulsardata(:,i),'w-'<\/span>)<\/div>\n<\/div>\n
\n
end<\/span><\/div>\n<\/div>\n
\n
axis equal tight off<\/span><\/div>\n<\/div>\n
\n
view(3)<\/div>\n<\/div>\n
\n
\n
<\/div>\n<\/div>\n<\/div>\n<\/div>\n
Here's another version of this plot I developed for the MathWorks office in Cambridge, UK, just 6.5 miles (~10.5 km) from the Mullard Radio Astronomy Observatory where Jocelyn Bell Burnell discovered PSR B1919+21! For this piece, I smoothed the data, increased the amplitudes, and added perspective projection.<\/div>\n
\"\"<\/div>\n
A wall at the MathWorks office in Cambridge, UK featuring a 3D ridgeline plot of data from PSR B1919+21<\/div>\n

Polar plot<\/h3>\n
There are many other ways these data could be visually inspected and analyzed. Let's bring this full circle by wrapping each line to polar coordinates using polarplot<\/span><\/a>. I've plotted the pulse waves with and without radial offsets. Amusingly, the first image resembles a vinyl record!<\/div>\n
\n
\n
theta = linspace(-pi,pi,nSamples);<\/div>\n<\/div>\n
\n
<\/div>\n<\/div>\n
\n
f = figure(Color='k'<\/span>);<\/div>\n<\/div>\n
\n
f.Position(3) = 800;<\/div>\n<\/div>\n
\n
tiledlayout(1,2,TileSpacing='None'<\/span>,Padding='tight'<\/span>)<\/div>\n<\/div>\n
\n
nexttile()<\/div>\n<\/div>\n
\n
polarplot(theta, ydata, '-w'<\/span>);<\/div>\n<\/div>\n
\n
set(gca,'ThetaZeroLocation'<\/span>,'top'<\/span>,'ThetaDir'<\/span>,'clockwise'<\/span>);<\/div>\n<\/div>\n
\n
axis off<\/span><\/div>\n<\/div>\n
\n
rlim([-10 650])<\/div>\n<\/div>\n
\n
title('With radius offsets'<\/span>,Color='w'<\/span>)<\/div>\n<\/div>\n
\n
<\/div>\n<\/div>\n
\n
nexttile()<\/div>\n<\/div>\n
\n
polarplot(theta, pulsardata, '-w'<\/span>,Clipping='off'<\/span>);<\/div>\n<\/div>\n
\n
set(gca,'ThetaZeroLocation'<\/span>,'top'<\/span>,'ThetaDir'<\/span>,'Clockwise'<\/span>);<\/div>\n<\/div>\n
\n
axis off<\/span><\/div>\n<\/div>\n
\n
rlim([-70,50])<\/div>\n<\/div>\n
\n
title('Without radius offsets'<\/span>,Color='w'<\/span>)<\/div>\n<\/div>\n
\n
\n
<\/div>\n<\/div>\n<\/div>\n<\/div>\n
To see the polar axes,<\/div>\n
\n
pax = gca();<\/div>\n
axis(pax,'on'<\/span>)<\/div>\n
pax.Color = 'k'<\/span>;<\/div>\n
pax.ThetaAxis.Color = 'w'<\/span>;<\/div>\n
pax.RAxis.Color = 'w'<\/span>;<\/div>\n<\/div>\n

Next steps<\/h2>\n
We've reviewed a variety of methods to visualize cyclical data, from ridgeline plots to waterfall plots, 3D line plots, and even polar plots. I invite readers to unleash your creativity by producing unique visualizations using these data or these techniques. I'd love to see what you produce.<\/div>\n
What would the album cover look like if the producers had MATLAB back in 1979?<\/div>\n
What signals have you received from Little Green Men?<\/div>\n

 <\/p>\n<\/div>\n