I’m working on a notebook that is plotting storm tracks. I want to have the width of the tracks increase with measure of storm intensity.
Per the documentation, this has the effect of that the “line will be broken into contiguous overlapping segments.”
Unfortunately, because i also want to have some opacity of the storm tracks, this creates artifacts where the segments overlap. Is there any way to avoid this.
Observable link:
It’s tricky but possible:
d3.groups(grouped_tracks, (d) => `${d.WSR_ID}:${d.CELL_ID}:${d.run_id}`)
.map(([z, track]) =>
Plot.line(track, {
x: "LON",
y: "LAT",
stroke: "blue",
strokeWidth: (d) => d.MAX_REFLECT - 45,
render: function (index, scales, values, dimensions, context, next) {
const g = next(index, scales, values, dimensions, context);
g.style.opacity = 0.1;
return g;
}
})
),
this however won’t work well with the automatic tip mark (tip: true), so you’ll need to create a second mark just for the tip.
Note that there is a similar issue with the line mark’s “halo” proposal (line halo by Fil · Pull Request #870 · observablehq/plot · GitHub), where we want some properties to be applied on a group of line segments. I hope we can make this easier in the future.
this is beautiful, @Fil.
it looks like the opacity is set uniformly for the layer. when two different storm tracks overlap, i’d like that overlap to be more opaque.
is that possible?
I think my code created opacity at the storm track level? I can’t test because the dataset is failing just now (error 500).
