Taiwan town map
npm i -g topojson
| var topLeftX = proj(mapDim.topLine[0])[0]; | |
| var topLeftY = proj(mapDim.topLine[0])[1]; | |
| var topRightX = proj(mapDim.topLine[mapDim.topLine.length - 1])[0]; | |
| var bottomLeftY = proj(mapDim.bottomLine[mapDim.topLine.length - 1])[1]; | |
| var extentWidth = topRightX - topLeftX; | |
| var extentHeight = bottomLeftY - topLeftY; | |
| this.extentWidth = extentWidth; | |
| this.extentHeight = extentHeight; |
| // seperate data to polygon, line, point and sent to different groups | |
| if(data.type === 'FeatureCollection') { | |
| var polygonData = [], | |
| lineData = [], | |
| pointData = []; | |
| // loop through features | |
| data.features.forEach(function(d) { | |
| d.properties.react_d3_map__id = Math.floor(Math.random() * 100000) | |
| if(d.geometry.type === 'Polygon' || d.geometry.type === 'MultiPolygon') { |
| var w = 800, | |
| h = 600; | |
| var projection = d3.geo.mercator() | |
| .center([120.979531, 23.978567]) | |
| .scale(10000); | |
| var color = d3.scale.quantize() | |
| .domain([0, 1]) | |
| .range(d3.range(11).map(function(d) { return "q" + d + "-11"; })); |
| [{ | |
| "num": "(01a)", | |
| "type": "買賣", | |
| "cost": 4180000, | |
| "unit_cost": 117000, | |
| "space": 35, | |
| "house_type": "公寓", | |
| "house": "房地", | |
| "house_year": 27, | |
| "house_spec": "三樓 / 4 樓", |
| { | |
| "layout": "layout.hbs", | |
| "filename": "filename.html", | |
| "data": { | |
| "toc": "<md string>", | |
| "content": [ | |
| { | |
| "title": "why", | |
| "content": "<md string>", | |
| "stage": 1 |