d3 & hexagon

https://bl.ocks.org/mbostock/5249328

https://bl.ocks.org/vasturiano/e70e14483fe01eb0a3ea7d1d46a30571

https://jsoma.github.io/hexagon-grids-for-adobe-illustrator/

d3 & hexagon的更多相关文章

  1. d3可视化实战03：神奇的superformula

    需求驱动实现 前文讲过了D3的数据驱动机制,中间所举的例子都很简单.例如那个demo里面,绑定的数据是一个简单的数组,实现的图元也仅仅是一堆用SVG画的circle.但是现实世界中我们往往会遇到复杂的 ...

  2. d3.js制作蜂巢图表带动画效果

    以上是效果图,本图表使用d3.js v4制作.图表主要功能是在六边形格子中显示数据,点击底部图标可以切换指定格子高亮显示,图表可以随浏览器任意缩放. 1.图表的主体结构是由正六边形组成,使用d3生成六 ...

  3. D3.js学习（七）

    上一节中我们学会了如何旋转x轴标签以及自定义标签内容,在这一节中,我们将接触动画(transition) 首先,我们要在页面上添加一个按钮,当我们点击这个按钮时,调用我们的动画.所以,我们还需要在原来 ...

  4. D3.js学习（六）

    上节我们学习了如何绘制多条曲线, 以及给不同的曲线指定不同的坐标系.在这节当中,我们会对坐标轴标签相关的处理进行学习.首先,我们来想一个问题, 如何我们的x轴上的各个标签的距离比较近,但是标签名又比较 ...

  5. D3.js学习（五）

    上一节我们已经学习了如何设置填充区域,其实理解了他的实现原理还是非常简单了.这一节中, 我们主要学习多条曲线的绘制,以及给不同的曲线指定不同的纵坐标. 新的数据 由于我们要画两条曲线,所以我们要在原来 ...

  6. D3.js学习（四）

    上一节我们已经学习了线条样式和格栅的绘制,在这一节中我们将要根据之前绘制的线条对图表进行填充,首先来看一下我们的目标吧 在这个图表中,我们对位于线条下面的空间进行了填充,那么,如何改做到呢? 设置填充 ...

  7. D3.js学习（三）

    上一节中,我们已经画出了图表,并且给图表添加了坐标轴的标签和标题,在这一节中,我们将要学习几个绘制线条不同特性的几个函数,以及给图表添加格栅.ok,进入话题! 如何给线条设置绘制的样式? 这个其实非常 ...

  8. D3.js学习（一）

    从今天开始我将和大家一起学习D3.js(Data-Driven Documents),由于国内关于D3的学习资料少之又少,所以我觉得很有必要把自己学习过程记录下来,供同学们参考,如果文章有有哪些表达有 ...

  9. svg + d3

    为了实现元素的添加,删除,拖拽,左键点击,右键单击,悬浮等功能,使用了d3 + svg 的技术来实现界面. 最开始是采用canvas,但是由于功能原因放弃了该技术,可以看下 canvas简介 另附:c ...

随机推荐

  1. libevent之基于socket的bufferevent

    基于socket的bufferevent由一个socket的传输层和read/write buffer组成.区别于常规的event,当socket可读或者可写时会回调用户的callback,buffe ...

  2. 理解和运用 ClassLoader 该篇文章就够了

    定义 根据<深入理解Java虚拟机>提到"通过一个类的全限定名(packageName.ClassName)来获取描述此类的二进制字节(class文件字节)这个动作的代码模块就叫 ...

  3. 十六：SpringBoot-自定义启动页,项目打包和指定运行环境

    SpringBoot-自定义启动页,项目打包和指定运行环境 1.自定义启动页 2.打包配置 2.1 打包pom配置 2.2 多环境配置 3.环境测试接口 4.打包执行 4.1 指定模块打包 4.2 运 ...

  4. MySql（二）索引的设计与使用

    MySql(二)索引的设计与使用 一.索引概述 二.设计索引的原则 三.BTREE索引与HASH索引 一.索引概述 所有Mysql列类型都可以被索引,对相关列使用索引时提高select操作性能的最佳途 ...

  5. Python Package(转)

    http://www.cnpythoner.com/post/2.html python中的Module是比较重要的概念.常见的情况是,事先写好一个.py文 件,在另一个文件中需要import时,将事 ...

  6. 使用V8和node轻松profile分析nodejs应用程序

    目录 简介 使用V8的内置profiler工具 使用gm来build V8 手动build V8 生成profile文件 分析生成的文件 生成时间线图 使用nodejs的profile工具 简介 我们 ...

  7. js实现encodeHTML和decodeHTML

    HTML编解码说明/在线HTML编解码 encodeHTMl const encodeHTML = (html: string): string => { const div = documen ...

  8. PowerShell随笔5---添加.NET类型

    有些情况下,有些脚本命令不能满足我们的需求,而手头却能用C#很方便的实现. 我们就可以把自定义的类型Add到PowerShell中使用,使用方法和PowerShell调用.NET类库方法是一样的. 以 ...

  9. 基于CentOS-7的redis下载和安装

    1.下载和安装 在我安装的虚拟机中,我把所有自己安装的软件都放在了/ph/install 目录下,具体以自己实际情况为准. [root@localhost ~]$ cd /ph/install #进入 ...

  10. 【ybt金牌导航1-2-4】免费馅饼

    免费馅饼 题目链接:ybt金牌导航1-2-4 题目大意 有一个直线,在某一个时刻有一个馅饼会出现在一些位置,有它的价值. 一个人一开始可以站在直线的任意地方,然后他每个时刻可以不移动,或向任意一边移动 ...