Add Composition Borders (#20)

* Add Composition Borders

* Lint and Tweaks

* lint

README.md

@@ -12,31 +12,31 @@ A [TopoJSON file](https://github.com/topojson/topojson-specification/blob/master
 
 <a href="#villages-mercator-10t.json" name="villages-mercator-10t.json">#</a> <b>villages-mercator-10t.json</b> · [Download](https://cdn.jsdelivr.net/npm/taiwan-atlas/villages-mercator-10t.json "Source")
 
-A [TopoJSON file](https://github.com/topojson/topojson-specification/blob/master/README.md#21-topology-objects) containing the geometry collections <i>villages</i>, <i>towns</i>, <i>counties</i>, and <i>nation</i>. The geometry is quantized, simplified, and projected with the mercatorTw projection. This topology is derived from the Ministry of the Interior’s [村里界圖(TWD97經緯度)](https://data.gov.tw/dataset/7438). The town boundaries are computed by [merging](https://github.com/topojson/topojson-client/blob/master/README.md#merge) villages, the county boundaries by merging towns, and the nation boundary is computed by merging counties, ensuring a consistent topology.
+A [TopoJSON file](https://github.com/topojson/topojson-specification/blob/master/README.md#21-topology-objects) containing the geometry collections <i>villages</i>, <i>towns</i>, <i>counties</i>, and <i>nation</i>. The geometry is quantized, simplified, and projected with the mercatorTw projection. This topology is derived from the Ministry of the Interior’s [村里界圖(TWD97經緯度)](https://data.gov.tw/dataset/7438). The town boundaries are computed by [merging](https://github.com/topojson/topojson-client/blob/master/README.md#merge) villages, the county boundaries by merging towns, and the nation boundary is computed by merging counties, ensuring a consistent topology. This file also contains a compBorders object for optionally drawing the borders of the composed areas.
 
 <a href="#towns-10t.json" name="towns-10t.json">#</a> <b>towns-10t.json</b> · [Download](https://cdn.jsdelivr.net/npm/taiwan-atlas/towns-10t.json "Source")
 
 A [TopoJSON file](https://github.com/topojson/topojson-specification/blob/master/README.md#21-topology-objects) containing the geometry collections <i>towns</i>, <i>counties</i>, and <i>nation</i>. The geometry is quantized and simplified, but not projected. This topology is derived from the Ministry of the Interior’s [鄉鎮市區界線(TWD97經緯度)](https://data.gov.tw/dataset/7441). The county boundaries are computed by [merging](https://github.com/topojson/topojson-client/blob/master/README.md#merge) towns and the nation boundaries by merging counties, ensuring a consistent topology.
 
 <a href="#towns-mercator-10t.json" name="towns-mercator-10t.json">#</a> <b>towns-mercator-10t.json</b> · [Download](https://cdn.jsdelivr.net/npm/taiwan-atlas/towns-mercator-10t.json "Source")
 
-A [TopoJSON file](https://github.com/topojson/topojson-specification/blob/master/README.md#21-topology-objects) containing the geometry collections <i>towns</i>, <i>counties</i>, and <i>nation</i>. The geometry is quantized, simplified, and projected with the mercatorTw projection. This topology is derived from the Ministry of the Interior’s [鄉鎮市區界線(TWD97經緯度)](https://data.gov.tw/dataset/7441). The county boundaries are computed by [merging](https://github.com/topojson/topojson-client/blob/master/README.md#merge) towns and the nation boundaries by merging counties, ensuring a consistent topology.
+A [TopoJSON file](https://github.com/topojson/topojson-specification/blob/master/README.md#21-topology-objects) containing the geometry collections <i>towns</i>, <i>counties</i>, and <i>nation</i>. The geometry is quantized, simplified, and projected with the mercatorTw projection. This topology is derived from the Ministry of the Interior’s [鄉鎮市區界線(TWD97經緯度)](https://data.gov.tw/dataset/7441). The county boundaries are computed by [merging](https://github.com/topojson/topojson-client/blob/master/README.md#merge) towns and the nation boundaries by merging counties, ensuring a consistent topology. This file also contains a compBorders object for optionally drawing the borders of the composed areas.
 
 <a href="#counties-10t.json" name="counties-10t.json">#</a> <b>counties-10t.json</b> · [Download](https://cdn.jsdelivr.net/npm/taiwan-atlas/counties-10t.json "Source")
 
 A [TopoJSON file](https://github.com/topojson/topojson-specification/blob/master/README.md#21-topology-objects) containing the geometry collections <i>counties</i>, and <i>nation</i>. The geometry is quantized and simplified, but not projected. This topology is derived from the Ministry of the Interior’s [直轄市、縣市界線(TWD97經緯度)](https://data.gov.tw/dataset/7442). The nation boundaries are computed by [merging](https://github.com/topojson/topojson-client/blob/master/README.md#merge) counties, ensuring a consistent topology.
 
 <a href="#counties-mercator-10t.json" name="counties-mercator-10t.json">#</a> <b>counties-mercator-10t.json</b> · [Download](https://cdn.jsdelivr.net/npm/taiwan-atlas/counties-mercator-10t.json "Source")
 
-A [TopoJSON file](https://github.com/topojson/topojson-specification/blob/master/README.md#21-topology-objects) containing the geometry collections <i>counties</i> and <i>nation</i>. The geometry is quantized, simplified, and projected with the mercatorTw projection. This topology is derived from the Ministry of the Interior’s [直轄市、縣市界線(TWD97經緯度)](https://data.gov.tw/dataset/7442). The nation boundaries are computed by [merging](https://github.com/topojson/topojson-client/blob/master/README.md#merge) counties, ensuring a consistent topology.
+A [TopoJSON file](https://github.com/topojson/topojson-specification/blob/master/README.md#21-topology-objects) containing the geometry collections <i>counties</i> and <i>nation</i>. The geometry is quantized, simplified, and projected with the mercatorTw projection. This topology is derived from the Ministry of the Interior’s [直轄市、縣市界線(TWD97經緯度)](https://data.gov.tw/dataset/7442). The nation boundaries are computed by [merging](https://github.com/topojson/topojson-client/blob/master/README.md#merge) counties, ensuring a consistent topology. This file also contains a compBorders object for optionally drawing the borders of the composed areas.
 
 <a href="#nation-10t.json" name="nation-10t.json">#</a> <b>nation-10t.json</b> · [Download](https://cdn.jsdelivr.net/npm/taiwan-atlas/nation-10t.json "Source")
 
 A [TopoJSON file](https://github.com/topojson/topojson-specification/blob/master/README.md#21-topology-objects) containing the geometry collections <i>nation</i>. The geometry is quantized and simplified, but not projected. This topology is derived from the Ministry of the Interior’s [直轄市、縣市界線(TWD97經緯度)](https://data.gov.tw/dataset/7442).
 
 <a href="#nation-mercator-10t.json" name="nation-mercator-10t.json">#</a> <b>nation-mercator-10t.json</b> · [Download](https://cdn.jsdelivr.net/npm/taiwan-atlas/nation-mercator-10t.json "Source")
 
-A [TopoJSON file](https://github.com/topojson/topojson-specification/blob/master/README.md#21-topology-objects) containing the geometry collections <i>nation</i>. The geometry is quantized, simplified, and projected with the mercatorTw projection. This topology is derived from the Ministry of the Interior’s [直轄市、縣市界線(TWD97經緯度)](https://data.gov.tw/dataset/7442).
+A [TopoJSON file](https://github.com/topojson/topojson-specification/blob/master/README.md#21-topology-objects) containing the geometry collections <i>nation</i>. The geometry is quantized, simplified, and projected with the mercatorTw projection. This topology is derived from the Ministry of the Interior’s [直轄市、縣市界線(TWD97經緯度)](https://data.gov.tw/dataset/7442). This file also contains a compBorders object for optionally drawing the borders of the composed areas.
 
 <a href="#tw.objects.nation" name="tw.objects.nation">#</a> tw.objects<b>.nation</b>
 
@@ -76,10 +76,19 @@ The village object has the following fields in addition to the town and county f
 - village.properties.VILLID - The village specifying id
 - village.properties.VILLCODE - The 11 digit county code
 
+The compBorders object has the following fields:
+- compBorders.properties.BORDERLEVEL - The administrative level that this border encompasses.
+- compBorders.properties.NAME - The name in Chinese of the administrative area that this border encompasses.
+- compBorders.properties.ID - The id of the administrative area that this border encompasses.
+- compBorders.properties.CODE - The name of the administrative area that this border encompasses.
+- compBorders.properties.ENG - The name in English of the administrative area that this border encompasses.
+
 ## MercatorTw Projection
 
 `mercatorTw.js` uses a Taiwan-centric composite projection of four [d3.geoMercator](https://github.com/d3/d3-geo#geoMercator) projections: One for the main island, and one for each of Penghu, Kinmen, Lienchiang, and Wuqiu respectively.
 
+`mercatorTw.getCompositionBorders()` returns a svg path string of the borders, given the current scale and translation.
+
 This package exports the mercatorTw projection and can be used in your own projects.
 
 ```js

compBordersGeo.js

@@ -0,0 +1,43 @@
+// eslint-disable-next-line import/no-unresolved
+const mercatorTw = require('./mercatorTw.cjs.js');
+
+// Initialize Projection
+let merc = mercatorTw();
+
+// Read center from first argument or from defaultCenter
+const translate = process.argv[2] && JSON.parse(process.argv[2]);
+if (translate) merc = merc.translate(translate);
+
+// Read scale from second argument or from defaultScale
+const scale = process.argv[3] && parseInt(process.argv[3], 10);
+if (scale) merc = merc.scale(scale);
+
+// The properties that we will add to the box
+const properties = {
+  lienchiang: {
+    BORDERLEVEL: 'COUNTY', NAME: '連江縣', ID: 'Z', CODE: '09007', ENG: 'Lienchiang County',
+  },
+  penghu: {
+    BORDERLEVEL: 'COUNTY', NAME: '澎湖縣', ID: 'X', CODE: '10016', ENG: 'Penghu County',
+  },
+  kinmen: {
+    BORDERLEVEL: 'COUNTY', NAME: '金門縣', ID: 'W', CODE: '09020', ENG: 'Kinmen County',
+  },
+  wuqiu: {
+    BORDERLEVEL: 'TOWN', NAME: '烏坵鄉', ID: 'W06', CODE: '09020060', ENG: 'Wuqiu Township',
+  },
+};
+
+// Generate the features
+const features = merc.compositionBorderPoints()
+  .map((border) => ({
+    type: 'Feature',
+    geometry: { type: 'Polygon', coordinates: [border.coords] },
+    properties: properties[border.name],
+  }));
+
+// Print to stdout
+features.forEach((feature) => {
+  process.stdout.write(JSON.stringify(feature));
+  process.stdout.write('\n');
+});

generateimg.sh

@@ -1,13 +1,24 @@
 #!/bin/bash
 
-topo2geo villages=- < villages-mercator-10t.json | geo2svg -o img/villages.svg -w 450 -h 600
-svgexport img/villages.svg img/villages.png 2x "path {stroke-width: 0.2px;}"
+# Create the border json
+topo2geo compBorders=- < nation-mercator-10t.json > img/base-border.json
 
-topo2geo towns=- < towns-mercator-10t.json | geo2svg -o img/towns.svg -w 450 -h 600
+# Villages
+topo2geo villages=- < villages-mercator-10t.json > img/base-villages.json
+geojson-merge img/base-villages.json img/base-border.json | geo2svg -o img/villages.svg -w 450 -h 600
+svgexport img/villages.svg img/villages.png 2x "path {stroke-width: 0.3px;}"
+
+# Towns
+topo2geo towns=- < towns-mercator-10t.json > img/base-towns.json
+geojson-merge img/base-towns.json img/base-border.json | geo2svg -o img/towns.svg -w 450 -h 600
 svgexport img/towns.svg img/towns.png 2x "path {stroke-width: 0.5px;}"
 
-topo2geo counties=- < counties-mercator-10t.json | geo2svg -o img/counties.svg -w 450 -h 600
+# Counties
+topo2geo counties=- < counties-mercator-10t.json > img/base-counties.json
+geojson-merge img/base-counties.json img/base-border.json | geo2svg -o img/counties.svg -w 450 -h 600
 svgexport img/counties.svg img/counties.png 2x
 
-topo2geo nation=- < nation-mercator-10t.json | geo2svg -o img/nation.svg -w 450 -h 600
+# Nation
+topo2geo nation=- < nation-mercator-10t.json > img/base-nation.json
+geojson-merge img/base-nation.json img/base-border.json | geo2svg -o img/nation.svg -w 450 -h 600
 svgexport img/nation.svg img/nation.png 2x