Create complete-world-map.js

Regions have 5 (i.e. TR.CK ) character codes, and territories have 2 digit codes(i.e. US ). You can use jQuery to turn off the regions at a certain zoom point. Or show only those in the Territory. Below is an example.

maps = $("#worldmap").vectorMap({
    map: 'world_mill_en',
    backgroundColor: "none",
    hoverOpacity: 1.0,
    hoverColor: false,
    zoomMax: 22,
    regionStyle: {
        initial: {
            "fill-opacity": 1,
            "fill": "#0f5391"
        },
        hover: {
            "stroke-opacity": 1.0,
            "fill-opacity": 0.8
        }
    },
    onRegionLabelShow: function (e, el, code) {
        var clickcount = (!gdpData[code]) ? 0 : gdpData[code];
        var compString = jvm.WorldMap.maps.world_mill_en.paths["" + code].name;

        if (code.length < 3) {
            el.html(el.html() + ' (Clicks - ' + clickcount + ')');
        } else {
            var territoryName = code.substr(0, 2);
            el.html(el.html() + ', ' + territoryName + ' (Clicks - ' + clickcount + ')');
        }
    },
    series: {
        regions: [{
            values: gdpData,
            min: 0,
            normalizeFunction: 'linear',
            scale: ["#1763d4", "#54cdff"]
        }]
    },
    focusOn: {
        x: 0.2,
        y: 0.275,
        scale: 2.80
    }
});


jvm.$.showRegion = function () {

      var worldMap = $("#worldmap").vectorMap('get', 'mapObject');
      var dataArr = worldMap.series.regions[0].values;

      $('path.jvectormap-region.jvectormap-element').each(function () {
          var regionCode = $(this).attr('data-code');
          if (regionCode.length > 2 && dataArr[regionCode.substr(0, 2)]) {
              $(this).removeAttr('style');
              var fill = $(this).attr('fill');
              $(this).attr('stroke-width', '0.5');
              $(this).attr('stroke', fill);
              $(this).attr('stroke-miterlimit', '1');
              $(this).attr('stroke-linecap', 'round');
              $(this).attr('mem', 'okay');
              $(this).attr('stroke-linejoin', 'round');

              if (!$("path[data-code='" + regionCode.substr(0, 2) + "']").attr('style')) {
                  $("path[data-code='" + regionCode.substr(0, 2) + "']").attr('style', 'fill: #EEEEEE !important;');
              }

              $(this).attr('style', 'stroke:' + fill + '; stroke-width: 0.5px; stroke-linecap:round; stroke-miterlimit: 1;stroke-linejoin: round;');
          }
      });
};

jvm.$.hideRegion = function () {
    $pathNode =  $('path.jvectormap-region.jvectormap-element');

    $($pathNode).each(function () {
        var regionCode = $(this).attr('data-code');
        if (regionCode.length > 3) {
            $(this).attr('style', 'display:none');

            if ($("path[data-code='" + regionCode.substr(0, 2) + "']").attr('style')) {
                $("path[data-code='" + regionCode.substr(0, 2) + "']").removeAttr('style');
            }
        }
    });
};

jvm.$.getScale = function () {
    var worldMap = $("#worldmap").vectorMap('get', 'mapObject');
    return worldMap.scale;
 };

jvm.$.addOrRemoveRegions = function () {
    var scale = jvm.$.getScale();
    if (scale > 1.2) {
        jvm.$.showRegions();
     }

      if (scale < 1.2) {
          jvm.$.hideRegions();
       }
};

$('#worldmapWrapper').bind('mousewheel', function (event, delta, nbr) {
    clearTimeout($.data(this, 'timer'));
    $.data(this, 'timer', setTimeout(function () {
        jvm.$.addOrRemoveRegions();
    }, 200));
});