{"id":13597882,"url":"https://github.com/watergis/mapbox-gl-export","last_synced_at":"2025-04-10T05:33:43.986Z","repository":{"id":40313893,"uuid":"286165880","full_name":"watergis/mapbox-gl-export","owner":"watergis","description":"This module adds print control to mapbox-gl.","archived":true,"fork":false,"pushed_at":"2024-03-09T22:13:56.000Z","size":28942,"stargazers_count":143,"open_issues_count":6,"forks_count":37,"subscribers_count":3,"default_branch":"master","last_synced_at":"2024-10-30T05:43:06.311Z","etag":null,"topics":["demo","export","mapbox-gl-js","pdf","plugin","png"],"latest_commit_sha":null,"homepage":"https://watergis.github.io/mapbox-gl-export/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/watergis.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":".github/CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null},"funding":{"github":["JinIgarashi"],"custom":["https://www.paypal.me/jinigarashi"]}},"created_at":"2020-08-09T04:24:13.000Z","updated_at":"2024-10-24T21:02:27.000Z","dependencies_parsed_at":"2024-04-15T08:16:43.389Z","dependency_job_id":null,"html_url":"https://github.com/watergis/mapbox-gl-export","commit_stats":{"total_commits":96,"total_committers":16,"mean_commits":6.0,"dds":0.6041666666666667,"last_synced_commit":"6290da97d625e0f77a7ed936eca9c248bcca2066"},"previous_names":["watergis/mapbox-gl-print"],"tags_count":30,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/watergis%2Fmapbox-gl-export","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/watergis%2Fmapbox-gl-export/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/watergis%2Fmapbox-gl-export/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/watergis%2Fmapbox-gl-export/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/watergis","download_url":"https://codeload.github.com/watergis/mapbox-gl-export/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247935735,"owners_count":21020881,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["demo","export","mapbox-gl-js","pdf","plugin","png"],"created_at":"2024-08-01T17:00:42.774Z","updated_at":"2025-04-10T05:33:43.869Z","avatar_url":"https://github.com/watergis.png","language":"TypeScript","readme":"# This repository was merged into [maplibre-gl-export](https://github.com/watergis/maplibre-gl-export/tree/main/packages/mapbox-gl-export)\n\n# mapbox-gl-export\n\n![badge](https://github.com/watergis/mapbox-gl-export/workflows/build/badge.svg)\n![badge](https://github.com/watergis/mapbox-gl-export/workflows/deploy%20gh-pages/badge.svg)\n![badge](https://github.com/watergis/mapbox-gl-export/workflows/Release%20Draft/badge.svg)\n![badge](https://github.com/watergis/mapbox-gl-export/workflows/Node.js%20Package/badge.svg)\n![GitHub](https://img.shields.io/github/license/watergis/mapbox-gl-export)\n\nThis module adds control which can export PDF and images.\n\nThis module is using source code of [mpetroff/print-maps](https://github.com/mpetroff/print-maps). I just adopted this library to normal Mapbox GL Plugin. Thanks so much to develop this library!\n\nThis plugin was merged into [maplibre-gl-export](https://github.com/watergis/maplibre-gl-export) repository as a monorepo package. Don't worry, it still supports Mapbox GL JS with the same package name of `@watergis/mapbox-gl-export`!\n\n## for Maplibre GL users\n\nPlease consider to use [maplibre-gl-export](https://github.com/watergis/maplibre-gl-export) plugin for Maplibre GL.\n\n## Installation\n\n```bash\nnpm i @watergis/mapbox-gl-export --save\n```\n\n## Use CDN\n\n```html\n\u003clink href='https://watergis.github.io/mapbox-gl-export/mapbox-gl-export.css' rel='stylesheet' /\u003e\n\u003cscript src='https://api.mapbox.com/mapbox-gl-js/v1.13.1/mapbox-gl.js'\u003e\u003c/script\u003e\n\u003cscript src=\"https://watergis.github.io/mapbox-gl-export/mapbox-gl-export.js\"\u003e\u003c/script\u003e\n\u003cscript\u003e\n  map.addControl(new MapboxExportControl({\n      PageSize: Size.A3,\n      PageOrientation: PageOrientation.Portrait,\n      Format: Format.PNG,\n      DPI: DPI[96],\n      Crosshair: true,\n      PrintableArea: true,\n  }), 'top-right');\n\u003c/script\u003e\n```\n\nFurthermore, you may download specific version's scripts and css locally from [release](https://github.com/watergis/mapbox-gl-export/releases) page.\n\n## Demo\n\nTry [codesandbox](https://codesandbox.io/s/mapbox-gl-export-8x4lw?file=/src/index.ts).\n\nSee [demo](https://watergis.github.io/mapbox-gl-export/#12/-1.08551/35.87063).\n\n![demo.gif](./demo.gif)\n\n## Usage\n\n```ts\nimport { MapboxExportControl, Size, PageOrientation, Format, DPI} from \"@watergis/mapbox-gl-export\";\nimport '@watergis/mapbox-gl-export/css/styles.css';\nimport mapboxgl from 'mapbox-gl';\n\nconst map = new mapboxgl.Map();\n// create control with default options\nmap.addControl(new MapboxExportControl(), 'top-right');\n// create control with specified options\nmap.addControl(new MapboxExportControl({\n    PageSize: Size.A3,\n    PageOrientation: PageOrientation.Portrait,\n    Format: Format.PNG,\n    DPI: DPI[96],\n    Crosshair: true,\n    PrintableArea: true\n}), 'top-right');\n```\n\n### if you want to use a basemap from Mapbox\n\n- for mapbox v1 user\n\n```ts\nmapboxgl.accessToken='your mapbox access token'\n```\n\n- for mapbox v2 user\nThere is an option of `accessToken` in `MapboxExportControl`. Please put your accessToken when you create a instance of plugin.\n\n```ts\nmapboxgl.accessToken='your mapbox access token'\nconst map = new mapboxgl.Map({\n    container: 'map',\n    style: 'mapbox://styles/mapbox/streets-v11',\n});\nmap.addControl(new MapboxExportControl({\n    accessToken: 'your mapbox access token'\n}), 'top-right');\n```\n\n### Options\n\nYou can specify default option as follows.\n\n- PageSize\n  - You can select from `A2` to `A6` or `B2` to `B6`\n  - default page size is `A4`\n- PageOrientation\n  - You can select `landscape` or `portrait`\n  - default is `landscape`\n- Format\n  - You can select it from `jpg`, `png`, `svg` and `pdf`\n  - default is `PDF`\n- DPI\n  - You can select it from `72`, `96`, `200`, `300` and `400`.\n  - default is `300`\n- Crosshair\n  - Display crosshair on the map. it helps to adjust the map center before printing.\n  - accepts `true` and `false` value\n  - default is `false`\n- PritableArea\n  - Display printable area on the map it helps to adjust pritable area before printing.\n  - accepts `true` and `false` value\n  - default is `false`\n- Local\n  - default `en` for english\n  - `de` german\n  - `fr` french\n  - `fi` finnish\n  - `sv` swedish\n  - `zhHans` Chinese Simplified\n  - `zhHant` Chinese Traditional\n## Attribution\n\nWhen you use exported map, please includes attribution as follows.\n\nIf you can include HTML, use this code snippet that includes links to Mapbox \u0026 OpenStreetMap:\n\n```html\n© NARWASSCO, Ltd. © \u003ca href='https://www.mapbox.com/about/maps/'\u003eMapbox\u003c/a\u003e © \u003ca href='https://www.openstreetmap.org/copyright'\u003eOpenStreetMap\u003c/a\u003e \u003cstrong\u003e\u003ca href='https://www.mapbox.com/map-feedback/' target='_blank'\u003eImprove this map\u003c/a\u003e\u003c/strong\u003ePowered by the United Nations Vector Tile Toolkit\n```\n\nFor print output or if you can’t include links, use this text-only attribution:\n\n```\n© NARWASSCO, Ltd. ©Mapbox ©OpenStreetMap contributors, Powered by the United Nations Vector Tile Toolkit\n```\n\n`© NARWASSCO, Ltd.` is default example of map data by `Narok Water and Sewerage Services Co., Ltd.`, Kenya. If you don't use current map, you don't need to use this attribution.\n\nAlso, default example is using base map by United Nation Vector Tile Toolkit. That is why `Powered by the United Nations Vector Tile Toolkit` is included in above.\n\n## Development\n\n```bash\nnpm run lint # check styling of source code\nnpm run lint:fix # fix styling by eslint\nnpm run dev\n```\n\nopen [http://localhost:8080](http://localhost:8080).\n\nIf there are any changes on source code, it will be reflected automatically.\n\n## Build package\n\n```bash\nnpm run build\n```\n\nThe modules will be generated under `dist` folder.\n\n## Deploy to Github pages\n\n```bash\nnpm run deploy\n```\n\nIt will deploy files under `example` folder to gh-pages.\n\n## How to release\n\n```zsh\nnpm version patch # it increase patch version 0.0.X\nnpm version minor # it increase minor version 0.x.0\nnpm version major # it increase major version x.0.0\ngit push origin master --tag\n# release CI will create draft release in Github pages, then publish it if it is ready.\n# publish CI will deploy npmjs and Github Packages.\n```\n\n## Contribution\n\nThis Mapbox GL Export Control is still under development. so most welcome any feedbacks and pull request to this repository.\n","funding_links":["https://github.com/sponsors/JinIgarashi","https://www.paypal.me/jinigarashi"],"categories":["Lincense"],"sub_categories":["1. Source Code"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwatergis%2Fmapbox-gl-export","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwatergis%2Fmapbox-gl-export","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwatergis%2Fmapbox-gl-export/lists"}