watergis / mapbox-gl-export Goto Github PK

Describe the bug
This tool allows you to export a map as an SVG, but it doesn't create a vector file. Instead, it just embeds an <image> element with base64 encoded raster data.

To Reproduce
Steps to reproduce the behavior:

1. Go to the demo site.
2. Click on the Print button.
3. Export a map as an SVG.
4. Open the exported SVG with a text editor.

Expected behavior
I would have expected the SVG to be a vector graphic. The exported SVG is basically useless if it's just a raster image wrapped with an SVG tag.

Screenshots

Describe the bug
Unable to generate a PDF just get a spinning wheel

To Reproduce
Click print icon with A3 Portrait PDF 96 DPI,

Expected behavior
A PDF is generated.

Screenshots

Desktop (please complete the following information):

• OS: Windows
• Browser: Chrome
• Version: 103

Additional context
We are generating many layers behind the scenes using various plugins and some generated layers ourselves.
Is this something we need to fix or something the plugin can handle?

Error text:

mapbox-gl.js:31 Error: layers[140].type: expected one of [fill, line, symbol, circle, heatmap, fill-extrusion, raster, hillshade, background], "sky" found
    at Object.Bn [as emitValidationErrors] (mapbox-gl.js:31:133534)
    at Ue (mapbox-gl.js:35:112388)
    at i._load (mapbox-gl.js:35:114931)
    at mapbox-gl.js:35:114750
    at timer (zone.js:2405:1)
    at _ZoneDelegate.invokeTask (zone.js:406:1)
    at Object.onInvokeTask (core.mjs:25595:1)
    at _ZoneDelegate.invokeTask (zone.js:405:1)
    at Zone.runTask (zone.js:178:1)
    at invokeTask (zone.js:487:1)```

It's a shame to have to choose a format when exporting
I don't know if is possible.

Thanks a lot,
Edmond Sarran

Hello! I don't want to print through the control component. I want to define the button myself. Can I click to trigger this function

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

The error I am getting when generating the export is An API access token is required to use Mapbox GL. See https://www.mapbox.com/api-documentation/#access-tokens-and-token-scopes, however I have specified the token in my Angular .ts file . Rest of the controls are working fine, only this export control is giving me error.

• add i18n feature from maplibre-gl-export (see watergis/maplibre-gl-export#5)

I am trying to use this to screenshot the map with a GeoJSON feature Layer that has different colors, and the layer is saved as part of the screenshot, but not the colors. Thank you.

I am using mapbox gl js in mapping application it uses vector tiles with custom autheication.
https://stackoverflow.com/questions/40940860/how-to-specify-authorization-header-for-a-source-in-mapbox-gl-js

Kindly provide ability to pass the pass the transformRequest callback function just like accesstoken param.

Thanks

I was using react-map-gl which is a suite of React components for Mapbox GL JS-compatible libraries. I wanted to implement the exact same functionality as this library but the problem is that the markers in my map are not printed . I tried to use Mapbox GL JS and also added a sample marker just to see if the marker is printed but to no avail .

  useEffect(() => {
    mapRef.current = mapRef.current.getMap().addControl(
      new MapboxExportControl({
        PageSize: Size.A3,
        PageOrientation: PageOrientation.Portrait,
        Format: Format.PNG,
        DPI: DPI[96],
        Crosshair: true,
        PrintableArea: true,
        accessToken: process.env.REACT_APP_MAPBOX_TOKEN,
      }),
      "top-right"
    );

    const marker = new mapboxgl.Marker()
      .setLngLat([8.5, 50])
      .addTo(mapRef.current);

    return () => (mapRef.current = null);
  }, []);

  return (
    <div className={styles.Container}>
      <ReactMapGL
        {...viewport}
        ref={mapRef}
        width="100%"
        height="100%"
        onViewportChange={setViewport}
        mapboxApiAccessToken={process.env.REACT_APP_MAPBOX_TOKEN}
        dragRotate={false}
        mapStyle="mapbox://styles/mapbox/streets-v10"
        preserveDrawingBuffer={true}
      >
        <Pins data={Places} onClick={onSelectPlace} />
        <ScaleControl style={scaleControlStyle} />
        <NavigationControl style={navStyle} />
      </ReactMapGL>
    </div>
  );

The getMap() exposes the Mapbox API here as stated in the documentation of react map gl.

I also printed the map object (mapRef.current) and as we can see the map does contain the marker in it but is not printed.

As far as i see the library only prints the lower layer of map but i also want to print the Pins(Markers) which get populated when the api is called. Can you please help ?

Hello. Please tell me how to connect the plugin to the site where mapbox gl is used. Nothing works through npm.

I use react to implement web map page to display mapbox map with export control:

`const map = new mapboxgl.Map({

  container: "map", // container ID

  style: "mapbox://styles/mapbox/streets-v11", // style URL

  center: [-74.5, 40], // starting position [lng, lat]

  zoom: 9, // starting zoom

  accessToken:"my token"});`
//export control
`map.addControl(new MapboxExportControl(), "top-right");`

when I clicked to export this error occurs to me:

Note: I initialize mapbox token at the beginning :
mapboxgl.accessToken =
"my token";

I added raster-dem source into UNVT style of WASAC, Rwanda. Then I found this plugin is not working if raster-dem is included in style.json.

https://rural.water-gis.com/#13.3/-1.95511/29.90892

change style to UN Vector.

Describe the bug
Install not adding *.js files to node_modules folder

To Reproduce

1. Run npm i @watergis/mapbox-gl-export --save or npm i git+https://github.com/watergis/mapbox-gl-export.git#mbgljs-v2 --save
2. Run ls node_modules\@watergis\mapbox-gl-export

Expected behavior
Package installed with all contents

Desktop (please complete the following information):

• windows 10
• chrome

Additional context
Both packages install without any js files but show as complete

I think the same issue of watergis/maplibre-gl-export#7 which was raised by @ttolvanen also need to be fixed in Mapbox-gl-export too.

Please publish compiled dist files for using them as script tag in HTML.