d3js
文章平均质量分 52
婉兮娈兮
这个作者很懒,什么都没留下…
展开
-
d3js学习——8.绘制折线图
3.添加一个群组,并加入transform属性。svg 中的原点(0,0)位于左上角。1.先写一个svg标签,定好宽和高。是时间比例尺,刻度可以是年、月、日。7.绘制折线——添加一些样式信息。2.定义一个数据集合和一些变量。// 设置SVG容器和边距。4.设置x,y的比例尺。// 设置x和y比例尺。// 创建折线生成器。// 绘制x轴和y轴。原创 2023-07-14 15:17:43 · 549 阅读 · 0 评论 -
d3js学习——7.绘制图形
条形图使用d3js绘制条形图的步骤:1.条形图的样式svg rect { fill: gray;}svg text { fill: yellow; font: 12px sans-serif; /* 将文本定位到条的右端 */ text-anchor: end;}2.设置变量值const data = [10, 20, 23, 14];//定义 svg的宽度、缩放到屏幕上可见的像素值、水平条的静态高度const width = 500, scaleF原创 2023-07-14 10:17:46 · 406 阅读 · 0 评论 -
d3js学习——6.过渡和动画
方法(需要在transition之前调用),还提供了特定于转换的方法——:可以用于所有选择器,并启动转换过程,支持大多选择方法——过渡:让项目从一个状态转换到另一个状态。——支持的插值类型:数值,颜色,字符串。方法允许再一段时间之后进行转换。D3内部插值方法——原创 2023-07-13 16:00:42 · 171 阅读 · 0 评论 -
d3js学习——svg的转换
单独管理转换的库——d3Transform。svg 引入了一个新属性,使用d3js创建svg。原创 2023-07-13 15:59:36 · 323 阅读 · 0 评论 -
d3js学习——4.svg
SVG 代表 scalable vector graphics,是一种基于 XML 的矢量图形格式,提供了绘制不同形状的选项:直线、矩形、圆形、椭圆等。svg 格式的默认单位的 Pixel.原创 2023-07-13 15:58:46 · 129 阅读 · 0 评论 -
d3js学习——3.数据连接
数据连接的主要目的是:使用给定的数据集映射现有文档的元素。它根据给定的数据集创建文档的虚拟表示,并提供使用虚拟表示的方法。原创 2023-07-13 15:57:44 · 62 阅读 · 0 评论 -
d3js——2.选择元素的方法
将新元素作为当前选择中元素的最后一个子元素附加。此方法还可以修改元素的样式、属性、HTML和文本内容。:通过匹配给定的 CSS 选择器,仅选择一个 DOM 元素。如果有多个则选择第一个。:通过匹配给定的 CSS 选择器来选择所有 DOM 元素。:专门用于设置html元素的 class 属性。:用于设置所选/附加元素的html内容。:用于添加或者更新所选元素的属性。:用于设置所选/附加元素的内容。:设置所选元素的样式属性。原创 2023-07-13 15:56:04 · 144 阅读 · 0 评论 -
d3js使用——1.引入
【代码】d3js使用——1.引入。原创 2023-07-13 15:53:42 · 295 阅读 · 0 评论