From 924187a74d3acecab6f49b0c3a3256e4a2e89c81 Mon Sep 17 00:00:00 2001
From: Mike Bostock <mbostock@gmail.com>
Date: Sun, 13 Nov 2016 19:56:55 -0800
Subject: [PATCH] Fill and stroke for geo2svg!

---
 README.md   | 28 +++++++++++++++++++++++++++-
 bin/geo2svg | 36 ++++++++++++++++++++++++++++++++----
 2 files changed, 59 insertions(+), 5 deletions(-)

diff --git a/README.md b/README.md
index 9a2957a..973fdaf 100644
--- a/README.md
+++ b/README.md
@@ -858,7 +858,25 @@ See also [geoproject --precision](#geoproject_precision) and [geo2svg --precisio
 
 <a href="#geo2svg" name="geo2svg">#</a> <b>geo2svg</b> [<i>options…</i>] [<i>file</i>] [<>](https://github.com/d3/d3-geo-projection/blob/master/bin/geo2svg "Source")
 
-Converts the specified GeoJSON *file* to SVG. With [--newline-delimited](#geo2svg_newline_delimited), each input feature is rendered as a separate [path element](https://www.w3.org/TR/SVG/paths.html); otherwise, a single path element is generated. If the associated [GeoJSON feature](http://geojson.org/geojson-spec.html#feature-objects) has an id, the path element will have a corresponding id attribute. The SVG’s fill is set to none and the stroke is set to black.
+Converts the specified GeoJSON *file* to SVG. With [--newline-delimited](#geo2svg_newline_delimited), each input feature is rendered as a separate [path element](https://www.w3.org/TR/SVG/paths.html); otherwise, a single path element is generated.
+
+By default, the SVG’s [fill](#geo2svg_fill) is set to none and the [stroke](#geo2svg_stroke) is set to black. To override these values on a per-feature basis, the following [GeoJSON feature](http://geojson.org/geojson-spec.html#feature-objects) properties will be propagated to attributes:
+
+* fill
+* fill-rule or fillRule
+* fill-opacity or fillOpacity
+* stroke
+* stroke-width or strokeWidth
+* stroke-linecap or strokeLinecap
+* stroke-linejoin or strokeLinejoin
+* stroke-miterlimit or strokeMiterlimit
+* stroke-dasharray or strokeDasharray
+* stroke-dashoffset or strokeDashoffset
+* stroke-opacity or strokeOpacity
+
+If the feature has an id, the path element will have a corresponding id attribute. If the feature has a *title* property, the path element will have a title element with the corresponding value.
+
+Note: per-feature attributes are most useful in conjunction with [newline-delimited](#geo2svg_newline_delimited) input, as otherwise the generated SVG only has a single path element. To set these properties dynamically, pass the input through [ndjson-map](https://github.com/mbostock/ndjson-map/blob/master/README#map).
 
 <a name="geo2svg_help" href="geo2svg_help">#</a> geo2svg <b>-h</b>
 <br><a href="geo2svg_help">#</a> geo2svg <b>--help</b>
@@ -890,6 +908,14 @@ Specify the output height. Defaults to 500.
 
 Reduce the precision for smaller output files. Defaults to six digits after the decimal point. See also [d3.geoQuantize](#geoQuantize).
 
+<a name="geo2svg_fill" href="geo2svg_fill">#</a> geo2svg <b>--fill</b> <i>value</i>
+
+Specify the default output fill color. Defaults to none.
+
+<a name="geo2svg_stroke" href="geo2svg_stroke">#</a> geo2svg <b>--stroke</b> <i>value</i>
+
+Specify the default output stroke color. Defaults to black.
+
 <a name="geo2svg_newline_delimited" href="geo2svg_newline_delimited">#</a> geo2svg <b>-n</b>
 <br><a href="geo2svg_newline_delimited">#</a> geo2svg <b>--newline-delimited</b>
 
diff --git a/bin/geo2svg b/bin/geo2svg
index fd40aec..9d0df54 100755
--- a/bin/geo2svg
+++ b/bin/geo2svg
@@ -15,6 +15,8 @@ commander
     .option("-h, --height <value>", "output height", 500)
     .option("-p, --precision <value>", "number of output digits after the decimal point", 6)
     .option("-n, --newline-delimited", "accept newline-delimited JSON")
+    .option("--fill <value>", "default fill", "none")
+    .option("--stroke <value>", "default stroke", "black")
     .parse(process.argv);
 
 if (commander.args.length === 0) commander.args[0] = "-";
@@ -41,14 +43,30 @@ writer.write("<?xml version=\"1.0\" encoding=\"utf-8\"?>" + os.EOL
     + " width=\"" + +commander.width + "\""
     + " height=\"" + +commander.height + "\""
     + " viewBox=\"0 0 " + +commander.width + " " + +commander.height + "\""
-    + " fill=\"none\" stroke=\"black\""
+    + (commander.fill != "black" ? " fill=\"" + attr(commander.fill) + "\"" : "")
+    + (commander.stroke != "none" ? " stroke=\"" + attr(commander.stroke) + "\"" : "")
     + ">" + os.EOL);
 
 function transform(d) {
+  var p = d.properties, v;
   return writer.write("  <path"
-      + (d.id == null ? "" : " id=\"" + quote(d.id + "") + "\"")
+      + ((v = d.id) != null ? " id=\"" + attr(v + "") + "\"" : "")
+      + (p ? ((v = p["fill"]) != null ? " fill=\"" + attr(v + "") + "\"" : "")
+        + ((v = p["fill-rule"] || p.fillRule) != null ? " fill-rule=\"" + attr(v + "") + "\"" : "")
+        + ((v = p["fill-opacity"] || p.fillOpacity) != null ? " fill-opacity=\"" + attr(v + "") + "\"" : "")
+        + ((v = p["stroke"]) != null ? " stroke=\"" + attr(v + "") + "\"" : "")
+        + ((v = p["stroke-width"] || p.strokeWidth) != null ? " stroke-width=\"" + attr(v + "") + "\"" : "")
+        + ((v = p["stroke-linecap"] || p.strokeLinecap) != null ? " stroke-linecap=\"" + attr(v + "") + "\"" : "")
+        + ((v = p["stroke-linejoin"] || p.strokeLinejoin) != null ? " stroke-linejoin=\"" + attr(v + "") + "\"" : "")
+        + ((v = p["stroke-miterlimit"] || p.strokeMiterlimit) != null ? " stroke-miterlimit=\"" + attr(v + "") + "\"" : "")
+        + ((v = p["stroke-dasharray"] || p.strokeDasharray) != null ? " stroke-dasharray=\"" + attr(v + "") + "\"" : "")
+        + ((v = p["stroke-dashoffset"] || p.strokeDashoffset) != null ? " stroke-dashoffset=\"" + attr(v + "") + "\"" : "")
+        + ((v = p["stroke-opacity"] || p.strokeOpacity) != null ? " stroke-opacity=\"" + attr(v + "") + "\"" : "")
+      : "")
       + (string = "", render(d), string ? " d=\"" + string + "\"" : "")
-      + "></path>" + os.EOL);
+      + ">"
+      + ((v = p && p["title"]) != null ? "<title>" + text(v + "") + "</title>" : "")
+      + "</path>" + os.EOL);
 }
 
 function end() {
@@ -59,6 +77,16 @@ function abort(error) {
   console.error(error.stack);
 }
 
-function quote(string) {
+function text(string) {
+  return string.replace(/[&<>]/g, function(character) {
+    switch (character) {
+      case "&": return "&amp;";
+      case "<": return "&lt;";
+      case ">": return "&gt;";
+    }
+  });
+}
+
+function attr(string) {
   return string.replace(/"/g, "&quot;");
 }