Not export images icons on map

[mahmoudadel54]

I tried to print (export map as pdf) and my map has some images icons like this :

if you check this images, you will see a vector (polygon) feature + 2 image, one in SVG format and the other one in PNG format
when I printed it, it just shows the vector without the 2 images

Hope to get a solution for that

[JinIgarashi]

@mahmoudadel54 Did you add icons after loading style.json? This plugin will create an image style.json which you have loaded. So it will not be able to export other layers not from style.json such as FeatureState.

If possible, it might be better to provide us your source code. So we can know what is the reason.

[mahmoudadel54]

this is the piece of code that I added icons on it:

`// map loading
map.on("load", () => {
// Add a data source containing GeoJSON data.
map.addSource("maine", {
type: "geojson",
data: {
type: "Feature",
geometry: {
type: "Polygon",
// These coordinates outline Maine.
coordinates: [
[
[-67.13734, 45.13745],
[-66.96466, 44.8097],
[-68.03252, 44.3252],
[-69.06, 43.98],
[-70.11617, 43.68405],
[-70.64573, 43.09008],
[-70.75102, 43.08003],
[-70.79761, 43.21973],
[-70.98176, 43.36789],
[-70.94416, 43.46633],
[-71.08482, 45.30524],
[-70.66002, 45.46022],
[-70.30495, 45.91479],
[-70.00014, 46.69317],
[-69.23708, 47.44777],
[-68.90478, 47.18479],
[-68.2343, 47.35462],
[-67.79035, 47.06624],
[-67.79141, 45.70258],
[-67.13734, 45.13745],
],
],
},
},
});

  // Add a new layer to visualize the polygon.
  map.addLayer({
    id: "maine",
    type: "fill",
    source: "maine", // reference the data source
    layout: {},
    paint: {
      "fill-color": "#0080ff", // blue color fill
      "fill-opacity": 0.5,
    },
  });
  // Add a black outline around the polygon.
  map.addLayer({
    id: "outline",
    type: "line",
    source: "maine",
    layout: {},
    paint: {
      "line-color": "#000",
      "line-width": 3,
    },
  });

  //add image
  // Load an image from an external URL.
  map.loadImage(
    "https://docs.mapbox.com/mapbox-gl-js/assets/cat.png",
    (error, image) => {
      if (error) throw error;

      // Add the image to the map style.
      map.addImage("cat", image);

      // Add a data source containing one point feature.
      map.addSource("point", {
        type: "geojson",
        data: {
          type: "FeatureCollection",
          features: [
            {
              type: "Feature",
              geometry: {
                type: "Point",
                coordinates: [-77.4144, 25.0759],
              },
            },
          ],
        },
      });

      // Add a layer to use the image to represent the data.
      map.addLayer({
        id: "points",
        type: "symbol",
        source: "point", // reference the data source
        layout: {
          "icon-image": "cat", // reference the image
          "icon-size": 0.25,
        },
      });
    }
  );
  map.addImage("pulsing-dot", pulsingDot, { pixelRatio: 2 });

  map.addSource("dot-point", {
    type: "geojson",
    data: {
      type: "FeatureCollection",
      features: [
        {
          type: "Feature",
          geometry: {
            type: "Point",
            coordinates: [0, 0], // icon position [lng, lat]
          },
        },
      ],
    },
  });
  map.addLayer({
    id: "layer-with-pulsing-dot",
    type: "symbol",
    source: "dot-point",
    layout: {
      "icon-image": "pulsing-dot",
    },
  });
});

`

[JinIgarashi]

@mahmoudadel54 You are using additional GeoJSON source and icons apart from style.json. Currently, this plugin does not consider any layers and icons which are not defined in style.json. This issue is also related to #2 's feature state problem.
But welcome to pull request anytime to add this feature to this plugin.