第十一章 D3地理

d3绘制地图思路

绘制思路:

  1. 首先 定义地图的投影和地理路径生成器:
  2. 获取Json文件,
  3. 拿到geojson.features添加path标签,调用地理路径生成器绘制
//定义地图的投影
var projection = d3.geoAlbers(),
//地理路径生成器
    path = d3.geoPath(projection);
svg.selectAll('path')
    .data(data.features)
    .enter()
    .append('path')
    .attr('d',path)  // 调用地理路径生成器绘制

TopoJSON对GeoJSON的扩展,

  • 优点:文件小(geo:topo=5:1)
  • 缺点:需要用插件转换回geojson
    使用TopoJson时需要将则需要使用topojson.js转换
var georoot = topojson.feature(toporoot,toporoot.objects.china); 

d3投影方式类

方法:
invert() 根据坐标点返回经纬度
clipAngle() 设置或获取投影的裁剪大圆的角度
clipExtent() 设置或获取投影的视口裁剪范围
scale() 设置或获取投影的缩放因子
center()
rotate() (控制三维的旋转)
fitExtent()
fitSize()


第十一章 D3地理_第1张图片
裁剪角度的意义

方位角投影(直接将球体投影到平面上)

等面积投影:

  • d3.geoAzimuthalEqualArea()
  • d3.geoAzimuthalEqualAreaRaw()

等距投影:

  • d3.geoAzimuthalEquidistant()
  • d3.geoAzimuthalEquidistantRaw()

球心投影:

  • d3.geoGnomonic()
  • d3.geoGnomonicRaw()

正交投影:

  • d3.geoOrthographic()
  • d3.geoOrthographicRaw()

球面投影:

  • d3.geoStereographic()
  • d3.geoStereographicRaw()

复合投影

  • d3.geoAlbersUsa()

圆锥投影将球面覆盖到一个圆锥上,然后在展开到平面上

阿尔伯斯投影

  • d3.geoAlbers()

兰伯特正形圆锥投影(双标准纬线默认为[30°, 30°])

  • d3.geoConicConformal()

双标准纬线等积圆锥投影

  • d3.geoConicEqualArea()
  • d3.geoConicEqualAreaRaw()

双标准纬线等距圆锥投影

  • d3.geoConicEquidistant()
  • d3.geoConicEquidistantRaw()

圆柱投影

普通圆柱投影:

  • d3.geoEquirectangular()
  • d3.geoEquirectangularRaw()

默认[projection.clipExtent]为±85°经度的墨卡托投影

  • d3.geoMercator()
    横向墨卡托投影。
    d3.geoTransverseMercator()
    d3.geoTransverseMercatorRaw()

d3路径生成类

d3.geoPath()

  • projection() 设置投影方式
  • context() 设置canvas上下文
  • area() 计算投影面积
  • bounds() 计算几何边界框
  • centroid() 计算几何中心点,(加载标签)
  • pointRadius() 设置点的半径 适用于Point MultiPoint

经纬线

d3.geoCircle() 创建一个圆生成器
.center()
.radius()
.precision()
d3.geoGraticule() 创建一个经纬度网格生成器: 默认的网格在±80°之间每隔10度有一个维度线。
.lines() 经线和纬线的GeoJSON LineString几何对象
.outline() 返回一个GeoJSON Polygon几何对象表示轮廓
.extent() 设置或获取球面网格的范围,等于同时设置major和minor
.extentMajor()
.extentMinor()
.step() 设置或获取步长,等于同时设置major 和 minor的步长,默认为⟨10°, 10°⟩.
precision() 设置或获取网格线的经度,默认为2.5°.

球面数学

d3.geoArea(feature) 返回指定的GeoJSON特征代表的球面的面积
d3.geoBounds(feature) 返回指定GeoJSON特征的包围框
d3.geoCentroid(feature) 返回指定GeoJSON特征几何中心
d3.geoDistance(a, b) 返回a到b之间的弧度距离
d3.geoLength(feature) 返回指定GeoJSON的弧长(对于多边形则返回周长)
d3.geoInterpolate(a, b) 返回一个介于a和b之间的插值器
d3.geoRotation(angles)根据指定的角度返回一个旋转函数

d3.geoTransform(methods)
d3.geoIdentity() 恒等转化可以被来缩放,平移和平面的裁剪
.reflectX([reflect])设置或获取x方向的反射 reflect
.reflectY([reflect])设置或获取x方向的反射 reflect

你可能感兴趣的:(第十一章 D3地理)