d3.js

d3.js filter from csv file using multiple columns

夙愿已清 提交于 2020-01-01 04:53:11
问题 I want to filter using multiple column values from csv. I first want to filter by city and then criticality columns. I would like to filter Criticality (high/medium/low). How to filter using AND/OR ? City and Criticality are checkboxes and based on the selections i want to filter the data from the respective csv columns. looking at efficient way of filter. Can i have something like (d["Criticality]=="High" || d["Criticality"]=="Low") currently this is what i am doing: var City="London"; var

Is there a tap and double tap event in d3.js force directed graph

放肆的年华 提交于 2020-01-01 04:43:22
问题 I am working on a force directed graph using d3.js. I need to handle tap and double tap event on nodes for mobile devices. Mouseover and click functions need to replicated as tap and double tap in d3.js. I have managed to get a touch event working but have no clue on how to capture double tap event in a mobile device. 回答1: D3 has the touches event and using this you can get touch position coordinates from inside your event handler, but this doesn't give you any special handling for or help

d3 autospace overlapping tick labels

一曲冷凌霜 提交于 2020-01-01 04:35:08
问题 Is there a way in d3 to not draw overlapping tick labels? For example, if I have a bar chart, but the bars are only 5 pixels wide and the labels are 10 pixels wide, I end up with a cluttered mess. I'm currently working on an implementation to only draw the labels when they do not overlap. I can't find any existing way to do that, but wasn't sure if anyone else had dealt with this problem. 回答1: There is no way of doing this automatically in D3. You can set the number of ticks or the tick

Cannot select SVG foreignObject element in d3

自古美人都是妖i 提交于 2020-01-01 04:19:05
问题 I'm working with a d3 force-directed layout with HTML node labels implemented with SVG foreignObject elements. I'd like to select these elements at various times to update their positions and other properties (and track them as they are created and destoryed with enter() and exit() ), but I don't seem to be able to select them like other SVG elements. Here is a compact example: HTML: <html> <head> <title>Cannot Select SVG Foreign Object</title> <script src="http://d3js.org/d3.v2.js"></script>

d3.js visualization on android 2.3

会有一股神秘感。 提交于 2020-01-01 03:25:08
问题 I know that the android browser for 2.3 does not support SVG, but I'd like to know whether I could convert a d3.js SVG Visualization to a canvas using Canvg on clientside. Is the browser able to parse SVG elements at all, or would this transformation from SVG to Canvas need to happen server side? Thanks in advance! // Grab data from server... var btoken = window.location.search.split( 'bearer_token=')[1].split('&')[0]; var endpoint = "http://dcaps-staging.media.mit.edu:8080/api/reality

D3.js - Is it possible to animate between a force-directed graph and a node-link tree?

北慕城南 提交于 2020-01-01 03:02:07
问题 I am using the D3.js library and looking at the force-directed graph demo: http://mbostock.github.com/d3/ex/force.html I am also looking at the node-link tree: http://mbostock.github.com/d3/ex/tree.html What I would like to do is: - Start with the force-directed graph and when the user clicks on a node, have it animated smoothly into a tree, with the selected node in the center. - Then, when the user clicks on any empty space in the canvas, it should animate back to the force-directed graph.

d3.js chart area filling with different colors

江枫思渺然 提交于 2020-01-01 02:33:28
问题 I'm attempting to fill the area under the graph with different colors, depending on x value ranges, say for example, for x values 0 to 10 yellow, from 10 to 20 red and so on. Is there a way to do that? My javascript for single fill color is var m = 80; var w = 900 - 3*m; var h = 600- 3*m; var x = d3.scale.linear().range([0, w]); var y = d3.scale.linear().range([h, 0]); x.domain(d3.extent(data, function(d) { return d.time; })); y.domain(d3.extent(data, function(d) { return d.points; })); var

d3.js : d3.min.js:1 Error: <path> attribute d: Expected number, “MNaN,NaNLNaN,NaN”

六月ゝ 毕业季﹏ 提交于 2020-01-01 01:16:36
问题 I imported a csv file and tried to map the info on d3. I guess I have scaled everything properly. Can anyone help me out and guide me through this? I get the following error: d3.min.js:1 Error: <path> attribute d: Expected number, "MNaN,NaNLNaN,NaNL…". The data in the csv file is like this: ------------------------------------------ | 00:00:01 | 1 | ------------------------------------------ | 00:05:01 | 2 | ------------------------------------------ | 00:10:01 | 3 | -------------------------

Adding nodes dynamically to D3 Force Layout in version 4

懵懂的女人 提交于 2019-12-31 22:41:13
问题 I am trying to implement a simple force layout in which nodes (without links) can be dynamically added and removed. I was successful in implementing the concept in D3 version 3, but I am unable to translate it to version 4. After adding and updating nodes the simulation freezes and incoming circles are drawn in the upper left corner of the svg. Does someone knows why this is the case? Thanks for any help :) My concept is based on this solution: Adding new nodes to Force-directed layout

Show d3 node text only on hover

我的梦境 提交于 2019-12-31 19:51:13
问题 I'm trying to only show the node text on mouseover. When I mouseover the node, I have the opacity for the svg circle changing, but only the text for the first node showing up. I've figured out that this is because of how I'm using the select element, but I can't figure out how to pull the correct text for the node that I'm hovering on. Here's what I currently have. node.append("svg:circle") .attr("r", function(d) { return radius_scale(parseInt(d.size)); }) .attr("fill", function(d) { return d