Как экспортировать карту mapBoxGL?

Question

Я использую mapboxGL для отображения карт на веб-странице, я хотел бы экспортировать карту в качестве изображения, включая данные GeoJSON, которые были нанесены на карту. Я пробовал использовать плакат листка, но он не отображает кластеры и другие пользовательские html, которые отображаются на карте как всплывающие окна или аннотации.

Даже если я попытаюсь сделать это на сервере, например, используя phantomjs, то он (phantomjs) не поддерживает webgl. Я застрял и не знаю, как это сделать, любые предложения?

Answer 1

MpboxGL может экспортировать очень хорошо и легко! Все, что вы добавляете на карту, можно экспортировать, что действительно потрясающе.

в декларации карты, убедитесь, что вы установили preserveDrawingBuffer к истинным

var map = new mapboxgl.Map({ 
    container: 'map', 
    style: myawesomestyle, 
    zoom: 8, 
    bearing: 0, 
    pitch: 0, 
    center: [13, 52.35], 
    preserveDrawingBuffer: true 
}); 

Мне нравится использовать CanvasToBlob и FileSaver сделать внутренние действия, поэтому в голову дока включает два LIBS:

<script type="text/javascript" src="//cdn.jsdelivr.net/canvas-toblob/0.1/canvas-toBlob.min.js"></script> 
<script type="text/javascript" src="//cdn.rawgit.com/eligrey/FileSaver.js/1.3.3/FileSaver.min.js"></script> 

и связать его вместе с маленькой функцией печати

function printMap() { 
    map.getCanvas().toBlob(function (blob) { 
    saveAs(blob, 'map.png'); 
    }) 
}