Great Write up here Alexander.

I have tried to use a similar solution for a customer using some of your code. It works perfectly until the form is submitted. The difference is I am using the map creator to bind with an address field which uses geocomplete code. I will post my code and see if we can get this working. I just need the Custom HTML to live after the submission. 

$(document).ready(function () {
  
      var latlng = $('#q58 input').val();
      if(latlng.length > 0)
      {
         drawMap(latlng);
      }
      $.getScript('http://localhost/Forms/js/jquery.mask.min.js', function () {
      $(".phone input").mask("(999)999-9999");          
      });  
  
  $('#q58').hide();
});
$.cachedScript = function( url, options ) {
  options = $.extend( options || {}, {
    dataType: "script",
    cache: true,
    url: url
  });
 
  return $.ajax( options );
};
 function drawMap(n) {
    var position =  n.split('|');
    var latitude = position[0];
    var longitude = position[1];
    document.getElementById("latlong-p").innerHTML = "Location found!<br />Latitude: " + latitude + "<br />Longitude: " + longitude;
    var google_tile = "https://maps.googleapis.com/maps/api/staticmap?center=" + latitude + "," + longitude + "&zoom=17&size=700x400&markers=color:red|" + latitude + "," + longitude;
    var canvas = document.getElementById("map-canvas");
    var context = canvas.getContext("2d");
    var img = new Image();
    img.src = google_tile;
    img.onload = function(){
      context.drawImage(img, 0, 0);
    }
  }
var gUrl = "https://maps.googleapis.com/maps/api/js?libraries=places";
var gcUrl = "https://ubilabs.github.io/geocomplete/jquery.geocomplete.js";
$.cachedScript(gUrl).done(
  function(){
    $.cachedScript(gcUrl).done(
  function( script, textStatus ) {
    //#Field4_DSG0 is the ID for the Street Address input on the Address widget
  $("#Field4_DSG0").geocomplete
            ({ details: "form", detailsAttribute: "class" }).bind(
              "geocode:result",
              function(event, result){
               
                //https://developers.google.com/maps/documentation/geocoding/intro?csw=1#Types
                var ac = result.address_components;
                var lat = result.geometry.location.lat();
                var lng = result.geometry.location.lng();
                var c = {};
                $.each(ac, function(k,v1) {$.each(v1.types, function(k2, v2){c[v2]=v1.short_name});})
               
                var lo = c.locality;
                if(lo === undefined)
                  lo = c.postal_town;
                //#Field4_DSG2 is the ID for the City input on the Address widget
                $("#Field4_DSG2").val(lo);
               
                var aal = c.administrative_area_level_1;
                if(aal === undefined)
                  aal = c.administrative_area_level_2;
               
                //#Field4_DSG3 is the ID for the State / Province / Region input on the Address widget
                $("#Field4_DSG3").val(aal);
               
                var pc = c.postal_code;
                if(c.postal_code_suffix != undefined)
                  pc += "-" + c.postal_code_suffix;
               
                //#Field4_DSG4 is the ID for the Postal / Zip Code input on the Address widget
                $("#Field4_DSG4").val(pc);
               
                //#Field4_DSG5 is the ID for the Country input on the Address widget
                $("#Field4_DSG5").val(c.country);
               
                //Reformat Street Address to only have the address in it
                var addr = $("#Field4_DSG0").val().split(",");
                $("#Field4_DSG0").val(addr[0]);
                var position = lat + "|" + lng;
                $('#q58 input').val(position);
                $('#q54 input').val(lat);
                $('#q55 input').val(lng);
                drawMap(position);
                //console.log(result);
              });
       });   
});

Is there a way to do what Chris initially asked for other purposes "how to Hold or freeze an custom HTML active script when submitting"?

Although I am not drawing maps, I am free hand drawing using a color pallet. It looks great until you click submit, the drawing appears blank after submission. 

I'm okay with adding an additional checkbox asking if it's complete so it can act as the trigger to "lock it down".  

Thanks in advance.