地图需要的参数 展示的宽 高 geojson文件数据
json数据可以通过 阿里地图数据 下载

const width = 1920;
const height = 1080;
const geoJson = {};
const dom = d3.select('#app');
// 投影模式 以及投影的宽高 数据 偏移
const projection = d3.geoEquirectangular()
    .fitExtent([
        [0, 0],
        [width, height]
    ], geoJson)
    .translate([width / 2, height / 2]);
// geo path
const path = d3.geoPath().projection(projection);
const features = geoJson.features;
// 颜色
const color = d3.scaleLinear()
    .domain([0, features.length])
    .range(["brown", "steelblue"]);
const svg = dom.append('svg').attr('width', width).attr('height', height);
const main = svg.append('g');
// 生成path
main.selectAll('path')
    .data(features)
    .enter()
    .append('path')
    .attr('d', path)
    .attr('fill', (d, i) => {
        return color(i);
    .attr('stroke', 'rgba(255, 255, 255, 1')
    .attr('stroke-width', 1)
    .on('click', (d, i) => {
        // 绑定点击事件
        console.log(d)
                                    geojson2svg
 给定svg视口大小并映射范围,将geojson换为svg字符串。 geojson2svg可以用于客户端(在浏览器中)或服务器端(与NodeJs一起使用)。
 检查, 比例尺和示例,以证明将geojson换为地图非常容易。
在node.js中使用或与browserify一起使用
npm install geojson2svg
要以html页面标准方式包括在内,请下载文件dist / geojson2svg.min.js
 < script type =" text/javascript " src =" path/to/geojson2svg.min.js " > </ script >
 这将创建一个全局变量'geojson2svg'
 geojson2svg也可以在上并且可以像下面这样包含:
 < script type =" text/javascr
cat example.geo.json | npx geojson-to-svg-cli > example.svg
 或全局安装并运行它: 
npm install -g geojson-to-svg-cli
cat example.geo.json | geojson-to-svg-cli > example.svg
 Usage:
    geojson-to-svg [-p mercator]
Options:
    --projection  -p  Which projection to use. Default: mercator
                      Refer to npmjs.com/projections for a l
                                    1.必要性
1.地图资源一般是只有省、市、县级别的 geojson 文件,而我们可能需要更细粒度的地图来展示(如:街道、社区)
2.数据来源不统一(全国、省使用的是百度的加密地图;市、县使用的是高德地图),就有可能在地图合并时,边界不重合,所以在必要时也需要对已有地图进行微调。
2.资源准备
1.http://geojson.io 可以预览及简单编辑  geojson 文件的网站
2.https://www.npmjs.com/package/svg2geojsonsvg斜体样式 换成 geojs
首先需要站在巨人的肩膀上,下载几个依赖。
svg2genjson 依靠这个可以将svg为可使用的genjson。尽量用 yarn 来安装依赖,npm 会有问题(你的node.js版本在11以下或者gulp版本>4就没问题)
可以在package.json中加这个代码解决
  // 锁定版本
"resolutions": {
    "graceful-fs": "4.2.2"..
                                    #SVG到JSON一种将SVG字符串换为JSON数据并可选地呈现统计信息的方法。
 #Usage创建新实例,提供svg字符串,还可以选择传入options 。 
 var svg_json = new SVGToJSON ( svg [ , options ] ) ;
 #API ## Object.json SVGToJSON()返回一个对象。 OBJ.json是主要的JSON数据。 它是所有SVG标签的数组。 
 var svg_json = new SVGToJSON ( svg ) ;
svg_json = {
  json : [ ... ] 
 ## Object.json [I]中的每个标签Object.json有四个值。 
 var first_tag = svg_json . json [ 0 ] ;
first_tag = {
  attrs : {
const { parse , stringify } = require ( 'svgson' )
// ----------------------------
// Convert SVG to JSON AST
// ----------------------------
parse ( `
    <line xss=removed xss=removed xss=removed xss=removed xss=removed xss=removed xss=removed>
    </line