-
2 votesanswersviews
我们如何使用html5和javascript在画布上缩放/平移图形？
在画布网格上，我绘制了正方形并在该正方形上创建了一个圆 . 但是当我点击缩放按钮然后画布网格，方形和圆形变焦 . 我只想缩放画布网格和正方形而不是点/圆，点/圆需要根据比例平移其位置 . 面对重新缩放圆圈并根据缩放进行翻译的问题 . 类似于谷歌 Map 想要实现缩放和平移功能 . 我得到了参考http://bl.ocks.org/stepheneb/1182434 . 但我不想使用d3.js. 参... -
111 votesanswersviews
快速响应的交互式图表/图表：SVG，Canvas，其他？
我正在尝试选择合适的技术来更新项目，该项目基本上可以在可缩放的可缩放图形中渲染数千个点 . 使用Protovis的当前实现表现不佳 . 看看这里： http://www.planethunters.org/classify 完全缩小时大约有2000个点 . 尝试使用底部的手柄放大一点，然后将其拖动到平移处 . 除非你有一台真正快速的计算机，否则你会发现它非常不稳定，你的CPU使用率可能在一个核心上... -
2 votesanswersviews
如何在React组件中获取d3以在Jest快照中呈现
我想在我的react组件中测试我的d3代码，但我目前无法简单地在Jest快照中进行渲染 . 任何人对如何使用Jest完成此任务有任何想法？它在我运行应用程序时渲染得很好 . 这是反应组成部分： BarChart.js import React, { Component } from 'react' import * as d3 from 'd3' class BarChart extends Co... -
8 votesanswersviews
$ location使用d3.js在AngularJS中不起作用
这是我第一次遇到这个问题，可以使用d3创建一个icicle chart . 有一个点击事件正在触发并调用changePath（） . 我看到控制台日志，这意味着我有权访问$ location.path，但是当我尝试设置它时没有任何反应...不是新页面没有错误页面没有...如果我不't change paths via angular my router won't保持范围是我正在寻找什么...任何... -
0 votesanswersviews
d3 - 画线n次
我有一条使用 d3 绘制的垂直线 . 假设我想像条形码一样多次重复该行 . 我该怎么做？ 我知道必须使用 for 完成，但我对如何做到这一点没有任何线索 . 建议将非常有帮助 . FIDDLE 这是代码： var height = 500; var width = 500; var svgContianer = d3.select("body") ... -
1 votesanswersviews
无法创建SVG组
使用d3.js，我正在尝试创建一系列SVG组（即 <g> 元素），并为数据数组中的每个数字添加 <g> 元素 . 每个 <g> 元素本身应包含 <rect> 和 <text> . 以下代码在我看来应该这样做，但是当我检查 <svg> 元素（在Chrome和Firefox中）时，它直接在 <svg> 元素内包含 &... -
0 votesanswersviews
D3 JS在Circle旁边显示文本
我是D3的新手，我正在尝试修改一些示例代码 . 我可以显示地理 Map ，将其限制在美国，为我想要表示的每个城市绘制圆圈，但我无法弄清楚如何在这些圆圈旁边显示文字 . 当我检查页面时，我可以看到D3在路径中创建了一个子元素，它具有城市的名称，但我似乎无法使其显示 . 任何帮助是极大的赞赏 . 这是我正在使用的代码： .states { fill: #ccc; stroke:... -
1 votesanswersviews
使用间隔更新d3数据
我是D3新手 . 我正在尝试使用setInterval每5秒更新一次数据以更新我的数据数组 . 我想只在数据上运行间隔，而不是我的整个D3代码 . 此外，我只想在间隔运行后将新添加的索引附加到数据，同时将先前添加的间隔数据保留在图表上 . 小提琴会很棒 . 谢谢 //DATA// $scope.reg = data; var rate = parseInt($scope.reg)... -
0 votesanswersviews
与页面中的多个图表交互
如果我有多个图表，请在页面上显示堆积条形图和饼图 . 我想在其中一个上进行交互（例如点击），并在另一个图表上看到一些视觉更新 . 我尝试使用FusionCharts以下列方式创建它们： FusionCharts.ready(function() { var pieChart = new FusionCharts({ type: 'pie2d', renderAt: 'pieCo... -
3 votesanswersviews
使用Nuxt / Vue加载D3
我正在尝试在我使用Nuxt构建的应用程序中实现D3 . 我已经使用 import * as d3 from 'd3' 将其成功导入到 <script> 部分的视图中，但是由于缺少浏览器，因此应用程序正在呈现服务器端D3 's functionality doesn' t工作（即 d3.select(...) ） . 在Nuxt plugin documentation中它建议了一个仅限... -
0 votesanswersviews
D3js中堆积的条形图 - 条形图不在正确的位置
我正在尝试在D3js中构建一个堆积条形图 . 我有问题设置正确的 y 和 y0 属性并在正确的位置绘制条形图 . 可能我有一个计算错误，但我找不到它 . 这是示例代码的链接FIDDLE场景是： 我首先按"period"对数据进行分组，并在xAxis上显示句点 然后我按"type"分组 - MONTH和ENTRY应该是不同颜色的堆叠条 . 每个周... -
0 votesanswersviews
如何使用Angular CLI将d3或任何模块添加到角度2？
嗨，我是角度2的新手 . 我正在尝试使用角度cli将d3库注入角度2 . 我使用npm install d3安装了d3 . 我按照链接 https://github.com/angular/angular-cli/wiki/3rd-party-libs 我按照步骤 `我的angular-cli-build.js . var Angular2App = require（'angular-cli / ... -
2 votesanswersviews
D3.js中的array_replace？
我有2个CSV文件，一个描述树的链接（graph.csv - 2列：源和目标），另一个是节点名称的字典（nodes.csv - 2列：node_id，node_name） . 包含源/目标的CSV引用第二个CSV中的node_id列 . 现在我想使用第二个CSV将节点名称（以及最终的其他属性）附加到树中的节点 . 我已经想出了如何将文本附加到节点，但我无法弄清楚如何在第二个CSV中将数据作... -
70 votesanswersviews
如何将工具提示添加到svg图形？
我有一系列的svg矩形（使用D3.js），我想在鼠标悬停时显示一条消息，消息应该被一个充当背景的框包围 . 它们应该彼此完美地对齐并且与矩形（在顶部和居中）完全对齐 . 做这个的最好方式是什么？ 我尝试使用"x"，"y"，"width"和"height"属性添加svg文本，然后在svg rect之前添加 . 问题是文本... -
3 votesanswersviews
SVG文本元素text-anchor =“middle”在Firefox中不起作用
我正在使用D3来创建条形图，我想将文本标签对齐到条形图的中间 . 我正在使用text-anchor属性并将其设置为“middle” . 这在Chrome中运行良好，但在Firefox中的对齐方式已经过时了 . 我将rects和text分组在单独的parent g元素中，以便在数据更改时实现一堆不同的转换效果（例如，分割条形图） . 这是我的SVG： <svg width="650&... -
0 votesanswersviews
使用D3根据背景更改文本颜色
我使用D3，js创建了一个简单的条形图，并遇到了文本颜色问题 . 当文本在栏内时它看起来很好，但如果文本太长则变得不可读 . 如何根据红色矩形宽度更改文本颜色（如果文本在矩形内 - 否则为默认颜色 - 其他颜色并使其在Chrome / FF / IE11 / Edge中工作，如果可能的话？ 将文字附加到栏： bar.append("text") .attr('class',... -
0 votesanswersviews
如何根据文本兄弟元素调整svg元素'rect'的宽度？
我有一个svg元素rect同样也包含一个文本元素 . 我使用translate函数来显示文本是否在rect元素中 . 我想相应于文本的宽度更改矩形的宽度 . 如何在d3中的svg中实现这一点？任何帮助都非常感谢 . nodeEnter.filter(function(d: any) { return d.type != 'node--button'}) .app... -
0 votesanswersviews
可视化ThreeJS中的细粒度坐标
我在three.js中可视化UTM / WGS84坐标 . 我的问题是轨迹的粒度非常精细，这意味着我看不出运动行为的任何差异 . 我正在寻找一种干净的方式来绘制一个Space-Time-Cube（X和Y是空间，Z是时间）但是我无法弄清楚如何将轨迹数据投影到我可以实际看到的位置的场景中变化（我规范化了那种有效的数据，但我宁愿选择一种更加花哨的方法） . 我正在从存储在可变数据中的CSV加载轨迹信息 ... -
0 votesanswersviews
D3映射 - 将两个不相交的svg多边形路径组合成一个路径
这是我在工具提示interactive map上的第3个跟进问题 . 原始 Map 使用美国州坐标 . 我正在尝试 Build 一个欧洲 Map （因此我的previous question排除了一些多边形悬停以绘制大陆的物理形状，但仅允许工具提示仅在欧盟成员之上） . 在我的工作中，我最初的灵感来自Peter Collingridge svg tutorial，其中大多数国家多边形在 svg p... -
3 votesanswersviews
如何在NVD3饼图上显示百分比％？
我一直试图在NVD3 Pie Chart上显示百分比，但我不想't see how to do it... I'我正在寻找像this这样的东西 首先，是否有图表选项或方式来显示饼图的每个部分 inside ？如果是，是否有显示百分比而不是确切值的选项？ 谢谢，享受你的周末！ -
1 votesanswersviews
使用Wicked PDF可以很好地导出哪些Web图表库？
我发现了很多关于人们对HighCharts和Flot将他们的HTML / JS / CSS图表用Wicked PDF（Rails gem）导出为PDF的问题，但没有取得很大的成功 . 有没有人成功使用图表库来导出Wicked PDF并且有（相对）头痛的经历？具体来说，我正在寻找制作饼图 . 更一般地说，是否有人知道画布或SVG或页面元素是否倾向于在导出时呈现更好？ -
18 votesanswersviews
在条形图中使用有序刻度（'d3.scale.ordinal'）作为x轴
我有一个这样的数据数组： var data = [{"Alphabet_Type":"a"}, {"Alphabet_Type":"b"}, {"Alphabet_Type":"a"}]; 我在用： dc.js crossfilter.js d3.js 我想创建... -
1 votesanswersviews
对齐条形中心点（DC.JS复合图）
我有一个dc.js复合图表，它有一个序数条形图和折线图 . 条形图值位于左侧y轴上，折线图值位于右侧y轴上 . 是否可以在条形中心（直接在刻度标记上方）对齐线条的数据点？ var oneWayComposite = dc.compositeChart('#chart'); var oneWayBar = dc.barChart(oneWayComposite) .dimens... -
0 votesanswersviews
如何使用dc.js和d3.js显示堆积条形图的值？
Based on this question，我能够使用带有标签的dc.js和d3.js创建条形图 . 但是，我将条形图转换为堆积条形图（基于this documentation），并且我很难显示每个堆栈的标签 . 例如，下图中的每个堆栈都应显示数字，但它显示的是[object Object] 请参阅下面的代码，此处为codepen 使用Javascript var data = [{Categ... -
1 votesanswersviews
基于dc.js复合图表中条形颜色的自定义图例
我实现了一个带有两个条形图的复合图表，其中一个条形图由具有不同颜色条的条形图组成 . 现在，我想创建一个表示每个颜色条的自定义图例（类似于用于饼图的https://dc-js.github.io/dc.js/examples/pie-external-labels.html） . 下面是我到目前为止所做的代码片段： var buttonPress = dc.barChart(composite) ... -
3 votesanswersviews
dc.js渲染条形图
我正在尝试使用dc.js库渲染条形图 . 我的csv数据集的格式如下： q，年，类别，子类别，总数，q1,2010，x，xa，200 q2,2010，y，yb，100 q3,2010，x，xa，300 q4,2010，z，zb，45 q1,2010 ，x，xa，80 q2,2010，y，yb，200 q3,2010，x，xc，301 q4,2010，z，za，205 q1,2011，x，xa，8... -
1 votesanswersviews
dc.js cap序数条形图
dc.js有一个Cap mixin，它允许一个人限制组的数量并显示"others"组中的余数 . 如何访问此行为或排除条形图中的余数？ 我正在使用条形图，因为我想显示带有堆叠数据的前5名 . 例如，排名前十的汽车制造商基于车队和私人销售总额（在单独的堆栈中） . 我正在使用一个函数按照我想要的顺序为x轴动态生成5个序数（即汽车制造商），并且图形几乎按预期生成 . 但是，包含不适... -
0 votesanswersviews
如何区分dc.js geoChoroplethChart中的“0”值和滤出值？
我'm making some dashboard using crossfilter.js, d3.js and dc.js but I' m当数据集的值为"0"时出现问题在仪表板中有一个dc.geoChoroplethChart（），我使用.colorCalculator（）来区分过滤后的值：如果定义了d而不是0使用颜色，否则使用＃666 .colorCalculator(... -
0 votesanswersviews
DC.js条形图的时间数据结构
我正在使用crossfilter.js和dc.js创建一个仪表板，并且有一个图表一直困扰着我！希望有人能提供帮助！见下面的数据结构： Sample Data Structure 我正在尝试制作如下图所示的图表： Desired Chart (Generated in Excel) 我试图避免对Quarters的数据集进行标准化/展平，因为我的记录数量是x4倍（或者更多取决于我们希望显示多少年），并... -
1 votesanswersviews
Atom自动完成ternjs无法正常工作
我有下面的项目结构 . .tern-project内容 { "ecmaVersion": 6, "libs": [ "browser", "jquery" ], "loadEagerly": [ "/bower-components/d3/d3.j...