郑州做网站的大公司有哪些/百度手机助手下载安装最新版
译者注
上一节我们探讨了 D3.js 的适用场景——需要高度定制化、可以尽情释放想象力的复杂图表。这一节我们再跟随作者的视角,看看 D3.js 的工作原理究竟是怎样的。
1.1.3 D3.js 的工作原理
您可能已经体验过 D3 并且发现它不太容易上手。这也许是因为您把它当成了一款普通的绘图工具库。以本书第 2 章和第 3 章即将重点介绍的柱状图为例,D3 并没有提供现成的单一函数来创建柱状图;相反,它提供了一个用于将 <svg>
容器追加到 DOM(Document Object Model,即文档对象模型)中的函数,以及一组专为每个数据点添加一个 <rect>
元素的函数。然后利用提供的比例尺工具,计算出构成柱状图的各矩形的长度并将其赋给对应的 height
属性。最后再调用另一组函数,将 x 轴和 y 轴添加到柱状图中。
正如图 1.6 所示,整个绘制过程比专用的图表工具库(如 Highcharts)要复杂得多;但把数据和图形放到明面上来处理也恰好是 D3 的优势所在。尽管其他图表库可以很方便地快速绘制线形图和饼图,可一旦想要的可视化效果超出了传统图表的能力边界,或者需要定制开发一些交互逻辑的时候,依靠这些工具库就有些捉襟见肘了。而此时的 D3 则会一枝独秀——它能构建出任何您可以想象出的、基于数据驱动的图形和交互效果来。
图 1.6 使用 Highcharts 和 D3.js 生成柱状图的代码量对比。前者更简短,而 D3.js 更加灵活
如图 1.7 所示,这是一张关于如何利用 D3 实现数据可视化效果的通用版思维导图。先是从数据集入手(通常是一个 CSV 或 JSON 格式的数据文件),并利用 d3-fetch
模块将该数据集加载到项目中。通常需要对数据做一些格式化处理,例如数值和日期格式的校验与统一。此外,可能还会考察该数据集的主要统计学特征,例如提前了解其最大值、最小值以备后用。紧接着就是结合本书即将介绍的各类 D3 函数,开始构建想要的可视化效果。最后,通过监听鼠标事件来添加用户交互逻辑,例如让用户自行筛选数据或放大图表。
图 1.7 如何使用 D3.js 进行数据可视化
Elijah Meeks 访谈记录
Elijah Meeks 是 Noteable 公司的联合创始人兼首席创新官(Chief Innovation Officer,即 CIO),同时也是《D3.js 实战》第一版的作者。
问:您能告诉我们一些您的背景信息,聊聊您是怎样进入数据可视化领域的吗?
Elijah Meeks:我曾先后在苹果公司、奈飞(Netflix)公司、数据可视化协会(Data Visualization Society)、斯坦福大学以及合伙创办的 Noteable 公司中从事了近 15 年的数据可视化工作。我以一种不太传统的方式进入的数据可视化领域——起初是通过地理信息系统(Geographic Information System,即 GIS)来支撑我在中国早期国家形成方面的博士课题研究。之后才开始接触网络可视化相关的问题,最终才画起了柱状图和折线图。
问:您是如何发现 D3 的,是什么激励您进一步学习这个工具库?
Elijah Meeks:在我职业生涯的早期阶段,我利用
Flash
和ActionScript3
创建了一些交互式的数据可视化应用。当Flash
逐渐式微,我便开始探索Protovis
作为替代方案,不过它很快就被 D3 取代了。我越深入了解 D3,就越深刻理解数据可视化。更重要的是,借助 D3 来实现数据可视化可以帮助我更好地学习数据结构、数据分析和机器学习方面的知识。问:在 D3 相关资源还不多的时候,您就成功编写了前两版的《D3.js in Action》实战类书籍。这个项目是如何诞生的?
Elijah Meeks:我永远感谢 Manning 出版社给予我编写这些书籍的机会。相对于仅仅将 D3 用于项目实践而言,这项工作迫使我更全面、更深入地去理解D3。撰写 D3 相关的教学内容让我在使用和规划书籍内容方面更加得心应手。第一版内容包括如何利用 D3 来创建 HTML 的示例,几乎是将 D3 视为某种意义上的 MVC(Model-View-Controller)来进行演示的;此外也包括在手机或平板电脑上自定义触摸事件(touch events),以及定制开发自己的布局、生成工具和组件。第二版中删除了部分内容,转而增加了更多实用的知识,例如怎样将 D3 集成到 React 框架等等。
问:在过去十年里,您在数据可视化领域发挥了关键作用。从 Netflix 排名第一的数据可视化工程师、到成为 Noteable 公司的首席创新官,在此期间,您见证了这个行业所经历的重大变革。您是如何看待数据可视化经历的这些演变?未来的数据可视化又将何去何从?
Elijah Meeks:我坚信任何文化都有其特定的时代烙印,数据可视化的相关实践也不例外。我们从计算机最初提供的简单图表的配置选项开始(例如 Excel 图表),利用它们来实现表格数据的可视化;等到 D3 出现以后,社区的主要精力更多集中在探索图形相关的语法,以及如何通过代码来实现日益复杂的动态图表。如今我们已经到达一个新的阶段,在这个特定阶段中,各行各业都能看到大量的数据可视化案例(无论是商业智能、新闻报刊业、抑或是数据科学,比比皆是);对于这些可视化作品的期望,各领域早年间看起来非常明显的界限也在慢慢消融,并逐渐趋于一致——不再专注于新奇的图表,而是聚焦更多具有整合意义的可视化解决方案,让拥有不同技能与期望的不同角色,共同参与到同一个基于数据驱动的可视化产品研发中来。
相关文章:

【D3.js in Action 3 精译】1.1.3 D3.js 的工作原理
译者注 上一节我们探讨了 D3.js 的适用场景——需要高度定制化、可以尽情释放想象力的复杂图表。这一节我们再跟随作者的视角,看看 D3.js 的工作原理究竟是怎样的。 1.1.3 D3.js 的工作原理 您可能已经体验过 D3 并且发现它不太容易上手。这也许是因为您把它当成了…...

面试-java多线程与并发
1.如何实现处理线程的返回值 (1)主线程等待法 主线程等待法:程序执行时,没有等到value值赋予完成,就直接在主函数 中执行打印value的值。 缺点:需要自己去实现循环等待的逻辑。若需要等待的变量变多,需要等待的时间可能…...

前端学习-day10
文章目录 01-体验平面转换02-平移效果03-绝对定位元素居中04-案例-双开门06-转换旋转中心点07-案例-时钟-转换原点08-平面转换-多重转换09-缩放效果10-案例-按钮缩放11-倾斜效果12-渐变-线性13-案例-产品展示14-渐变-径向15-综合案例-喜马拉雅 01-体验平面转换 <!DOCTYPE h…...

深入理解桥接模式(Bridge Pattern)及其实际应用
引言 在软件开发过程中,设计模式为我们提供了优雅且高效的解决方案,以应对常见的设计问题。桥接模式(Bridge Pattern)作为一种结构型设计模式,旨在将抽象部分与其实现部分分离,使它们可以独立变化…...

Springboot + Mybatis 实现sql打印
参照这个视频:https://www.bilibili.com/video/BV1MS411N7mn/?vd_source90ebeef3261cec486646b6583e9f45f5 实现mybatis对外暴露的接口Interceptor 使用Intercepts接口,这里的写法参照mybatis-plus中的拦截器写法 Intercepts({Signature(type Executor.class, m…...

Cesium默认bing地图数据,还支持哪些地图的数据源呢?
传统的前端开发增长乏力了,新兴的web3D方向前端开发需求旺盛,这一块在国外很成熟,在国内兴起不久, 甚至很多前端老铁都没听过,没见过,没有意识到,前端除了框架、vue、uniapp这些烂大街的&#x…...

高效、智能、安全:小型机房EasyCVR+AI视频综合监控解决方案
一、背景需求分析 随着信息技术的迅猛发展,小型机房在企事业单位中扮演着越来越重要的角色。为了确保机房的安全稳定运行,远程监控成为了必不可少的手段。 二、视频监控 视频监控是机房远程监控的重要组成部分。通过安装IP摄像机及部署视频监控系统Ea…...

数据分析的Excel基础操作
数据透视表 1.先备份,创建原数据副本,将副本sheet隐藏掉。 2.看数据的量级,总行和总列。 3.浏览数据的字段和数值,大致看一下有无异常 4.找到插入->数据透视表,不选择默认点击确认创建,随意点击数据透视…...

【C语言】解决C语言报错:Invalid Pointer
文章目录 简介什么是Invalid PointerInvalid Pointer的常见原因如何检测和调试Invalid Pointer解决Invalid Pointer的最佳实践详细实例解析示例1:未初始化的指针示例2:已释放的指针示例3:返回局部变量的指针示例4:野指针 进一步阅…...

动态图形设计:创造视觉运动的艺术
什么是动态设计?动态设计是一个设计领域,指在用户界面中使用动态效果的设计。简单地说是为了移动用户界面上的元素而设计的。良好的动态设计可以吸引用户的注意,提高用户体验和满意度。动态设计也是界面设计与动态设计的结合,将设…...

CSS 属性 `mix-blend-mode`
CSS 属性 mix-blend-mode 在日常的 Web 开发中,我们大多时候都会使用一些常见的 CSS 属性,比如 font-size、color、background-color 等。但是,CSS 语言中还隐藏着许多鲜为人知但非常强大的属性,今天我们就来探讨其中一个 - mix-blend-mode。 mix-blend-mode 是什么? mix-b…...

三大交易所全面恢复 IPO 申请
6月21日晚间,北交所受理了3家企业的IPO申请,这是北交所时隔3个月之后恢复IPO受理。6月20日晚间,沪深交易所各受理了1家IPO申请,这是沪深交易所时隔半年后再次受理IPO。这也意味着,三大交易所IPO受理全部恢复。 6月21日…...

VC++开发积累——vc++6.0中删除函数的方法,右键,Delete
目录 引出插曲:删除函数的方法多行注释的实现代码输入的自动提示搜索出来,标记和取消标记跳转到上一步的位置 ctrl TAB 总结其他规范和帮助文档创建第一个Qt程序对象树概念信号signal槽slot自定义信号和槽1.自定义信号2.自定义槽3.建立连接4.进行触发 自…...

HBDNY-40/1端子排电压继电器 DC110V 导轨安装 约瑟JOSEF
HBDNY系列端子排型电压电流继电器 系列型号:(3、4过/低电压型,5、6过/低电流型) HBDNY-30/1端子排型电压继电器;HBDNY-30/2端子排型电压继电器; HBDNY-30/3端子排型电压继电器;HBDNY-30/4端子…...

Redis-数据类型-Geospatial(地理空间索引)
文章目录 1、查看redis是否启动2、通过客户端连接redis3、切换到db5数据库4、将地理位置信息(经度和纬度)添加到 Redis 的键(key)中4.1、添加大江商厦4.2、添加西部硅谷 5、升序返回有序集key,让分数一起和值返回的结果…...

Python联动Mysql
首先配置pip源(不然在安装库的时候会很慢!!!) pip config set global.index-url https://mirrors.aliyun.com/pypi/simple/安装必要库: mysql.connector MySQL 连接器/ODBC 是 MySQL ODBC 驱动程序(以前称为 MyODBC 驱动程序)系列的名称,它使…...

vue3-openlayers 轨迹回放(历史轨迹)(ol-animation-path实现)
本篇介绍一下使用vue3-openlayers轨迹回放(历史轨迹)(ol-animation-path实现) 1 需求 轨迹回放(历史轨迹)实时轨迹 2 分析 轨迹回放(历史轨迹),一般是一次性拿到所有…...

计算机视觉全系列实战教程 (十二):图像分割(阈值分割threshold、分水岭算法watershed的使用步骤、洪水填充floodFill算法的使用)
1.图像分割概述 (1)What(什么是图像分割) 将图像划分为不同的子区域,使得同一子区域具有较高的相似性,不同的子区域具有明显的差异性 (2)Why(对图像进行分割有什么作用) 医学领域:将不同组织分割成不同区域帮助分析病情军事领域ÿ…...

Linux的免交互
交互:我们发出指令控制程序的运行,程序在接收到指令之后按照指令的效果做出对应的反应。 免交互:间接的通过第三方的方式把指令传送给程序,不用直接的下达指令。 1、here document免交互 ere document免交互:是命令…...

查看es p12证书文件过期方法
查看证书过期时间: openssl pkcs12 -in elastic-certificates.p12 -nokeys -out elastic-certificates.crt (需要输入证书生成时配置密码) openssl x509 -enddate -noout -in elastic-certificates.crt...

1.8 无符号大数加、减运算
作者 李卫明 单位 杭州电子科技大学 1.8 无符号大数加、减运算。程序设计中经常遇到无符号大数加、减运算问题,请在样例程序Ex1.4基础上实现无符号大数减运算。题目要求输入两个无符号大数,保证一个大数不小于第二个大数,输出它们的和、差。…...

Java常用类--包装类
包装类 一方面出于性能方面的考虑,java为数值使用基本类型,而不是对象。基本类型不是对象层次的组成部分,它们不继承Object。 另一方面有时需要创建表示基本类型的对象,例如集合类只处理对象。为了在类中存储基本类型,…...

SpringMvcの拦截器全局异常处理
一、拦截器 我们在网上发贴子的时候如果没有登录,点击发送按钮会提示未进行登录,跳转到登录页面。这样的功能是如何实现的。 1、 拦截器的作用 Spring MVC 的处理器拦截器类似于Servlet开发中的过滤器Filter,用于对处理器进行预处理和后处理…...

JVM虚拟机的组成
一、为什么要学习 JVM ? 1. “ ⾯试造⽕箭,⼯作拧螺丝” , JVM 属于⾯试官特别喜欢提问的知识点; 2. 未来在⼯作场景中,也许你会遇到以下场景: 线上系统突然宕机,系统⽆法访问,甚⾄直…...

探索CSS clip-path: polygon():塑造元素的无限可能
在CSS的世界里,clip-path 属性赋予了开发者前所未有的能力,让他们能够以非传统的方式裁剪页面元素,创造出独特的视觉效果。其中,polygon() 函数尤其强大,它允许你使用多边形来定义裁剪区域的形状,从而实现各…...

【华为OD机试B卷】单词接龙(C++/Java/Python)
题目 题目描述 单词接龙的规则是: 可用于接龙的单词首字母必须要前一个单词的尾字母相同;当存在多个首字母相同的单词时,取长度最长的单词,如果长度也相等,则取字典序最小的单词;已经参与接龙的单词不能重复使用。现给定一组全部由小写字母组成单词数组,并指定其中的一个…...

项目实训-vue(十七)
项目实训-vue(十七) 文章目录 项目实训-vue(十七)1.概述2.问诊类型3.问诊时间统计4.看诊时间统计 1.概述 本篇博客将记录我在数据统计页面中的工作。因为项目并未实际运行,因此我们拟定了一些数据,并构建了…...

Android10 SystemUI系列 需求定制(二)隐藏状态栏通知图标,锁屏通知,可定制包名,渠道等
一、前言 SystemUI 所包含的界面和模块比较多,这一节主要分享一下状态栏通知图标和通知栏的定制需求:隐藏状态栏通知图标,锁屏通知,可定制包名,渠道等 来熟悉一下Systemui。 二、准备工作 按照惯例先找到核心类。这里提前说一下,这个需求的修改方法更多,笔者这里也只…...

Linux:RAID磁盘阵列
目录 一、RAID(磁盘阵列) 1.1、概念 1.2、RAID 0(条带化存储) 1.3、RAID 1(镜像存储) 1.4、RAID 5 1.5、RAID 6 1.6、RAID 10 (先做镜像,再做条带) 二、创建RAID 2.1、建立RAID 0 …...

MongoDB和AI 赋能行业应用:零售
欢迎阅读“MongoDB 和 AI 赋能行业应用”系列的第三篇。 本系列重点介绍 AI 应用于不同行业的关键用例,涵盖制造业和汽车行业、金融服务、零售、电信和媒体、保险以及医疗保健行业。 利用生成式 AI 技术(Gen AI),零售商可以创造…...