No icons except circle render in a scattermapbox

[YellowDog3629]

No icons will render on the map for scattermapbox type except for "circle".

Here is a minimal set of code to reproduce. This code is from the Script section of the grafana panel. If you change the symbol value to other maki icon names, they do not appear on the map.

EDIT: originally posted in Grafana community board and advised that this is a plugin issue and to post here

console.log(data)

// Loop over all the entries in query which is node positions.
var nodeArray = [];
if (0 in data.series) 
{
  let nodeCount = data.series[0].length;
  for (let i = 0; i < nodeCount; i++)
  {
    var newNode = {
      "mode": "markers",
      "showlegend": false,
      "type": "scattermapbox",
      "lat":[data.series[0].fields[1].values.get(i)],
      "lon":[data.series[0].fields[2].values.get(i)],
      "marker": {
          "symbol": "circle",
          "size": 24
      }
    }

    nodeArray.push(newNode);
  }
}

customLayout = {
  "dragmode": "zoom",
  "mapbox": {
    "bearing": 0,
    "center": {
      "lat": 42.459332,
      "lon": -97.266983
    },
    "layers": [
      {
        "below": "traces",
        "source": [
          "http://localhost:8000/{z}/{x}/{y}.png"
        ],
        "sourcetype": "raster"
      }
    ],
    "pitch": 0,
    "style": "white-bg",
    "zoom": 8
  },
  "margin": {
    "b": 0,
    "l": 0,
    "r": 0,
    "t": 0
  }
}

return {
	data: nodeArray,
	config: {
		displayModeBar: true,
	},
	layout: customLayout
};

[jacksongoode]

This would be hard to reproduce with your example as there are references to localhost? Are you trying to load external images into the layer?

[YellowDog3629]

The localhost:8000 is a local tile server for osm map tiles. The example works without the tile server actually running but the map is simply white without the actual map tile displayed. EDIT: just double checked. I ran the example in my environment but set the tile server url to localhost:9000. Panel works -- it has a white background and shows circle icons but no other icons

[YellowDog3629]

Has anyone been able to reproduce this issue or have a workaround?
I'd like to be able to display an icon besides a circle and also use the "angle" property of the marker.

[jacksongoode]

I think the issues you might be having are a result of Grafana not allow external resources to be loaded in the Grafana dashboard. If you're able to reproduce it with a grafana.org cloud dashboard (you can make a free account and create a dashboard), I can further assist you.

[YellowDog3629]

Here's a public dashboard that shows the circle being rendered and the symbol "airport" NOT being rendered.

https://yellowdog3629.grafana.net/public-dashboards/377337337f4743db85a24fefe2bea7f6

Not quite sure how to provide access to edit it though.

[jacksongoode]

Yes, this is a CORS policy issue unfortunately and by default Grafana prevents you from loading resources outside of the immediate domain (wherever you've hosted Grafana). This isn't a plugin issue with the Plotly plugin.

https://grafana.com/docs/grafana/latest/setup-grafana/configure-grafana/#cookie_samesite

You can set the cookie_samesite Grafana config to disabled and I believe this will work.

[YellowDog3629]

Is this a CORS issue? I commented out the use of localhost as a tile server and set both panels to use circle and I see these errors:

If I change one of the circles back to "airport" , the same 14 third party cookie errors occur but there is a new error that the airport-15 image is missing: