Bubble map

[asmanp2012]

Hi.
I use this code to make a bubble map but the map is rendered but does not have any bubble how can I fix it?

Chart.register(...registerables);
Chart.register(ChoroplethController);
Chart.register(BubbleMapController);
Chart.register(GeoFeature);
Chart.register(ColorScale);
Chart.register(SizeScale);
Chart.register(ProjectionScale);
new Chart(ctx, {
      type: 'bubbleMap',
      data: {
        labels: topology.map((d) => d.properties.name),
        datasets: [
          {
            label: 'States',
            outline: topology,
            data: topology.map((d) => ({
              value: 10,
              feature: d
            })),
          },
        ],
      },
      options: {
        showOutline: true,
        showGraticule: false,
        plugins: {
          legend: {
            display: false,
          },
        },
        scales: {
          xy: {
            projection: 'equalEarth'
          },
        }
      },
    });

[sgratzl]

the bubble map requires additional/extra registers

• BubbleMapController
• SizeScale

[asmanp2012]

before registering , I have some errors like the below and the map was not rendered:

reactive-element.ts:1204 Uncaught (in promise) Error: "bubbleMap" is not a registered controller.
or
Uncaught Error: "size" is not a registered scale.

after the registering BubbleMapController and SizeScale the result is this:

in the same condition with choropleth the result is this:

[stockiNail]

@asmanp2012 maybe I am wrong but the bubbleMap needs a specific data structure, where longitude and latitude options must be set. topology.map can report the features but not the coordinates.

As you can see form sample https://github.com/sgratzl/chartjs-chart-geo/blob/main/samples/bubbleMap.html, the data (not created by the topology) are containing the coordinates and consumed fetching another files with all capitals and their position.