D3——根据数据画图
2024-10-19 14:54:09
为DOM元素添加class
.attr("class", "bar") //为元素添加class属性,<div class="bar"></div> .classed("bar", true) //添加class "bar"
.classed("bar", false) //删除class "bar"
Drawing Bars:
var dataset = [ , , , , ]; d3.select("body").selectAll("div")
.data(dataset)
.enter()
.append("div")
.attr("class", "bar"); //css
div.bar {
display: inline-block;
width: 20px;
height: 75px; /* We'll override height later */
background-color: teal;
}
Setting Styles
.style("height", function(d) {
return d + "px";
});
优化一下
.style("height", function(d) {
var barHeight = d * ; //Scale up by factor of 5
return barHeight + "px";
}); //并设margin-right:2px;
最新文章
- js加密解密
- 多行溢出隐藏显示省略号功能的JS实现
- js 获取系统当前时间
- springboot系列之-helloword入门
- Codeigniter MongoDB类库
- 学习c编程的第三天
- 单元测试之道(使用NUnit)
- iOS开发——Swift篇&;单例的实现
- 344. Reverse String(C++)
- (转)iOS7界面设计规范(13) - UI基础 - 与iOS的系统整合
- CSS+DIV入门第一天基础视频 CSS选择器层叠性和继承性
- 《TCP/IP详细解释》札记(23章)-TCP该保活定时器
- 关于grub的那些事(三)
- 移动端h5 实现多个音频播放
- [PA2014]Druzyny
- hdu 2838 Cow Sorting
- lua 5.3最简单plugin编写
- 9.Redis高可用-哨兵
- 关于学习Vue的前置工作/技术储备
- ArcGIS案例学习笔记_3_2_CAD数据导入建库
热门文章
- GIT 恢复单个文件到历史版本
- CentOS 7 的下载源为aliyun
- js扩展
- go install runtime/cgo: open /usr/local/go/pkg/darwin_amd64/runtime/cgo.a: permission denied
- Maven+MyBatis 初试
- Effective C++ .33 子类的名称覆盖
- BFC(Box Formatting Context)的原理
- HDU4336:Card Collector(min-max容斥)
- 前端面试经典题目合集(HTML+CSS)一
- html 之 position用法