
D3
文章平均质量分 95
前端夜谈
腾讯前端开发工程师
微信公众号: 前端夜谈
每晚聊聊前端,生活。
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
Github Visualization / Github 数据可视化
Github Visualization / Github 数据可视化效果: 一个简单的Github数据展示网页, 目前功能有:Tech: 使用到的技术:Purpose:Github Visualization / Github 数据可视化效果: 一个简单的Github数据展示网页, 目前功能有:输入github username, 展示所有reposit...原创 2018-05-12 09:14:52 · 2215 阅读 · 0 评论 -
可视化讲解 深度优先遍历(DFT)
可视化讲解 深度优先遍历(DFT)深度优先遍历, 刷过题的朋友应该都很熟悉了,难是不难,但是理解起来还是要费一些功夫的. 深度优先遍历的实现方法有递归和非递归两种, 这里我们用可视化的角度,讲解前一种: 递归的深度优先遍历.为什么要以可视化的方式来讲解呢? 因为人是视觉的动物, 如果和你说 二叉树 或 栈 , 相信大家脑中出现的都是下面的图形:而不是下面的代码:// b...原创 2018-09-16 12:07:45 · 498 阅读 · 0 评论 -
用 D3.js 画一个手机专利关系图, 看看苹果,三星,微软间的专利纠葛
用 D3.js 画一个手机专利关系图, 看看苹果,三星,微软间的专利纠葛前言本文灵感来源于Mike Bostock 的一个 demo 页面原 demo 基于 D3.js v3 开发, 笔者将其使用 D3.js v5 进行重写, 并改为使用 ES6 语法.源码: github在线演示 : demo效果可以看到, 上图左上角为图例, 中间为各个手机公司之间的专利...原创 2018-07-16 10:04:50 · 1805 阅读 · 0 评论 -
可视化讲解 DOM 构建过程
可视化讲解 DOM 构建过程前言最近在看 Secrets of the JavaScript Ninja, 书中第二章讲到 DOM 的构建流程.记得我之前也为理解 DOM 构建流程查阅过数次资料, 虽然每次查阅完都觉得 DOM 构建流程很简单, 看完便懂, 但是懂了又忘还是让人有些头疼.为了给自己加深印象, 也为了为大家提供一个可视化的理解 DOM 构建过程的方式, 笔者制作了...原创 2018-07-10 12:09:20 · 1134 阅读 · 1 评论 -
[译] D3.js 之 d3-shap 简介
[译] D3.js 之 d3-shap 简介译者注 原文: 来自 D3.js 作者 Mike Bostock 的 Introducing d3-shape 译者: ssthouse 联系译者: 邮箱(ssthouse@163.com) & 微信(wssst123456789)译文假设你现在想创建一个用于学习特定数据集的工具, 你最容易想到的呈现...翻译 2018-07-02 17:50:24 · 1261 阅读 · 0 评论 -
[译] D3.js 嵌套选择集 (Nested Selection)
译者注: 原文: Mike Bostock (D3.js 作者) – Nested Selections 译者: ssthouse本文讲解的是关于 D3.js 中 d3-selection 的使用. d3-selection 是 d3 的核心所在, 它提供了一种和以往 Dom 操作 和 数据操作 完全不同的思路, 让我们能非常优雅的进行数据可视化工作. 本文是 d3 作者...翻译 2018-06-26 18:44:38 · 524 阅读 · 0 评论 -
[译]D3.js 之 d3-selection 原理
[译]D3.js 之 d3-selection 原理译者注 原文: 来自 D3.js 作者 Mike Bostock 的How Selections Works 译者: ssthouse译文在前一篇文章中, 我介绍了关于 D3 selection 的基础, 这些基础足以让你开始使用 D3 selection.在这篇文章中, 我将介绍 d3-selecti...翻译 2018-06-29 11:04:34 · 1966 阅读 · 0 评论 -
D3.js + Canvas 绘制组织结构图
D3.js…# D3.js + Canvas 绘制组织结构图使用 D3.js 默认的 svg 渲染D3默认的树状图画图使用的是svg, 比如这个来自D3作者的例子:https://bl.ocks.org/mbostock/4339083使用svg有好有坏: - 好处是方便操作dom元素, 添加用户交互 - 坏处是渲染效率不高, 在数据量较大时页面易掉帧, 卡顿在大多数数...原创 2018-06-01 15:37:18 · 6944 阅读 · 0 评论 -
以 Join 的方式来思考D3.js
以 Join 的方式来思考D3.js声明原文链接: 来自 D3作者 Mike Bostock https://bost.ocks.org/mike/join/译文地址: github repository如果觉得还不错, 不妨去github给个star ?Content打个比方, 你想用D3画一个 散点图 , 用每一个svg的circle元素来可视化你的数据. 你会...翻译 2018-06-13 12:57:33 · 800 阅读 · 0 评论 -
D3.js学习之路
D3.js 简介 原文: https://medium.com/@enjalot/the-hitchhikers-guide-to-d3-js-a8552174733a 译文源代码地址: https://github.com/ssthouse/d3-blog/blob/master/d3-guide/d3_roadmap_cn.md如果这篇文章对你有帮助的话, 不妨点个赞 ...翻译 2018-06-12 12:44:44 · 806 阅读 · 0 评论 -
Github Repository 可视化 (D3.js & Three.js)
Github Repository 可视化 (D3.js & Three.js)先上 Demo 链接 & 效果图demo 链接github 链接效果图 2D:效果图 3D:为什么要做这样一个网站?最初想法是因为 github 提供的页面无法一次看到用户的所有 repository, 也无法直观的看到每个 repository 的量级对比(如 commit 数, s...原创 2018-10-17 18:42:52 · 2502 阅读 · 0 评论