plot icon indicating copy to clipboard operation
plot copied to clipboard

Uncaught TypeError when passing `null` to all mark titles

Open matthewCmatt opened this issue 1 year ago • 2 comments

Encountered through trying to make a Plot.geo choropleth that resembles the following:

Plot.plot({
  marks: [
    Plot.geo(countries, {
      title: (d) =>
        d.properties.user_data !=  0
          ? `Fun property: ${d.properties.user_data}`
          : null,
      tip: true
    })
  ]
})

The above snippet gives a title option that displays a geometry property when it is nonzero. Passing null to the title option works as expected, which was to not display the tooltip for that geo feature.

However, in the case that user_data is 0 for all features, Plot will throw the following error:

Uncaught TypeError: lines is null
    g tip.js:160
    each_default each.js:5
    g tip.js:146
    call_default call.js:4
    g tip.js:145
    call_default call.js:4
    render tip.js:136
    composeRender mark.js:147
    render2 pointer.js:108
    update pointer.js:99
    pointermove pointer.js:161

The plot still renders properly and no tooltips are rendered, as desired.

I believe this is because Plot does not expect there to be 0 tool tips generated from the geo title factory passed in.

Here's some more environment information:

  • Browser: Observed on both Firefox and Chromium
  • Using GeoJSON data (see countries above)

matthewCmatt avatar Jan 29 '25 21:01 matthewCmatt

I found a workaround for my usecase, which was to use a separate Mark for the tooltip. This prevents the error in the case that all features are filtered out:

const { x, y } = Plot.geoCentroid()
const pointer = Plot.pointer({ px: x, py: y, x, y })

const plot = Plot.plot({
  marks: [
    Plot.geo(countries),
    Plot.tip(countries.features, {
      ...pointer,
      title: (d) => `Fun property: ${d.properties.user_data}`,
      filter: (d) => d.properties.user_data != 0
    })
  ]
})

matthewCmatt avatar Jan 30 '25 15:01 matthewCmatt

I've discovered the original solution (providing a title of null) to a tooltip mark only works because of this error.

When the mark renders the title of null, this error causes that tooltip to error out (see Tip.render in tip.js), causing nothing to be rendered. 😬

Here's an MR to fix the error: https://github.com/observablehq/plot/pull/2275 For context, I used tipGeoNoProjection and tipGeoProjection to reproduce this issue in the dev environment.

Here's a feature request to allow the behavior I originally assumed Plot had: https://github.com/observablehq/plot/issues/2276

matthewCmatt avatar Jan 30 '25 16:01 matthewCmatt