Web地图导图总结

文章版权由做者李晓晖和博客园共有，若转载请于明显处标明出处：http://www.cnblogs.com/naaoveGIS/

1. 背景

         地图端展现了各种制图效果，用户但愿能够一键生成报表，其中核心即前端地图制图界面能够自动截图填入报表中。因为此项目版本有些陈旧，暂时没法升级，PC端地图并非采用的Canvas绘制（即便导图有跨域，也能够经过服务端代理来解决），而是依然基于div的方式拼接而成，致使其自动导图难度大大提升。

       经过与用户的初步交流，让其改为了截图方案。可是截图方案依然须要安装插件（采用的UdCapture），通配IE和Chrome，可是截图分辨率上差强人意。最近浏览博客时发现博友“遥想公瑾当年”推荐的一个插件puppeteer能够解决这个问题，因而研究测试了一下，可行，如下为总结。

2. 思路

           Puppeteer能够理解成利用chrome的核心模块（无UI）进行API调用，具体如何安装，博客挺多，不累述。

        本文对指定模块功能的截图思路为：

        a.编写一个专门用给截图的html页面，该页面中对所需截图内容进行展现。

 

       b.Puppeteer利用对页面console输出的监听，当监听到初始化完成时，触发截图。

 

        测试结果以下：

 

3. 通用功能化的几点思考

           目前该功能为定制功能，要作到通用接口化，及经过接口便可指定对哪些内容截图还需几点改造：

           a.截图静态页面能够传入待截图功能函数名、参数等，正常触发。

           b.nodejs环境须要装入GIS服务器docker中。

 

　                                                                  -----欢迎转载，但保留版权，请于明显处标明出处：http://www.cnblogs.com/naaoveGIS/

                                                                           若是您以为本文确实帮助了您，能够微信扫一扫，进行小额的打赏和鼓励，谢谢 ^_^