美文网首页
数据可视化d3.v4.js

数据可视化d3.v4.js

作者: Share_8166 | 来源:发表于2018-02-27 11:08 被阅读0次

var width = 300; //画布的宽度

var height = 300; //画布的高度

var svg = d3.select("#app") //选择文档中的元素

.append("svg") //添加一个svg元素

.attr("width", width) //设定宽度

.attr("height", height); //设定高度

var dataset = [ 250 , 210 , 170 , 130 , 90 ];

var rectHeight = 25; //每个矩形所占的像素高度(包括空白)

svg.selectAll("rect")

  .data(dataset)

  .enter()

  .append("rect")

  .attr("x",20)

  .attr("y",function(d,i){

return i * rectHeight;

  })

  .attr("width",function(d){

  return d;

  })

  .attr("height",rectHeight-2)

  .attr("fill","steelblue");

相关文章

  • 数据可视化d3.v4.js

    var width = 300; //画布的宽度 var height = 300; //画布的高度 var sv...

  • python生成数据

    数据可视化指: 数据可视化指的是通过可视化表示来探索数据,它与数据挖掘紧密相关。 数据挖掘: 数据挖掘指的是使用代...

  • 数据可视化方案

    数据可视化-数据大屏-产品介绍 可视化 大数据时代,数据可视化将成为IT领域一个重点发展方向。数据可视化已经不在是...

  • 数据可视化基础知识

    1. 数据可视化简介 创建图表探索数据并分享结果数据可视化:量化信息的可视化 2. 为何使用数据可视化? 安斯库姆...

  • 第一章 数据可视化简介

    第一章 数据可视化简介 1.1 数据可视化简史 1.1.1 20世纪前的数据可视化 数据可视化有着悠久的历史,并在...

  • 这篇文章你一定要阅读:大数据可视化以及几款数据可视化的工具介绍

    大数据可视化是什么 数据可视化要根据数据的特性,可视化要根据数据的特性,如时间信息和空间信息等,找到合适的可视化方...

  • Python 教程:使用 Matplotlib 和 Seabor

    数据可视化是以图形、图表和其他可视化表示形式表示数据的过程。它通过提供可视化表示来帮助我们理解数据。数据可视化是数...

  • 第三章 数据可视化

    第一章 数据可视化简介 第二章 数据 第三章 数据可视化 3.1 数据可视化流程 数据可视化是一个相当复杂的过程,...

  • 数据可视化<第一天>

    数据可视化 数据可视化是指通过可视化表示来探索数据,它与数据挖掘紧密相关而数据挖掘指的是使用代码来探索数据集的规律...

  • 数据可视化.视频.2017-09-26

    统计学:数据图像化大卫.麦克德里斯:数据可视化之美 Uber数据可视化TED 颠覆性的数据可视化演示(2) 数据可...

网友评论

      本文标题:数据可视化d3.v4.js

      本文链接:https://www.haomeiwen.com/subject/osepxftx.html