d3，v4以前用d3画地图的时候，为了让地图差不多正好画在容器的上下左右正中间，不得不慢慢的这样调：

const projection = d3.geoMercator()

      .center([108.3340400357, 22.8212837740])

      .scale(4900)

      .translate([400, 330]);

center还好搞，搜一下经纬度就搞定

scale和translate要配合起来一起搞基，搞过的都知道，没搞过的就去试试

从V4版本开始，终极杀手锏来了：

const projection = d3.geoMercator().fitSize([width, height], geoJSON);

　　就是这样简单到叫你目瞪口呆，连经纬度也不要了。骚年，快去试试吧！！！

d3 画地图终极自适应大小方案的更多相关文章

  1. Android自定义控件：自适应大小的文本控件

    需求 自适应大小的文本: 效果图: 项目开发中,开发人员根据UI人员提供的一套尺寸,布局了一些带文本的页面, 往往会少考虑一些数据极限的问题,造成机型屏幕适配问题. 例如: 文本(或数值)长度可变,如 ...

  2. 使用R画地图数据

    用R画地图数据 首先,从这里下载中国地图的GIS数据,这是一个压缩包,完全解压后包含三个文件(bou2_4p.dbf.bou2_4p.shp和bou2_4p.shx),将这三个文件解压到同一个目录下. ...

  3. Qt自适应大小显示图片，添加菜单

    由于后面的图像处理需要UI,OpenCV自带也不怎么会,MFC实在懒得学的.听同学说Qt不错,就用Qt做UI了. 本文主要介绍三个内容:在Qt Creator中使用OpenCV2.Qt中自适应显示图片 ...

  4. iOS HTML 字符串中的图片 自适应大小

    本文原文地址:http://www.cnblogs.com/qianLL/p/6095988.html 有时候 我们接收数据的时候  后台给的数据室一串HTML 的字符串  但是 我们要显示出来  这 ...

  5. Android项目实战（五）：TextView自适应大小

    对于设置TextView的字体默认大小对于UI界面的好看程度是很重要的,小屏幕设置的文字过大或者大屏幕设置的文字过小都造成UI的不美观 现在就让我们学习自适应大小的TextView控件,即当文字长度变 ...

  6. css控制图片自适应大小

    相信大家做网页时经常会碰到大分辨率的图片会把表格涨破以致漂亮的网页面目全非,但只要使用以下的CSS语句即可解决.      该CSS的功能是:大于600的图片自动调整为600显示. <style ...

  7. iOS：定制自适应大小的透明吐司弹框

    一.简单介绍 创建一个吐司消息的黑色透明弹框,可以根据消息长短自适应大小. 可以手动创建手动显示手动关闭,也可以手动创建自动显示自动关闭. 简单好用. 二.代码使用 .h文件 // // LiveHU ...

  8. 【QT】QPixmap在Label中自适应大小铺满

    KeepAspectRatio:设置pixmap缩放的尺寸保持宽高比. setScaledContents:设置label的属性scaledContents,这个属性的作用是允许(禁止)label缩放 ...

  9. Echarts 设置地图上文字大小及颜色

    Echarts 设置地图上文字大小及颜色,效果如下: 上代码:关键代码用红色 series: [ { //name: '香港18区人口密度', type: 'map', mapType: 'jiang ...

随机推荐

  1. ATM程序设计

    package com.arthur.object; import java.util.Scanner; /*** * 简单的ATM存取款程序 1.登陆页面 2.登陆 3.菜单:1,查询,2,存款,3 ...

  2. Python笔记·第十一章—— 函数 （二） 装饰器

    一 为何要用装饰器 有的时候写完一段代码,过段时间需要对它进行升级.添加一些新功能,但是如果要直接修改原来的代码会影响其他人的调用,所以就需要一个不修改源代码且不修改原函数的调用方式的东西又能为原函数 ...

  3. 如何在阿里云linux上部署java项目

      前2天把git练了下,敲了很多命令,也借助图形界面增强自己的理解,乘着余热把linux在熟悉下.然后想起以前婷主有让我帮忙搭建的阿里云服务器,所以就想自己试着在阿里云的linux上搭建自己的jav ...

  4. CP342-5做主站的profibus-dp组态应用

    1.CP342-5介绍 2.系统结构图 3.组态DP主站 4.组态DP从站 1)插入DP V0 slaves下的ET200M 2)设置属性 3)添加ET200M的其他模块 4)保存和编译 4.DP通信 ...

  5. ArcGIS API for JavaScript 4.2学习笔记[21] 对3D场景上的3D要素进行点击查询【Query类学习】

    有人问我怎么这个系列没有写自己做的东西呢? 大哥大姐,这是"学习笔记"啊!当然主要以解读和笔记为主咯. 也有人找我要实例代码(不是示例),我表示AJS尚未成熟,现在数据编辑功能才简 ...

  6. bzoj 3996: [TJOI2015]线性代数

    Description 给出一个N*N的矩阵B和一个1*N的矩阵C.求出一个1*N的01矩阵A.使得 D=(A*B-C)*A^T最大.其中A^T为A的转置.输出D Input 第一行输入一个整数N,接 ...

  7. Linux第七节随笔-中 /date / ln /

    4.date link 作用:显示或设定系统的日期与时间 参数: -d<字符串> 显示字符串所指的日期与时间.字符串前后必须加上双引号. -s<字符串> 根据字符串来设置日期与 ...

  8. HTML基本功之文档结构

    项目名 首页 命名为 index.html 样式文件夹 命名为 css  /*用来放样式文件*/ base.css  /*基本样式*/ index.css /*首页样式*/ global.css /* ...

  9. github emoji 表情列表

    最新emoji大全:emoji列表 emoji-list emoji表情列表 目录 人物 自然 事物 地点 符号 人物 :bowtie: :bowtie:

  10. js、jQuery、layer实现弹出层的打开、关闭

    打开layer layer.open({ type: 2, title: '新增收货地址', shadeClose: true,//点击阴影关闭 shade: 0.8, area: ['900px', ...