它不会使用Html2Canvas在Google地图中显示标记-VUE

时间:2019-01-28 11:43:01

标签: javascript vue.js vuex html2canvas

我已经使用Google地图中的Html2Canvas库进行了屏幕截图,但是与Google使用的css3转换存在兼容性问题。该地图确实显示了我,但是侧面有一个空格,标记也没有向我显示。

这是捕获内容的显示方式:

enter image description here

这在您进行捕获时显示:

enter image description here

我已经看到一种可能的解决方案是在代码中添加以下行:

left:0,
top:0,
transform: "none"

但是这对我不起作用,因为我通过从浏览器将它们放到网上进行了尝试。我附上了代码

Component.Vue

async print() {
      const el = this.$refs.captureMap
      // add option type to get the image version
      // if not provided the promise will return
      // the canvas.
      const options = {
        type: 'dataURL',
        useCORS: true
      }
      this.output = await this.$html2canvas(el, options).then(function(canvas){
        console.log(document.getElementsByClassName('gm-style'))
        $(".gm-style>div:first>div").css({
          left:0,
          top:0,
          transform: "none"
        });
        console.log(canvas)
        // document.getElementsByClassName('gm-style').style.left="0px"
        // document.getElementsByClassName('gm-style').style.top="0px"
        // document.getElementsByClassName('gm-style').style.transform="none"
      })
    }

感谢朋友

0 个答案:

没有答案