mapshaper 0.6.66 → 0.6.68

package/www/mapshaper.js

@@ -13397,10 +13397,11 @@
 
   // str: display size in px, pt or in
   // using: 72pt per inch, 1pt per pixel.
-  function parseSizeParam(str) {
-    var num = parseFloat(str),
-        units = /px$/.test(str) && 'px' || /pt$/.test(str) && 'pt' ||
-          /in$/.test(str) && 'in' || !isNaN(+str) && 'px' || null;
+  function parseSizeParam(p) {
+    var str = String(p),
+        num = parseFloat(str),
+        units = /px|pix/.test(str) && 'px' || /pt|point/.test(str) && 'pt' ||
+          /in/.test(str) && 'in' || !isNaN(+str) && 'px' || null;
     if (isNaN(num) || !units) {
       stop('Invalid size:', str);
     }
@@ -14725,6 +14726,9 @@
         bounds: function() {
           return shapeBounds().toArray();
         },
+        bbox: function() {
+          return shapeBounds().toArray();
+        },
         height: function() {
           return shapeBounds().height();
         },
@@ -17322,9 +17326,10 @@
   }
 
   function getGapRemovalMessage(removed, retained, areaLabel) {
+    var tot = removed + retained;
     if (removed > 0 === false) return '';
-    return utils.format('Removed %,d / %,d sliver%s using %s',
-        removed, removed + retained, utils.pluralSuffix(removed), areaLabel);
+    return utils.format('Removed %,d of %,d sliver%s using %s',
+        removed, tot, utils.pluralSuffix(tot), areaLabel);
   }
 
   function dissolvePolygonGroups2(groups, lyr, dataset, opts) {
@@ -18228,7 +18233,7 @@
     var frameLyr = findFrameLayerInDataset(dataset);
     var frameData;
     if (frameLyr) {
-      frameData = getFrameLayerData(frameLyr, dataset);
+      frameData = getFrameLayerData(frameLyr, dataset.arcs);
     } else {
       frameData = calcFrameData(dataset, exportOpts);
     }
@@ -18237,8 +18242,8 @@
   }
 
 
-  function getFrameLayerData(lyr, dataset) {
-    var bounds = getLayerBounds(lyr, dataset.arcs);
+  function getFrameLayerData(lyr, arcs) {
+    var bounds = getLayerBounds(lyr, arcs);
     var d = lyr.data.getReadOnlyRecordAt(0);
     var w = d.width || 800;
     var h = w * bounds.height() / bounds.width();
@@ -18250,10 +18255,6 @@
     };
   }
 
-  // export function getFrameLayerData(lyr) {
-  //   return lyr.data && lyr.data.getReadOnlyRecordAt(0);
-  // }
-
 
   function calcFrameData(dataset, opts) {
     var bounds;
@@ -18287,31 +18288,34 @@
 
 
   // @lyr dataset layer
-  function isFrameLayer(lyr, dataset) {
+  function isFrameLayer(lyr, arcs) {
     return getFurnitureLayerType(lyr) == 'frame' &&
-      layerIsRectangle(lyr, dataset.arcs);
+      layerIsRectangle(lyr, arcs);
   }
 
   function findFrameLayerInDataset(dataset) {
     return utils.find(dataset.layers, function(lyr) {
-      return isFrameLayer(lyr, dataset);
+      return isFrameLayer(lyr, dataset.arcs);
     });
   }
 
+  // TODO: handle multiple frames in catalog
   function findFrameDataset(catalog) {
-    var target = utils.find(catalog.getLayers(), function(o) {
-      return isFrameLayer(o.layer, o.dataset);
-    });
-    return target ? target.dataset : null;
+    var target = findFrame(catalog);
+    return target && target.dataset || null;
   }
 
   function findFrameLayer(catalog) {
-    var target = utils.find(catalog.getLayers(), function(o) {
-      return isFrameLayer(o.layer, o.dataset);
-    });
+    var target = findFrame(catalog);
     return target && target.layer || null;
   }
 
+  function findFrame(catalog) {
+    return utils.find(catalog.getLayers(), function(o) {
+      return isFrameLayer(o.layer, o.dataset.arcs);
+    });
+  }
+
   function getFrameLayerBounds(lyr) {
     return new Bounds(getFurnitureLayerData(lyr).bbox);
   }
@@ -18445,10 +18449,13 @@
   var FrameData = /*#__PURE__*/Object.freeze({
     __proto__: null,
     getFrameData: getFrameData,
+    getFrameLayerData: getFrameLayerData,
     getFrameSize: getFrameSize,
+    isFrameLayer: isFrameLayer,
     findFrameLayerInDataset: findFrameLayerInDataset,
     findFrameDataset: findFrameDataset,
     findFrameLayer: findFrameLayer,
+    findFrame: findFrame,
     getFrameLayerBounds: getFrameLayerBounds,
     getMapFrameMetersPerPixel: getMapFrameMetersPerPixel,
     calcOutputSizeInPixels: calcOutputSizeInPixels,
@@ -18888,6 +18895,7 @@
     'font-family': null,
     'font-size': null,
     'font-style': null,
+    'font-stretch': null,
     'font-weight': null,
     'label-text': null,  // leaving this null
     'letter-spacing': 'measure',
@@ -18937,7 +18945,7 @@
     polyline: utils.arrayToIndex(commonProperties.concat('stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit')),
     point: utils.arrayToIndex(commonProperties.concat('fill', 'r')),
     label: utils.arrayToIndex(commonProperties.concat(
-      'fill,font-family,font-size,text-anchor,font-weight,font-style,letter-spacing,dominant-baseline'.split(',')))
+      'fill,font-family,font-size,text-anchor,font-weight,font-style,font-stretch,letter-spacing,dominant-baseline'.split(',')))
   };
 
   // symType: point, polygon, polyline, label
@@ -19270,12 +19278,12 @@
   // Kludge for applying fill and other styles to a <text> element
   // (for rendering labels in the GUI with the dot in Canvas, not SVG)
   function renderStyledLabel(rec) {
-    var o = renderLabel(rec);
+    var o = renderLabel$1(rec);
     applyStyleAttributes(o, 'label', rec);
     return o;
   }
 
-  function renderLabel(rec) {
+  function renderLabel$1(rec) {
     var line = toLabelString(rec['label-text']);
     var morelines, obj;
     // Accepting \n (two chars) as an alternative to the newline character
@@ -19320,7 +19328,7 @@
   var SvgLabels = /*#__PURE__*/Object.freeze({
     __proto__: null,
     renderStyledLabel: renderStyledLabel,
-    renderLabel: renderLabel
+    renderLabel: renderLabel$1
   });
 
   // convert data records (properties like svg-symbol, label-text, fill, r) to svg symbols
@@ -19532,13 +19540,64 @@
     };
   }
 
-  // TODO: generalize to other kinds of furniture as they are developed
-  function getScalebarPosition(opts) {
-    var pos = opts.position || 'top-left';
-    return {
-      valign: pos.includes('top') ? 'top' : 'bottom',
-      halign: pos.includes('left') ? 'left' : 'right'
+  function renderScalebar(d, frame) {
+    if (!frame.crs) {
+      message('Unable to render scalebar: unknown CRS.');
+      return [];
+    }
+    if (frame.width > 0 === false) {
+      return [];
+    }
+
+    var opts = getScalebarOpts(d);
+    var metersPerPx = getMapFrameMetersPerPixel(frame);
+    var frameWidthPx = frame.width;
+    var labels = d.label ? d.label.split(',') : null;
+    var label1 = labels && labels[0] || null;
+    var props1 = parseScalebarLabel(label1 || getAutoScalebarLabel(frameWidthPx, metersPerPx, 'mile'));
+    var label2 = opts.style == 'b' && labels && labels[1] || null;
+    var props2, length2;
+
+    if (props1.km > 0 === false) {
+      message('Unusable scalebar label:', label1);
+      return [];
+    }
+
+    var length1 = Math.round(props1.km / metersPerPx * 1000);
+    if (length1 > 0 === false) {
+      stop("Null scalebar length");
+    }
+
+    if (label2) {
+      props2 = parseScalebarLabel(label2);
+      length2 = Math.round(props2.km / metersPerPx * 1000);
+      if (length2 > length1) {
+        stop("First part of a dual-unit scalebar must be longer than the second part.");
+      }
+    }
+
+    var barPos = getScalebarPosition(opts);
+    var labelPos = getLabelPosition(opts);
+    var dx = barPos.xpos == 'right' ? frameWidthPx - length1 - opts.margin : opts.margin;
+    var dy = barPos.ypos == 'bottom' ? frame.height - opts.margin : opts.margin;
+
+    // vshift to adjust for height above or below the baseline
+    var labelHeight = Math.round(opts.label_offset + opts.tic_length + opts.font_size * 0.8 + opts.bar_width / 2);
+    var bareHeight = Math.round(opts.bar_width / 2);
+    var topHeight = labelPos.ypos == 'top' || label2 ? labelHeight : bareHeight;
+    var bottomHeight = labelPos.ypos == 'bottom' || label2 ? labelHeight : bareHeight;
+    if (barPos.ypos == 'top') {
+      dy += topHeight;
+    } else {
+      dy -= bottomHeight;
+    }
+
+    var g = renderAsSvg(length1, label1, length2, label2, opts);
+    g.properties = {
+      transform: 'translate(' + dx + ' ' + dy + ')'
     };
+
+    return [g];
   }
 
   var styleOpts = {
@@ -19565,105 +19624,112 @@
     return Object.assign({}, defaultOpts, styleOpts[style], d, {style: style});
   }
 
-  // approximate pixel height of the scalebar
-  function getScalebarHeight(opts) {
-    return Math.round(opts.bar_width + opts.label_offset +
-        opts.tic_length + opts.font_size * 0.8);
+  function renderAsSvg(length, text, length2, text2, opts) {
+    var labelPart = renderLabel(text, length, opts);
+    var zeroLabelPart = renderLabel('0', length, Object.assign({flipx: true}, opts));
+    var barPart = renderBar(length, length2, opts);
+    var parts = opts.style == 'b' ? [zeroLabelPart, labelPart, barPart] : [labelPart, barPart];
+    if (text2) {
+      parts.push(renderLabel(text2, length2, Object.assign({flipy: true}, opts)));
+      parts.push(renderLabel('0', length2, Object.assign({flipx: true, flipy: true}, opts)));
+    }
+    return {
+      tag: 'g',
+      children: parts
+    };
   }
 
-  function renderAsSvg(length, text, opts) {
-    // label part
-    var xOff = opts.style == 'b' ? Math.round(opts.font_size / 4) : 0;
-    var alignLeft = opts.style == 'a' && opts.position.includes('left');
-    var anchorX = alignLeft ? -xOff : length + xOff;
-    var anchorY = opts.bar_width + + opts.tic_length + opts.label_offset;
-    if (opts.label_position == 'top') {
-      anchorY = -opts.label_offset - opts.tic_length;
-    }
+  // TODO: generalize to other kinds of furniture as they are developed
+  function getScalebarPosition(opts) {
+    var pos = opts.position || 'top-left';
+    return {
+      ypos: pos.includes('top') ? 'top' : 'bottom',
+      xpos: pos.includes('left') ? 'left' : 'right'
+    };
+  }
+
+  function renderLabel(text, length, opts) {
+    var labelPos = getLabelPosition(opts);
+    var anchorX = length * labelPos.kx + labelPos.dx;
+    var bottomLabelY = opts.bar_width + opts.tic_length + opts.label_offset;
+    var topLabelY = -opts.label_offset - opts.tic_length;
+    var anchorY = labelPos.ypos == 'top' ? topLabelY : bottomLabelY;
     var labelOpts = {
         'label-text': text,
         'font-size': opts.font_size,
-        'text-anchor': alignLeft ? 'start': 'end',
-        'dominant-baseline': opts.label_position == 'top' ? 'auto' : 'hanging'
+        'text-anchor': labelPos.anchor,
+        'dominant-baseline': labelPos.ypos == 'top' ? 'auto' : 'hanging'
         //// 'dominant-baseline': labelPos == 'top' ? 'text-after-edge' : 'text-before-edge'
         // 'text-after-edge' is buggy in Safari and unsupported by Illustrator,
         // so I'm using 'hanging' and 'auto', which seem to be well supported.
         // downside: requires a kludgy multiplier to calculate scalebar height (see above)
       };
-    var labelPart = symbolRenderers.label(labelOpts, anchorX, anchorY);
-    var zeroOpts = Object.assign({}, labelOpts, {'label-text': '0', 'text-anchor': 'start'});
-    var zeroLabel = symbolRenderers.label(zeroOpts, -xOff, anchorY);
+    return symbolRenderers.label(labelOpts, anchorX, anchorY);
+  }
 
-    // bar part
-    var y = 0;
-    var y2 = opts.tic_length + opts.bar_width / 2;
-    var coords;
-    if (opts.label_position == "top") {
-      y2 = -y2;
-    }
-    if (opts.tic_length > 0) {
-      coords = [[0, y2], [0, y], [length, y], [length, y2]];
+  function getLabelPosition(opts) {
+    var pos = opts.label_position;
+    var ypos = pos.includes('bottom') && 'bottom' || 'top';
+    var dx = 0;
+    var xpos;
+    if (opts.style == 'a') {
+      xpos = pos.includes('center') && 'center' || pos.includes('right') && 'right' || 'left';
     } else {
-      coords = [[0, y], [length, y]];
+      xpos = 'right'; // style b
+    }
+    if (opts.flipx) {
+      xpos = xpos == 'left' && 'right' || xpos == 'right' && 'left' || xpos;
+    }
+    if (opts.flipy) {
+      ypos = ypos == 'top' && 'bottom' || ypos == 'bottom' && 'top' || ypos;
+    }
+    if (opts.style == 'b') {
+      dx = xpos == 'left' && -opts.font_size / 4 || xpos == 'right' && opts.font_size / 4 || 0;
     }
-    var barPart = importLineString(coords);
-    Object.assign(barPart.properties, {
-      stroke: 'black',
-      fill: 'none',
-      'stroke-width': opts.bar_width,
-      'stroke-linecap': 'butt',
-      'stroke-linejoin': 'miter'
-    });
-    var parts = opts.style == 'b' ? [zeroLabel, labelPart, barPart] : [labelPart, barPart];
     return {
-      tag: 'g',
-      children: parts
+      xpos,
+      ypos,
+      dx,
+      kx: xpos == 'right' && 1 || xpos == 'center' && 0.5 || 0,
+      anchor: xpos == 'center' && 'middle' || xpos == 'left' && 'start' || 'end'
     };
   }
 
-  function renderScalebar(d, frame) {
-    if (!frame.crs) {
-      message('Unable to render scalebar: unknown CRS.');
-      return [];
-    }
-    if (frame.width > 0 === false) {
-      return [];
-    }
-
-    var opts = getScalebarOpts(d);
-    var metersPerPx = getMapFrameMetersPerPixel(frame);
-    var frameWidthPx = frame.width;
-    var unit = d.label ? parseScalebarUnits(d.label) : 'mile';
-    var number = d.label ? parseScalebarNumber(d.label) : null;
-    var label = number && unit ? d.label : getAutoScalebarLabel(frameWidthPx, metersPerPx, unit);
-
-    var scalebarKm = parseScalebarLabelToKm(label);
-    if (scalebarKm > 0 === false) {
-      message('Unusable scalebar label:', label);
-      return [];
+  // length1: length of main bar
+  // length2: length of optional second distance (assumes that length2 <= length1)
+  function getStyleBCoords(length1, length2, opts) {
+    var coords = [];
+    var labelPos = getLabelPosition(opts);
+    var y = opts.tic_length + opts.bar_width / 2;
+    if (labelPos.ypos == "top") {
+      y = -y;
     }
-
-    var width = Math.round(scalebarKm / metersPerPx * 1000);
-    if (width > 0 === false) {
-      stop("Null scalebar length");
+    coords.push([[0, y], [0, 0], [length1, 0], [length1, y]]);
+    if (length2 > 0) {
+      coords.push([[0, 0], [0, -y]]);
+      coords.push([[length2, 0], [length2, -y]]);
     }
+    return coords;
+  }
 
-    var pos = getScalebarPosition(opts);
-    var height = getScalebarHeight(opts);
-    var dx = pos.halign == 'right' ? frameWidthPx - width - opts.margin : opts.margin;
-    var dy = pos.valign == 'bottom' ? frame.height - height - opts.margin : opts.margin;
-    if (opts.label_position == 'top') {
-      dy += Math.round(opts.label_offset + opts.tic_length + opts.font_size * 0.8 + opts.bar_width / 2);
+  // length: length of scale bar in px
+  // length2: length of optional dual-units portion of the scalebar
+  function renderBar(length, length2, opts) {
+    var coords;
+    if (opts.style == 'b') {
+      coords = getStyleBCoords(length, length2, opts);
     } else {
-      dy += Math.round(opts.bar_width / 2);
+      coords = [[[0, 0], [length, 0]]];
     }
-
-    var g = renderAsSvg(width, label, opts);
-    g.properties = {
-      transform: 'translate(' + dx + ' ' + dy + ')'
-    };
-
-    return [g];
+    var bar = importMultiLineString(coords);
+    Object.assign(bar.properties, {
+      stroke: 'black',
+      fill: 'none',
+      'stroke-width': opts.bar_width,
+      'stroke-linecap': 'butt',
+      'stroke-linejoin': 'miter'
+    });
+    return bar;
   }
 
   // unit: 'km' || 'mile'
@@ -19697,6 +19763,20 @@
     return units == 'mile' ? value * 1.60934 : value;
   }
 
+  function parseScalebarLabel(label) {
+    var num = label ? parseScalebarNumber(label) : null;
+    var units = label ? parseScalebarUnits(label) : 'mile';
+    var km = NaN;
+    if (units && num) {
+      km =  units == 'mile' ? num * 1.60934 : num;
+    }
+    return {
+      number: num,
+      units: units,
+      km: km
+    };
+  }
+
   function parseScalebarUnits(str) {
     var isMiles = /miles?$/.test(str.toLowerCase());
     var isKm = /(k\.m\.|km|kilometers?|kilometres?)$/.test(str.toLowerCase());
@@ -19725,84 +19805,9 @@
     parseScalebarLabelToKm: parseScalebarLabelToKm
   });
 
-  cmd.frame = function(catalog, source, opts) {
-    var size, bounds, tmp, dataset;
-    if (+opts.width > 0 === false && +opts.pixels > 0 === false) {
-      stop("Missing a width or area");
-    }
-    if (opts.width && opts.height) {
-      opts = utils.extend({}, opts);
-      // Height is a string containing either a number or a
-      //   comma-sep. pair of numbers (range); here we convert height to
-      //   an aspect-ratio parameter for the rectangle() function
-      opts.aspect_ratio = getAspectRatioArg(opts.width, opts.height);
-      // TODO: currently returns max,min aspect ratio, should return in min,max order
-      // (rectangle() function should handle max,min argument correctly now anyway)
-    }
-    tmp = cmd.rectangle(source, opts);
-    bounds = getDatasetBounds(tmp);
-    if (probablyDecimalDegreeBounds(bounds)) {
-      stop('Frames require projected, not geographical coordinates');
-    } else if (!getDatasetCRS(tmp)) {
-      message('Warning: missing projection data. Assuming coordinates are meters and k (scale factor) is 1');
-    }
-    size = getFrameSize(bounds, opts);
-    if (size[0] > 0 === false) {
-      stop('Missing a valid frame width');
-    }
-    if (size[1] > 0 === false) {
-      stop('Missing a valid frame height');
-    }
-    dataset = {info: {}, layers:[{
-      name: opts.name || 'frame',
-      data: new DataTable([{
-        width: size[0],
-        height: size[1],
-        bbox: bounds.toArray(),
-        type: 'frame'
-      }])
-    }]};
-    catalog.addDataset(dataset);
-  };
-
-
-  // Convert width and height args to aspect ratio arg for the rectangle() function
-  function getAspectRatioArg(widthArg, heightArg) {
-    // heightArg is a string containing either a number or a
-    // comma-sep. pair of numbers (range);
-    return heightArg.split(',').map(function(opt) {
-      var height = Number(opt),
-          width = Number(widthArg);
-      if (!opt) return '';
-      return width / height;
-    }).reverse().join(',');
-  }
-
-
-  function renderFrame(d) {
-    var lineWidth = 1,
-        // inset stroke by half of line width
-        off = lineWidth / 2,
-        obj = importPolygon([[[off, off], [off, d.height - off],
-          [d.width - off, d.height - off],
-          [d.width - off, off], [off, off]]]);
-    utils.extend(obj.properties, {
-        fill: 'none',
-        stroke: d.stroke || 'black',
-        'stroke-width': d['stroke-width'] || lineWidth
-    });
-    return [obj];
-  }
-
-  var Frame = /*#__PURE__*/Object.freeze({
-    __proto__: null,
-    getAspectRatioArg: getAspectRatioArg,
-    renderFrame: renderFrame
-  });
-
   var furnitureRenderers = {
-    scalebar: renderScalebar,
-    frame: renderFrame
+    scalebar: renderScalebar
+    // frame: renderFrame
   };
 
   // @lyr a layer in a dataset
@@ -25185,15 +25190,15 @@ ${svg}
       .validate(validateProjOpts);
 
     parser.command('rectangle')
-      .describe('create a rectangle from a bbox or target layer extent')
+      .describe('create a rectangle from a bbox or target layer')
       .option('bbox', {
         describe: 'rectangle coordinates (xmin,ymin,xmax,ymax)',
         type: 'bbox'
       })
       .option('offset', offsetOpt)
       .option('width', {
-        // describe: 'set viewport width in pixels',
-        type: 'number'
+        describe: 'set width of map in pixels, use rectangle as frame'
+        // type: 'number' // use string, to allow units (e.g. in, px, pt)
       })
       .option('aspect-ratio', aspectRatioOpt)
       .option('source', {
@@ -25470,7 +25475,10 @@ ${svg}
       .option('font-style', {
         describe: 'CSS font style property of labels (e.g. italic)'
       })
-       .option('letter-spacing', {
+      .option('font-stretch', {
+        describe: 'CSS font stretch property of labels (e.g. condensed)'
+      })
+      .option('letter-spacing', {
         describe: 'CSS letter-spacing property of labels'
       })
        .option('line-height', {
@@ -25762,20 +25770,20 @@ ${svg}
         describe: 'frame coordinates (xmin,ymin,xmax,ymax)',
         type: 'bbox'
       })
-      .option('offset', offsetOpt)
+      // .option('offset', offsetOpt)
       .option('width', {
-        describe: 'pixel width of output (default is 800)'
-      })
-      .option('height', {
-        describe: 'pixel height of output (may be a range)'
-      })
-      .option('pixels', {
-        describe: 'area of output in pixels (alternative to width and height)',
-        type: 'number'
-      })
-      .option('source', {
-        describe: 'name of layer to enclose'
+        describe: 'width of output (default is 800px)'
       })
+      // .option('height', {
+      //   describe: 'pixel height of output (may be a range)'
+      // })
+      // .option('pixels', {
+      //   describe: 'area of output in pixels (alternative to width and height)',
+      //   type: 'number'
+      // })
+      // .option('source', {
+      //   describe: 'name of layer to enclose'
+      // })
       .option('name', nameOpt);
 
     parser.command('fuzzy-join')
@@ -25889,7 +25897,11 @@ ${svg}
         describe: 'e.g. bottom-right (default is top-left)'
       })
       .option('label-position', {
-        describe: 'top or bottom'
+        describe: 'top, bottom, top-center (style a), etc'
+      })
+      .option('dual-units', {
+        // describe: 'display both metric and imperial units',
+        type: 'flag'
       })
       .option('margin', {
         describe: 'offset in pixels from edge of map',
@@ -37774,6 +37786,79 @@ ${svg}
     return parsed[0];
   }
 
+  cmd.frame = function(catalog, source, opts) {
+    var size, bounds, tmp, dataset;
+    if (+opts.width > 0 === false && +opts.pixels > 0 === false) {
+      stop("Missing a width or area");
+    }
+    if (opts.width && opts.height) {
+      opts = utils.extend({}, opts);
+      // Height is a string containing either a number or a
+      //   comma-sep. pair of numbers (range); here we convert height to
+      //   an aspect-ratio parameter for the rectangle() function
+      opts.aspect_ratio = getAspectRatioArg(opts.width, opts.height);
+      // TODO: currently returns max,min aspect ratio, should return in min,max order
+      // (rectangle() function should handle max,min argument correctly now anyway)
+    }
+    tmp = cmd.rectangle(source, opts);
+    bounds = getDatasetBounds(tmp);
+    if (probablyDecimalDegreeBounds(bounds)) {
+      stop('Frames require projected, not geographical coordinates');
+    } else if (!getDatasetCRS(tmp)) {
+      message('Warning: missing projection data. Assuming coordinates are meters and k (scale factor) is 1');
+    }
+    size = getFrameSize(bounds, opts);
+    if (size[0] > 0 === false) {
+      stop('Missing a valid frame width');
+    }
+    if (size[1] > 0 === false) {
+      stop('Missing a valid frame height');
+    }
+    dataset = {info: {}, layers:[{
+      name: opts.name || 'frame',
+      data: new DataTable([{
+        width: size[0],
+        height: size[1],
+        bbox: bounds.toArray(),
+        type: 'frame'
+      }])
+    }]};
+    catalog.addDataset(dataset);
+  };
+
+
+  // Convert width and height args to aspect ratio arg for the rectangle() function
+  function getAspectRatioArg(widthArg, heightArg) {
+    // heightArg is a string containing either a number or a
+    // comma-sep. pair of numbers (range);
+    return heightArg.split(',').map(function(opt) {
+      var height = Number(opt),
+          width = Number(widthArg);
+      if (!opt) return '';
+      return width / height;
+    }).reverse().join(',');
+  }
+
+  // export function renderFrame(d) {
+  //   var lineWidth = 1,
+  //       // inset stroke by half of line width
+  //       off = lineWidth / 2,
+  //       obj = importPolygon([[[off, off], [off, d.height - off],
+  //         [d.width - off, d.height - off],
+  //         [d.width - off, off], [off, off]]]);
+  //   utils.extend(obj.properties, {
+  //       fill: 'none',
+  //       stroke: d.stroke || 'black',
+  //       'stroke-width': d['stroke-width'] || lineWidth
+  //   });
+  //   return [obj];
+  // }
+
+  var Frame = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    getAspectRatioArg: getAspectRatioArg
+  });
+
   cmd.filterIslands = function(lyr, dataset, optsArg) {
     var opts = utils.extend({sliver_control: 0}, optsArg); // no sliver control
     var arcs = dataset.arcs;
@@ -38540,6 +38625,13 @@ ${svg}
   // Create rectangles around one or more target layers
   //
   cmd.rectangle2 = function(target, opts) {
+    // if target layer is a rectangle and we're applying frame properties,
+    // turn the target into a frame instead of creating a new rectangle
+    if (target.layers.length == 1 && opts.width &&
+      layerIsRectangle(target.layers[0], target.dataset.arcs)) {
+      applyFrameProperties(target.layers[0], opts);
+      return;
+    }
     var datasets = target.layers.map(function(lyr) {
       var dataset = cmd.rectangle({layer: lyr, dataset: target.dataset}, opts);
       setOutputLayerName(dataset.layers[0], lyr, null, opts);
@@ -38569,16 +38661,21 @@ ${svg}
       properties: {},
       geometry: bboxToPolygon(bounds.toArray(), opts)
     };
-    if (opts.width > 0) {
-      feature.properties.width = opts.width;
-      feature.properties.type = 'frame';
-    }
     var dataset = importGeoJSON(feature, {});
+    applyFrameProperties(dataset.layers[0], opts);
     dataset.layers[0].name = opts.name || 'rectangle';
     setDatasetCrsInfo(dataset, crsInfo);
     return dataset;
   };
 
+  function applyFrameProperties(lyr, opts) {
+    if (!opts.width) return;
+    if (!lyr.data) initDataTable(lyr);
+    var d = lyr.data.getRecords()[0] || {};
+    d.width = parseSizeParam(opts.width);
+    d.type = 'frame';
+  }
+
   function applyRectangleOptions(bounds, crs, opts) {
     var isGeoBox = probablyDecimalDegreeBounds(bounds);
     if (opts.offset) {
@@ -45207,7 +45304,7 @@ ${svg}
     });
   }
 
-  var version = "0.6.66";
+  var version = "0.6.68";
 
   // Parse command line args into commands and run them
   // Function takes an optional Node-style callback. A Promise is returned if no callback is given.