使用AngularJs和D3.js从svg元素调用自定义函数
使用AngularJS和D3.js从SVG元素调用自定义函数是一种前端开发技术，可以通过以下步骤实现：
- 集成AngularJS和D3.js：在HTML页面中引入AngularJS和D3.js的相应库文件，确保它们正确加载。
- 创建SVG元素：使用HTML的<svg>标签创建一个SVG容器，可以设置相应的宽度和高度。
- 定义AngularJS控制器：创建一个AngularJS控制器来管理SVG元素和自定义函数的调用。在控制器中，可以定义一些作用域变量和函数。
- 绑定SVG元素和控制器：使用AngularJS的指令将SVG元素与控制器进行绑定，以便在SVG元素中可以调用控制器中的函数。
- 编写自定义函数：在控制器中编写自定义函数，可以通过传递参数来操作SVG元素。
- 调用自定义函数：在SVG元素中使用D3.js的事件处理函数（如click、mouseover等）来调用自定义函数，并传递相应的参数。
下面是一个示例代码：
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.8.2/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/7.0.0/d3.min.js"></script>
</head>
<body ng-controller="myController">
<svg width="400" height="400">
<circle cx="200" cy="200" r="100" fill="red" ng-click="customFunction('Hello World!')"></circle>
</svg>
<script>
angular.module("myApp", [])
.controller("myController", function($scope) {
$scope.customFunction = function(message) {
console.log(message);
// 这里可以进行一些自定义的操作，例如修改SVG元素的属性或样式
};
});
</script>
</body>
</html>在上述示例中，我们创建了一个SVG元素（一个红色的圆），并在圆上绑定了ng-click指令，以调用控制器中的自定义函数customFunction。当用户点击圆时，控制器中的自定义函数将在浏览器的控制台中输出"Hello World!"。
注意，上述示例只是演示了从SVG元素调用自定义函数的基本方法，实际应用中可能涉及更复杂的操作和交互。具体的应用场景和推荐的腾讯云相关产品取决于具体的需求，可以根据实际情况选择合适的解决方案。
相关·内容
我有一个简单的d3.js时间序列图，绘制成SVG圆圈。圆圈是键绑定的，所以当我从数组的末尾删除数据时，右边的圆圈被移除，当我从数组的开头移除项目时，从左的圆圈在exit.remove()上被删除。
var circles = svg.selectAll('circle')
.data(data, function(d){return d.key})
现在，我想对SVG路径做同样的操作。是否有一种将键绑定应用于SVG路径的方法？
浏览 4提问于2013-08-12得票数 1
回答已采纳
我通过d3.js生成svg图，并单击d3.js生成的DOM附带的事件，但是在d3.js之外预先创建的DOM不会触发事件
//d3.js generated DOM
var marker = layer.selectAll("svg")
.data(data)
.each(transform) // update existing markers
.enter().append("svg")
.each(transform)
浏览 5提问于2016-11-15得票数 0
回答已采纳
1回答
我对d3.js很陌生，并尝试根据特定条件使用d3.js从文件夹动态加载图像。我正在使用的代码是
var svg = d3.select("body")
.append("svg")
.attr("width", 150)
.attr("height", 150)
.style("border", "1px solid black");
d3.csv("data/Image
浏览 4提问于2016-03-07得票数 1
回答已采纳
3回答
我是Javascript和JQuery的新手，对于我认为简单的东西，我有一个问题。我正在制作一个由单个html页面、一个css样式表和一个Javascript文件组成的网站，该文件可以从某个地方检索数据并使用d3.js绘制网络。我的html中有一个SVG元素，我需要从Javascript访问它，以便更改其属性并在其中进行绘制。我最初是在JQuery中创建SVG元素，并将返回值另存为一个变量，供以后使用。然而，这有点丑陋，因为每次我想绘制一个新的网络时，我都必须删除并重新添加SVG。
因此，现在我已经将SVG元素添加到html中，并使布局能够很好地与窗口大小调整一起工作。然而，我似乎不能很容易地
浏览 1提问于2013-06-08得票数 0
回答已采纳
1回答
我正在尝试将网络可视化从D3.js绑定到一个闪亮的自定义输出。由于某种原因，我的呈现函数似乎没有被调用。这是我的代码：
rbindings.js
var forceNetworkOB = new Shiny.OutputBinding();
forceNetworkOB.find = function(scope) {
return $(scope).find("svg.rio-force-network");
};
forceNetworkOB.renderValue = function(el, graph) {
alert('rendering
浏览 4提问于2014-08-10得票数 2
回答已采纳
形势：
我正在做一个谷歌地图与一个d3覆盖。它很大程度上是基于Mike：中的这个例子
我从Rails 4应用程序中运行它，并从CDN加载d3.js库。因此，可以访问d3.js和jQuery库，并且更愿意避免添加更多的库。
任务：
数据点(由svg:rect元素表示)有时会模糊谷歌地图上的地名。我想要它，这样用户就可以将光标传递到这些数据批注上，并使它们暂时跳出来。
我应该注意到，我试图让点随机地重新定位，所以不能真正走悬停的CSS路线。
所以..。
将事件侦听器放在SVG上(或者根据实际应该操作的元素进行rect )
编写一个重新定位的回调函数(偏移？动画？过渡？)触发事件的元素。
浏览 6提问于2014-02-15得票数 0
回答已采纳
我有一个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
浏览 3提问于2014-06-27得票数 1
回答已采纳
我想尝试将引导工具提示放在angularjs中的svg元素上，我不是使用d3.js，我只是使用angularjs。如果你举例解释的话，那就更好了。
浏览 4提问于2015-09-12得票数 1
回答已采纳
1回答
我使用d3.js变焦功能放大svg中的图像。我用一个面具来揭示下面的一个潜在的图像。如果我不缩放，面具和鼠标光标坐标完全匹配。但是，当我开始缩放时，鼠标坐标没有转换到缩放级别，因此地图显示不再与光标排列。
这里是我使用的，所以，far...Im，假设需要某种形式的坐标转换，当缩放？
var lightMap = d3.select("#lightMap").call(d3.behavior.zoom().scaleExtent([1, 3]).on("zoom", zoom));
var darkMap = d3.select("#darkMap&#
浏览 1提问于2015-04-21得票数 4
我从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
浏览 0提问于2013-10-18得票数 9
回答已采纳
这是一个问题，我有，并解决了，这似乎足够有用的分享，至少因为我怀疑我会再次遇到这个问题。
问题:读取SVG图像并公开其路径元素
创建散图点，这实际上是可爱的，小的SVG图像从文件，与SVG路径暴露的。对D3.js的兴趣至少在一定程度上是由于它的“无限的灵活性”，如果我只想要一个简单的情节，有比D3更简单的方法。
这意味着：
我希望能够从SVG文件中读取图像。
我仍然希望能够访问SVG路径。在这种情况下，我希望能够根据绑定数据(类似于如何根据数据调整圆半径)来调整徽标中线条的线条厚度。
任何我试图将svg文件作为图像导入的方法(例如通过<selection>.app
浏览 1提问于2018-02-09得票数 0
我尝试使用D3.js的d3.behavior.drag() drag事件来更新我的数据模型(不立即设置元素位置)，然后运行我的"draw“函数来更新基于更新后的模型的所有元素。此外，我在包含的group元素上使用了translate transform，以便移动与拖动的对象相关的所有元素(我从下面链接的示例中删除了多余的元素)。这会导致拖拽的元素在拖拽时卡顿，拖拽速度越快，情况会变得越糟。
参见。
以下是示例的代码：
blocks = [
{ x: 0, y: 0 }
];
drag = d3.behavior.drag()
.origin(Object)
.on(
浏览 1提问于2012-10-26得票数 20
回答已采纳
1回答
我在向现有元素插入新的同级元素时遇到了问题。
我有这样的结构
<svg>
<g>
<path class="data"></path>
<path class="data"></path>
</g>
</svg>
想要这个结构
<svg>
<g>
<path class="data"></path>
<text></text>
浏览 4提问于2012-10-23得票数 30
回答已采纳
1回答
我原以为d3.js append函数返回附加到所选内容的对象，但我发现以下两个代码块给出了不同的结果：
var svg = d3.select("body")
.append("svg")
.attr("width", fig_width)
.attr("height", fig_height);
svg.append("g")
.attr("class", "graph")
.attr("tr
浏览 2提问于2015-04-16得票数 5
回答已采纳
4回答
我正在尝试使用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还是个新手，所以我不确定我是不是从前到后，或
浏览 1提问于2012-07-05得票数 48
回答已采纳
我对编程和编码非常陌生。我使用生成的.svg文件与d3.js生成交互式地图。
这个SVG是用g's组织的，里面有多边形，里面有自己的id。我还添加了自定义数据，用于SVG中的每个多边形( data -price="number")：
<g id="price-range">
<polygon id="name" data-price="price number" points="..."/>
<polygon id="name2" data-pr
浏览 4提问于2017-04-13得票数 1
回答已采纳
假设我想以编程方式在下面的SVG中的<text>元素中插入一个额外的<text>：
<svg width="300" height="500">
<text x="50" y="100">
<tspan x="50">one</tspan>
<tspan x="50" dy="20">two</tspan>
<tspan x=&
浏览 2提问于2013-05-22得票数 6
回答已采纳
我正在使用SVG中的布局生成器，并希望在其中添加拖放和调整大小的功能。我的网页包含一个主画布(SVG)和一些嵌套的SVG。我希望嵌套的SVG(您可以说是子SVG)是可拖动的。我怎么能这么做？我在JQuery中搜索，我们有可拖动的和可调整大小的API，但是它不能在SVG中工作。我如何在d3.js中实现它？任何帮助都会更好。提前谢谢。
浏览 3提问于2017-05-24得票数 1
回答已采纳
2回答
是否有一种方法可以从javascript在Java中呈现的html页面呈现和解析SVG元素，例如：，在本例中使用的是d3.js。
浏览 7提问于2016-11-01得票数 3
回答已采纳
我正在为我在d3.js datavizualisation中使用的数据的每个数据点绘制几个元素。这将根据数据创建一个简单的项列表。它的产出如下：
<div>
<p>[Title of datapoint 1]</p>
<svg>[SVG using datapoint 1]</svg>
</div>
<div>
<p>[Title of datapoint 2]</p>
<svg>[SVG using datapoint 2]</svg>
<
浏览 2提问于2020-01-18得票数 1
回答已采纳
1回答
我之所以写信给你，是因为我正在努力使用D3.js (D3-selection)来移动SVG中现有的元素位置。 我见过很多创建新元素的示例，但在这里，我的元素已经创建好了。 我的svg中有这样的结构： <g id='maingroup' class='main'>
<title>titlemain</main>
<text id='text'>textContent</text>
</g>
<g id='othergroup1' class=&
浏览 59提问于2021-07-09得票数 3
回答已采纳
在我的DOM中，我有许多SVG矩形(每个矩形都是单独的)，只要用户单击(使用d3.js on -拖动事件)，这些矩形的大小就会增加。尺寸从2px增加到20 2px。它起作用了，一切都很好-但是：
我有一个QUnit测试，测试大小是否正确，目前它运行红色，告诉我大小保持在2px。
我试着在DOM-检查器中检查实际大小，但是一旦我单击矩形来触发事件，它的组就会在DOM-1检查器中崩溃，而我无法查看。如果我释放鼠标，这个组再次扩展，但它又是原来的状态，我不想检查它。
当我的鼠标被点击时，我想看看DOM的状态。有没有办法立即停止执行死刑？
我已经尝试过使用事件侦听器断点和元素状态:active/:fo
浏览 0提问于2015-04-22得票数 0
回答已采纳
1回答
我正在创建一组对象(使用伪类，因此它们都具有相同的结构)，其属性为"name“、"type”、"status“、"poxitionX”和"positionY“。
然后使用d3.js激活SVG绘图区域
var svg = d3.select("#d3canvas")
.append("svg")
.attr("width", 600)
.attr("height", 400);
把我的东西画成画布上的圆
function drawCircle (objectHandle) {
var temp
浏览 1提问于2014-01-03得票数 1
回答已采纳
3回答
我正在使用dc.js绘制一些图表。
在d3代码中，我动态地计算几个列的总和，然后将它们添加到我用d3.js绘制的饼图中。
这是计算列总数的代码：
var pieChart = [];
classesJson.forEach(function(classJson){
var memDegree = ndx.groupAll().reduceSum(function(d){
return d[classJson.name];
}).value();
//console.log(memDegree);
pieChart.push({name:class
浏览 2提问于2015-07-27得票数 0
回答已采纳
2回答
d3.js layout.force可以用来定位像div这样的非svg元素吗？
如果div有position: absolute;，那么left和top也许可以作为与svg元素相同的x1和y1属性使用？
目标是在支持IE8的图像和菜单项上产生一些强制效果。我知道svg节点可以是图像，但由于我需要支持IE8，这不是一个选项。
如果不可能的话，使用和d3.js是一个稳定的选择吗？
谢谢!
**更新**
D3很酷！！我开始掌握它的窍门了，并且可以在常规的html元素(如div)上使用“强制”，因为d3.layout.force()本质上给出了每个你想要使用的“滴答”(或帧)的x和y坐标。
ie：
f
浏览 4提问于2012-02-15得票数 8
回答已采纳
我会用
var element = document.elementFromPoint(x, y);
从原始SVG中获取SVG元素。但在运行我的代码时，会在原始SVG上放置一个网络。所以它返回网络顶点，而不是后面的svg元素。
即使我有修改后的svg和原始的SVG，从网络中找到每个顶点的svg元素的最快方法是什么？
所以我有圆(顶点)和背景形状。我需要得到一个圆圈(顶点)后面的背景元素。我也有来自每个顶点的所有(x，y)位置。
我看到了这个使用jquery的解决方案：
$("svg").find("[x='10'][y='10']"
浏览 4提问于2014-09-03得票数 3
关于Leaflet.js映射和D3.js外部svg文件，我有一个问题。我想知道如何添加外部svg文件(现在我使用D3.js)到传单地图。
我发现了很多教程，但他们使用的是.json：
我尝试了一切(用我的知识)将外部svg图像移动到传单地图上的覆盖层，但我做不到。
请帮助我：
感谢大家的阅读和回答。:)
浏览 4提问于2015-08-07得票数 5
回答已采纳
我试着用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",
浏览 26提问于2019-05-24得票数 0
3回答
我使用的是d3.js的力布局，我想要使力布局是响应的。
我使用了以下代码：
var width = 1110 ,height = 600 ;
svg = d3.select("#d3_drawing_container").append("svg:svg")
.attr("viewBox", "0 0 " + width + " " + height )
.attr("overflow", "hidden")
浏览 2提问于2014-03-07得票数 0
回答已采纳
1回答
我一直在玩d3.js，它很酷。我需要一个足够灵活的二叉树来创建新的子节点。
我在考虑在<div>后面有一个<svg>元素(用于行)，它将包含所有的HTML.我已经设法让二叉树看起来很正确，甚至当你单击一个节点时，它也会创建另一个节点，但只从绑定到<svg>元素下的一个圆圈的事件开始。我如何让像<div>这样的东西来触发在父节点下添加子节点的事件？
另外，由于html是独立于svg画布的，窗口大小调整又是如何进行的呢？
浏览 0提问于2011-11-20得票数 2
回答已采纳
3回答
d3.js下载图形作为svg映像
、、、、
我一直在寻找一种从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
浏览 4提问于2014-06-06得票数 5
回答已采纳
1回答
在用D3.js创建我的第一个条形图时，Freshboy遇到了几个问题：
第30行-- console.log(yScale);控制台显示“function……”，这是什么？；最后一行--为什么我可以得到每一列的正确答案-- whenI给出“高度”值"yScale“。那里发生了什么事？
.attr("x", function(data, i){return xScale(i)}) xScale是一个变量，而不是函数。为什么我可以像函数一样使用xScale？？xScale(i)
var data = [4,8,15,16,23,42];
const s
浏览 4提问于2021-07-06得票数 0
回答已采纳
1回答
我想使用媒体查询调整d3.js图表的大小，并应用过渡。html中的图形设置为：
<g id="d3js_graph">
<svg class="d3svg"></svg>
<script src="JS\D3_BarChart.js"></script>
</g>
我对d3svg类应用了一个媒体查询并使用了一个转换：
@media (min-width: 1080px) {
.d3svg {
transform: translate(-30px,-30px); }
浏览 21提问于2019-07-20得票数 0
1回答
社区中，我希望使用类似于one 的D3.js创建一个Choropleth。
我的地图与本例不同，因为我希望使用我在index.html中创建和驻留的SVG，而不是使用TopoJSON或GeoJson文件来处理形状数据，因为我没有其他国家地区的形状数据。我的SVG使用路径或多边形，对于映射中与 id对应的每个区域都有一个id值。
我有id的，这是一个与示例等价的范围。
我考虑过将SVG转换为GeoJSON，然后使用和将其转换为TopoJson，但是我没有命令行的经验。在阅读了之后，我们将进一步了解以下内容：
“如果你正在创建一个合唱团，并且没有地理定位要求，那么你可以简单地将SVG的指向添加到
浏览 2提问于2016-02-15得票数 3
当用生成的onLoad加载imgGraph的src时，我很难让imgGraph处理程序触发。dataURI是使用画布从d3.js可视化(svg)生成的。
var canvas = document.getElementById(visual + '-canvas');
if(visual == "graph"){
console.log('graph logic n stuff')
canvas.width = 558;
canvas.height = 558;
var graph = d3.select(
浏览 0提问于2017-04-19得票数 3
回答已采纳
1回答
我想用D3.js设置下拉列表的位置，但与其他元素不同的是，select元素没有x和y属性，所以我不知道该怎么做。
d3.select("#chart")
.append("select")
.attr("id","desplegable")
.on('change',onchange)
.selectAll("option")
.data(preguntas)
浏览 0提问于2018-05-11得票数 4
1回答
据我所知，d3.js主要用于SVG，而不是HTML5 5的画布。SVG和Canvas的优缺点是明确的，并且已经讨论过了。现在，我发现可以在d3.js中使用画布，也可以与SVG结合使用。主要原因应该是为大型数据集获得更好的性能(就像cubism.js用于实时数据可视化一样)。我的问题是:当我在SVG上使用画布来获得更好的性能时，我仍然有可能进行交互吗？我知道画布本身允许操作，但它比SVG更难实现。所以，当我使用D3.jsCanvas方法时，我可以维护SVG的交互吗？
浏览 4提问于2014-03-13得票数 1
回答已采纳
在最近开始开发基于d3.js的可视化之后，我必须创建大量的轴。
我尝试使用我在创建其他svg元素(圆圈、行)时使用的方法，方法是绑定数据(包含每个轴的域)，并将元素附加到enter选择中。
axesSVG.selectAll("g")
.data(dimensionExtents)
.enter()
.append("g")
.attr("class","axis")
.call(function(d){return d3.svg.axis()
浏览 6提问于2013-09-27得票数 2
回答已采纳
2回答
我试图在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
浏览 3提问于2014-01-17得票数 0
回答已采纳
var k = -1;
someCircle.attr("cy", someScaleObject(++k));
所有的圆都有相同的y对齐，而期望的行为是把每个圆圈画在另一个下面。奇怪的是，如果我通过一个匿名函数返回someScaleObject(++k)，这就达到了预期的效果。为什么？作者还在匿名函数的范围内声明了一个d变量，尽管它没有任何用途。有人能解释原因吗？
// Works as expected
someCircle.attr("cy", function () {
return someScaleObject(++k);
});
完整的代码
浏览 4提问于2020-08-11得票数 1
回答已采纳
8回答
我有一段创建(使用D3.js)包含图表的svg元素的JavaScript代码。我希望使用AJAX基于来自web服务的新数据来更新图表，问题是每次单击更新按钮时，它都会生成一个新的svg，因此我希望删除旧的或更新其内容。
下面是我在其中创建svg的JavaScript函数的一个片段
var svg = d3.select("body")
.append("svg")
.attr("width", w)
.attr("height", h);
如何删除旧的svg元素或至少替换其内容？
浏览 557提问于2012-05-28得票数 220
回答已采纳
3回答
jquery外部的DOM操作
、、、、
我在相同的脚本中使用Jquery和D3.js。我有一个使用D3.js修改的svg元素。然后，当我使用Jquery在这个元素上进行选择时，我看不到D3.js所做的修改。
开头的DOM：
<svg>
<g id="myId"></g>
</svg>
使用D3.js修改后的DOM：
<svg>
<g id="myId" transform="translate(10, 10)"></g>
</svg>
然后：
$("#myId").a
浏览 37提问于2016-08-26得票数 0
回答已采纳
我有一个带有AngularJs指令的HTML标记，比如：
<div line-chart></div>
它调用一个生成SVG对象及其相对子元素的指令。用于创建子元素的函数：
function drawDataPoints(params){
function drawDataPointCircles() {
var dataPointAttributes = {
'class': 'data-point negative'
};
params.svg.selectAll('circle d
浏览 2提问于2015-02-11得票数 0
回答已采纳
1回答
我正在尝试用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
浏览 4提问于2013-05-23得票数 2
回答已采纳
我正在尝试在google datastudio中设置散点图，而传统的d3.js在google data studio可视化js文件中不起作用。我已经能够加载圆，但是我正在努力使用d3.js代码在比例上绘制圆。 如何使用下面的d3.js代码在google data studio中工作 xScale = d3.scale.linear().range([0, width]),
xAxis = d3.svg.axis().scale(xScale).orient("bottom"); 我已经能够使用下面的代码获得数据并绘制圆圈，但是缺少比例和轴。 /// create a titl
浏览 22提问于2019-05-14得票数 0
1回答
我对D3.js还不熟悉，我一直在关注。
我不明白为什么circle.style(“填充”、“钢蓝色”)、下面的不起作用；但是如果将样式行放在circle.enter().append(“圆圈”)之后，则可以填充所有圆圈的颜色。据我理解，样式是全局的，应该应用于所有的圆圈，或者至少在下面的代码中影响html中的现有圆圈。
//js
var svg = d3.select("svg");
var circle = svg.selectAll("circle").data([32, 57, 112, 293], function(d) { return d; });
浏览 2提问于2015-08-23得票数 0
回答已采纳
当前用于在网络浏览器中制作“交互式svg”的库实际上是使用javascript来动态地操纵页面中的SVG对象，但是实际上并没有在svg标签本身中嵌入使svg动画化所需的完整的javascript。像d3.js，protovis，svg.js等库。 但是也可以创建独立的交互式SVG，例如Brendan Gregg的flamegraph工具，例如：http://www.brendangregg.com/FlameGraphs/cpu-bash-flamegraph.svg 有没有办法在网页中创建一个独立的、交互式的SVG？当然，您可以生成交互式SVG服务器端(例如，Brendan使用Perl库来
浏览 7提问于2019-09-07得票数 1
回答已采纳
我正在尝试这样做(也是在)：
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.js?1.27.2"></script>
浏览 4提问于2012-01-30得票数 64
我正在制作一张地图，上面的气泡代表推特。每隔一段时间，我就会问服务器上是否有新的tweet，使用d3.json，它会返回新tweet的位置。
我绑定这个数组，只包含使用selectAll.()data()的新位置，并期望它们在每个新请求的enter()部分中使用新的数据。但是我只去过一次，虽然数据连接看起来很有效。
我在我创建的svg组中添加所有内容，如下所示：
bubbleGroup = svg.append("g").attr("class", "bubble");
然后，我以下列方式添加圆圈：
var circlesSelection
浏览 0提问于2015-03-09得票数 2
回答已采纳
我想在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_
浏览 10提问于2016-05-12得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
