Download Google Map as an PNG Image with Webix 6.4.3

Google_Map_to_PNG.js

/* Function to download a Google Map as an image file using Webix 6.4.3
 * https://www.webix.com
 * Solving this issue: Maps were downloaded with ugly white backgrounds or borders
 * https://forum.webix.com/discussion/comment/25148#Comment_25148
 * @author: Tobias Klemmer
 * @date: 06.08.2019
 */

function Google_Map_to_PNG(viewId) {
    // https://www.webix.com
    // main logic partly from Webix UI v.6.4.3 webix.toPNG()
    const defer = webix.promise.defer();

    let view = $$(viewId);
    let options = {
        filename: viewId ? viewId.toString() + '.png' : "Data.png"
    };
    const filename = options.filename;

    if (view && view.$exportView) view = view.$exportView(options);
    if (!view) return defer.reject('no view provided');
    let node = view ? view.$view : webix.toNode(id);

    // Google Maps transformation logic comes from ...
    // https://stackoverflow.com/questions/24046778/html2canvas-does-not-work-with-google-maps-pan
    var transform = $(".gm-style>div:first>div:first>div:last>div").css("transform");
    var comp = transform.split(","); //split up the transform matrix
    var mapleft = parseFloat(comp[4]); //get left value
    var maptop = parseFloat(comp[5]);  //get top value
    $(".gm-style>div:first>div:first>div:last>div").css({
        //get the map container
        "transform": "none",
        "left": mapleft,
        "top": maptop,
    });

    // using html2canvas library directly
    // npm install --save html2canvas@1.0.0-alpha.12
    // included https://code.jquery.com/jquery-3.4.1.min.js
    // import html2canvas from 'html2canvas';
    html2canvas(node, {
        background: "#fff",
        windowWidth: node.scrollWidth,
        windowHeight: node.scrollHeight,
        logging: false,
        useCORS: true
    }).then(function (canvas) {
        // https://stackoverflow.com/questions/24046778/html2canvas-does-not-work-with-google-maps-pan
        $(".gm-style>div:first>div:first>div:last>div").css({
            left: 0,
            top: 0,
            "transform": transform
        });
        
        var callback = function (data) {
            if (options.download !== false) webix.html.download(data, filename);
            canvas.remove();
            defer.resolve(data);
        };

        if (canvas.msToBlob) callback(canvas.msToBlob()); else canvas.toBlob(callback, "image/png");
    });
    return defer;
}