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. java-生成任意格式的json数据

    最近研究java的东西.之前靠着自己的摸索,实现了把java对象转成json格式的数据的功能,返回给前端.当时使用的是 JSONObject.fromObject(object) 方法把java对象换 ...

  2. docker容器自动退出的问题

    如果用了一段时间的docker就会发现,我们的容器经常用了一段时间就自动退出了,docker ps已经找不到了,在docker ps -a里面了,然后我们docker start containerI ...

  3. 3. python文件操作

            5 打开文件的模式有: r,只读模式(默认). w,只写模式.[不可读:不存在则创建:存在则删除内容:] a,追加模式.[可读:   不存在则创建:存在则只追加内容:]        ...

  4. JavaScript定时器：setTimeout()和setInterval()

    1 超时调用setTimeout() 顾名思义,超时调用的意思就是在一段实际之后调用(在执行代码之前要等待多少毫秒) setTimeout()他可以接收两个参数: 1 要执行的代码或函数 2 毫秒(在 ...

  5. Swift3.0 UITextField

    import UIKit private var textfieldd = UITextField() class TextFieldViewController: UIViewController, ...

  6. （转载）Eclipse将引用了第三方jar包的Java项目打包成可执行jar的两种方法

    转载自:http://www.cnblogs.com/lanxuezaipiao/p/3291641.html 方案一:用Eclipse自带的Export功能 步骤1:准备主清单文件 "MA ...

  7. [知了堂学习笔记]_用JS制作《飞机大作战》游戏_第3讲（玩家发射子弹）

    一.公布上一讲中玩家飞机上.下.右移动实现的代码: /*=========================键盘按下事件 keycode为得到键盘相应键对应的数字==================== ...

  8. asp.net core 2.0+sqlsugar搭建个人网站系列（0）

    一些废话 马上就要过年了,回顾这一年最大的收获就是技术有了很大的提升,其他的方面没有什么改变,现在还是单身小屌丝一枚. 这一年来学习的主要重点就是asp.net core,中间也使用 core+EF做 ...

  9. java 异常处理与返回

    try{ // 1. return ++x; }catch(){ }finally{ //2. x++; } 实际返回值还是 ++x后的结果,因为 ++x 后 x 的值会入栈,作为返回结果: 以上代码 ...

  10. WINDOWS下运行ORACLE SQLPLUS时报错的一次记录

    环境变量配置无误后,在sys用户 在pl/sql上登录时候报以下错误 ORA-01034: ORACLE not available进程 ID: 0会话 ID: 0 序列号: 0 然后运行控制台,有以 ...