创建, 发布自己的 Vue UI 组件库 前言 在使用 Vue 进行日常开发时, 我们经常会用到一些开源的 UI 库, 如: Element-UI, Vuetify 等. 只需一行命令, 即可方便的将这些库引入我们当前的…
标签:d3-js
手动实现一个速度仪表盘
前言 最近正在学习数据可视化, 这里记录一下一些心得与成果, 采用的技术是 (svg + react + d3)。 这种实现可视化方式本人个人感觉超级不错,如果你是有一定的基础的同学,强烈推荐一下。 效果 整体效果如下:…
用D3做了一个B站弹幕可视化
和朋友合作用d3可视化b站弹幕,一方面学习巩固,另外也是通过可视化大致了解下视频是否精彩,再决定看不看[捂脸] 使用方式 通过bookmarklet使用,有点像chrome插件但更方面一点~。地址:bilibili可视化…
使用D3.js+Vue实现一个简单的柱形图
最近想在Vue的项目里尝试使用d3.js,封装一些常用的图表。这里记录一下自己搭建项目的过程,以及实现一个简单的柱形图。不了解D3的请移步D3 Data-Driven Documents,它是基于数据驱动文档工作方式的一…
vue.js + d3.js 封装可视化组件 —— 条形统计图(一)
前言 在开始之前,希望读者听说过或者了解过以下名词 vue.js一套用于构建用户界面的js框架 d3.js将强大的可视化组件和数据驱动的方法结合到DOM操作中的js库 在这里我想说一句,这是我接触的比较强大的构建数据可视…
用D3做了一个B站弹幕可视化
和朋友合作用d3可视化b站弹幕,一方面学习巩固,另外也是通过可视化大致了解下视频是否精彩,再决定看不看[捂脸] 使用方式 通过bookmarklet使用,有点像chrome插件但更方面一点~。地址:bilibili可视化…
Vue+D3.js制作仪表图组件
基于Vue+D3.js的仪表图组件 实现的效果如下图所示 1.定义data数据,实现组件的可定制化 panel组件能定制的参数包括以下几项 config: { size: 200, //panel的大小 label: '…
d3.js ---画坐标轴
画坐标轴 //使用d3的svg的axis()方法生成坐标轴 var x_axis = d3.svg.axis().scale(scale_x), y_axis = d3.svg.axis().scale(scale_y)…
d3学习day1----画曲线
d3画布的基本布局如下图 实现过程如下: 先定义画图的容器的尺寸 var width = 500, height = 200, margin = { left: 50, top: 30, right: 20, botto…
d3.js交互图表
d3js v5.9.2 假如对原生JS另有Jq比较熟习的话,d3的交互很快就可以控制 照样拿完全的柱形图例子修正:完全的柱图 selection.on() d3经由过程selection.on()对元素举行事宜绑定或移除…
d3.js 动态图表
d3js v5.9.2 运用d3建立动态图表重要运用到了d3.trasition部份的API,经由历程他们能够完成动画 我的进修纪录是经由历程一个例子相识这些API 会动的柱状图 照样拿之前的例子,代码在此:完全的柱图 …
d3.js 建立完全柱形图
d3js.org v5.9.2 之前只是各个部份的demo,如今将各部份整合起来,发明照样学到了不少东西 主如果加深了对scale(比例尺)的明白 代码 html、款式及数据 html <svg class="ch…