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. iBATIS使用$和#的一些理解

    我们在使用iBATIS时会经常用到#这个符号. 比如: sql 代码 select * from member where id =#id# 然后,我们会在程序中给id这个变量传递一个值,iBATIS ...

  2. centos6.5 yum update 报错Couldn't resolve host 'centos.ustc.edu.cn'

    异常信息 [root@localhost ~]# yum -y update Loaded plugins: fastestmirror, refresh-packagekit, security S ...

  3. 《微软的软件测试之道》【PDF】下载

    <微软的软件测试之道>[PDF]下载链接: https://u253469.pipipan.com/fs/253469-230382291 内容简介 书的第三部分探讨某些我们工作中使用过的 ...

  4. if；脚本中退出语句：exit 数字，用$?查时为exit设置的数字，此数字为程序执行完后的返回数据，可以通过此方法自动设定

    if [ 条件 ];then 代码 fi if [ 条件 ] then 代码 fi [root@localhost ~]# df 文件系统 1K-块 已用 可用 已用% 挂载点 /dev/sda5 % ...

  5. Locust no-web 模式与参数详解

    读前参考:<性能测试工具Locust > 熟悉 Apache ab 工具的同学都知道,它是没有界面的,通过命令行执行. Locust 同样也提供的命令行运行,好处就是更节省客户端资源. 命 ...

  6. weex Mac开发环境

    安装: 1.java的jdk下载和安装 1-1.下载.安装:省略 1-2.配置 第一步:命令行内输入touch .bash_profile命令,生成.bash_profile的隐藏配置文件,用于配置j ...

  7. jmeter中一次运行多条sql语句

    操作比较简单,主要就分两步: 第一步:在JDBC Connection Configuration中设置,主要见下图标注部分增加:?allowMultiQueries=true 第二步:在JDBC R ...

  8. python爬虫爬取大众点评并导入redis

    直接上代码,导入redis的中文编码没有解决,日后解决了会第一时间上代码!新手上路,多多包涵! # -*- coding: utf-8 -*- import re import requests fr ...

  9. 保存html上传文件过程中遇到的字节流和字符流问题总结

    java字节流和字符流的区别以及相同 1. 字节流文件本身进行操作,字符流是通过缓存进行操作, 1.1 使用字节流不执行关闭操作 File f =new File("d:/test/test ...

  10. gitlab勾住rocket chat

    出于协作的要求, 需要在把gitlab的push event勾到rocket chat上面, 通知协作的其他人. BUT rocket chat提供的脚本没有具体的文件diff, so, 只好修改一下 ...