我有一个d3.js图,它是由一系列对象组成的,例如:
svg.selectAll(".circ").data(dataArr) // dataArr is my array of objects
.enter().append("circle")
.attr("cy", function (d) {
return d.y
})
.attr("cx", function (d) {
return d.x
})
.attr("r", ele
我从d3.js开始,尝试创建一个网络图,其中每个圆都包含一个标签。
我想要的是在svg文本中换行。
我尝试做的是将文本分解成多个<tspan>,每个都有x="0“和变量"y”来模拟实际的文本行。我写的代码给出了一些意想不到的结果。
var text = svg.selectAll("text").data(force.nodes()).enter().append("text");
text
.text(function (d) {
arr = d.name.split(" ");
var arr
我正在尝试使用D3.js的.data()函数访问一些已经绘制到屏幕上的特定svg圆的cx & cy属性,有谁能帮上忙吗?尝试访问它的代码如下所示。
d3.selectAll(".mynode").each( function(d, i){
if(d.someId == targetId){
console.log( d.attr("cx") ); // just trying to demo my point, doesn't work
}
}
我对d3.js和javascript还是个新手,所以我不确定我是不是从前到后,或
我试着用d3.js,React和PatternFly 4做一个简单的折线图。我也做了其他的图,他们用select id工作,但是这个拒绝工作,我不能把我的手指指向这个问题。 请注意,id在调用该类时已经创建,因此它在select发生时存在。 render() {
### This only works if I replace "#linechart" by "body"
var svg = d3.select("#linechart").append("svg")
.attr("width",
我一直在寻找一种从d3.js下载生成的svg的方法,我要么使用了看起来有点过分的phantom.js (或者至少考虑到问题的“简单性”),要么使用svg-micbar.js,这显然只适用于chrome (我需要firefox)。
我还找到了以下代码:
//Encode the SVG
var serializer = new XMLSerializer();
var xmlString = serializer.serializeToString(d3.select('svg').node());
var imgData = 'data:image/svg+xml;ba
我试图在d3.js中使用每个属性都有不同名称的数据集进行一些圆圈:
var h = 500;
var w = 800;
var data = {'Jane' : 30, 'John' : 40, 'Mary' : 50, 'Al' : 60};
var svg = d3.select("body")
.append("svg")
.attr("width", w)
.attr("height", h);
var circles = svg.s
var k = -1;
someCircle.attr("cy", someScaleObject(++k));
所有的圆都有相同的y对齐,而期望的行为是把每个圆圈画在另一个下面。奇怪的是,如果我通过一个匿名函数返回someScaleObject(++k),这就达到了预期的效果。为什么?作者还在匿名函数的范围内声明了一个d变量,尽管它没有任何用途。有人能解释原因吗?
// Works as expected
someCircle.attr("cy", function () {
return someScaleObject(++k);
});
完整的代码
我有一个带有AngularJs指令的HTML标记,比如:
<div line-chart></div>
它调用一个生成SVG对象及其相对子元素的指令。用于创建子元素的函数:
function drawDataPoints(params){
function drawDataPointCircles() {
var dataPointAttributes = {
'class': 'data-point negative'
};
params.svg.selectAll('circle d
我正在尝试用d3.js创建一个动画弧段。我得到了圆弧和过渡的工作,但当动画运行时,圆弧被扭曲,我不知道为什么。
这是我到目前为止所知道的:
var dataset = {
apples: [532, 284]
};
var degree = Math.PI/180;
var width = 460,
height = 300,
radius = Math.min(width, height) / 2;
var color = d3.scale.category20();
var pie = d3.layout.pie().startAngle(-90*degr
我想在d3.js脚本中重写与其中一个布局相关的几个函数。当我将这些函数剪切并粘贴到单独的文件中,并在d3.js之后加载它们时,可视化就不再工作了,因为内部函数调用d3.js的内部函数。
d3.js:
!function() {
var d3 = { version: "3.5.17" };
function d3_funct() { return d3; } // this function is called in the other file
}();
chord.js:
d3.svg.chord() = function() {
var funct = d3_