首页 > 其他分享 >d3js(D3JS 不规则图形)

d3js(D3JS 不规则图形)

时间:2022-10-24 15:07:26浏览次数:45  
标签:容器 attr 位置 D3JS js d3js 不规则 页面 加载


d3js做的图表怎么放在html中的指定位置啊

定义div的id,比如为id1,定义svg时用d3.select("#id1")而不是d3.select("body")

Single Selection
参考例子:#


var svg = d3.select(".test")
.append("svg")
.attr("width", 300)
.attr("height", 300);
var dataset = [250, 210];
svg.selectAll("rect搜索")
.data(dataset)
.enter()
.append("rect")
.attr("x", 20)
.attr("y", function (d, i) {return i * 25;})
.attr("width", function (d) {return d;})
.attr("height", 23);

一般js加载的元素放置在页面中的位置,有两种方法

1.一种是放在相应的容器里面,利用js动态加载进来,但是元素的位置是固定了的,就是在页面中容器原来放置在哪里,就只能放置在哪里,不过结合position可以动态地改变位置

js加载内容

2.还有一种就是,js自己在body元素下生成一个容器,利用绝对定位或者固定定位,从而可以放在在页面的任何位置

动态加载的js

一般js加载的元素放置在页面中的位置,有两种方法

1.一种是放在相应的容器里面,利用js动态加载进来,但是元素的位置是固定了的,就是在页面中容器原来放置在哪里,就只能放置在哪里,不过结合position可以动态地改变位置

js加载内容

2.还有一种就是,js自己在body元素下生成一个容器,利用绝对定位或者固定定位,从而可以放在在页面的任何位置

动态加载的js

肯定可以改变位置的 只有可能你搞错而已

d3js和threejs能不能结合

D3.js是一个数据可视化的库,看看他们的DEMO就可以知道,技术基础是SVG。兼容性是IE9+。webgl是HTML5中提出的新技术,是一种3D绘图标准,这种绘图技术标准允许把JavaScript和OpenGLES2.0结合在一起,关于它的教程可以看看hiwebgl。目前兼容性

标签:容器,attr,位置,D3JS,js,d3js,不规则,页面,加载
From: https://blog.51cto.com/yetaotao/5789766

相关文章

  • 运用D3js开发关系图谱
    开发内容实现节点头像设置及点击事件实现右击节点展开菜单功能实现关系线有无剪头实现关系线文本显示及点击事件github地址https://github.com/lvlq73/relationD3......
  • d3js实现热图--heatmap
    这一章节记录热图,下面是图和实现过程。   1、data这些数据存储在csv文件中x,y,valueA,m1,5A,m2,5.7A,m3,6.6A,m4,5.9A,m5,10.8A,m6,11.5A,......