d3v4

How can I implement an invert function for a point scale?

由 走远了吗. 提交于 2019-12-01 18:03:31
问题 I am trying to add a tooltip for my dual line chart graph. However, instead of using timeScale or scaleLinear, I used scalePoint to graph my chart. I am trying to achieve the following effect: https://bl.ocks.org/mbostock/3902569 this.x = d3.scalePoint().range([ this.margin.left, this.width - this.margin.right ]); this.xAxis = d3.axisBottom(this.x); this.x.domain( this.dataArray.map(d => { return this.format(d[ 'year' ]); })); Here is my mouseover function, function mousemove() { //d3.mouse

Uncaught TypeError: Cannot read property 'linear' of undefined

由 霸气de小男生 提交于 2019-11-30 12:23:47
问题 I'm new to D3 and getting the following error in my demo script - FirstD3.jsp:31 Uncaught TypeError: Cannot read property 'linear' of undefined My demo code is as follow <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="https://d3js.org/d3.v4.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <title>Linear Scales</title> <style type="text/css"> </style> </head> <body> <script type="text/javascript"> var dataset = [ [ 5,

Uncaught TypeError: Cannot read property 'linear' of undefined

由 最后都变了- 提交于 2019-11-30 02:35:00
I'm new to D3 and getting the following error in my demo script - FirstD3.jsp:31 Uncaught TypeError: Cannot read property 'linear' of undefined My demo code is as follow <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="https://d3js.org/d3.v4.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <title>Linear Scales</title> <style type="text/css"> </style> </head> <body> <script type="text/javascript"> var dataset = [ [ 5, 20 ], [ 460, 90 ], [ 250, 50 ], [ 100, 33 ], [ 330, 95 ], [ 410, 12 ], [ 468, 44 ], [ 25, 67 ], [ 85,

D3 transition looping throwing Uncaught TypeError: t.call is not a function

由 烈酒焚心 提交于 2019-11-29 05:43:35
Very new to D3 and relatively new to JS in general. I am trying to create a circle on click, and that circle once created needs to repeatedly pulsate forever. Right now, it is being created properly and it does the transition one time, but then it sort of dies due to the error. Here is my code: var shapesAtt = shapes // omitted: assigning fill, position, etc; working as intended .on("click", circleMouseClick); function circleMouseClick(d, i) { createPulse(this); } function createPulse(focusElement) { // takes in "focal circle" element // some things here are hard coded for ease of reading //

D3.js - Cannot read property 'axis' of undefined

由 有些话、适合烂在心里 提交于 2019-11-29 01:44:03
问题 Here is my code snippet: var xScale = d3.scaleLinear().range([MARGINS.left, WIDTH - MARGINS.right]).domain([scaleMin, scaleMax]); var yScale = d3.scaleLinear().range([HEIGHT - MARGINS.top, MARGINS.bottom]).domain([minValue,maxValue+numberOfSignals*300]); xAxis = d3.svg.axis().scale(xScale); yAxis = d3.svg.axis().scale(yScale).orient("left"); vis.append("svg:g") .attr("transform", "translate(0," + (HEIGHT - MARGINS.bottom) + ")") .call(xAxis); vis.append("svg:g") .attr("transform", "translate(

D3 transition looping throwing Uncaught TypeError: t.call is not a function

由 瘦欲@ 提交于 2019-11-27 23:13:30
问题 Very new to D3 and relatively new to JS in general. I am trying to create a circle on click, and that circle once created needs to repeatedly pulsate forever. Right now, it is being created properly and it does the transition one time, but then it sort of dies due to the error. Here is my code: var shapesAtt = shapes // omitted: assigning fill, position, etc; working as intended .on("click", circleMouseClick); function circleMouseClick(d, i) { createPulse(this); } function createPulse

How to set the origin while drag in d3.js in v4 [duplicate]

由 生来就可爱ヽ(ⅴ＜●) 提交于 2019-11-27 03:18:48
问题 This question already has an answer here: d3 version 4 workaround for drag origin 1 answer I am facing a jump issue when I drag a <rect> . In this question they suggest to use drag.origin() but D3 v4 version doesn't have this method anymore. Can some body suggest how to solve the jump issue? 回答1: Instead of origin use subject . So this .origin(function() { var t = d3.select(this); return {x: t.attr("x"), y: t.attr("y")}; }) will become .subject(function() { var t = d3.select(this); return {x:

Replacing d3.transform in D3 v4

由 南笙酒味 提交于 2019-11-26 13:43:15
In D3.js v4 the d3.transform method has been removed, without any hint about how replacing it. Does anyone know how to replace the following D3.js v3 instruction? d3.transform(String).translate; altocumulus Edit 2016-10-07: For a more general approach see addendum below. According to the changelog it is gone. There is a function in transform/decompose.js , though, which does the calculations for internal use. Sadly, it is not exposed for external use. That said, this is easily done even without putting any D3 to use: function getTranslation(transform) { // Create a dummy g for calculation

Replacing d3.transform in D3 v4

由 眉间皱痕 提交于 2019-11-26 03:41:03
问题 In D3.js v4 the d3.transform method has been removed, without any hint about how replacing it. Does anyone know how to replace the following D3.js v3 instruction? d3.transform(String).translate; 回答1: Edit 2016-10-07: For a more general approach see addendum below. According to the changelog it is gone. There is a function in transform/decompose.js, though, which does the calculations for internal use. Sadly, it is not exposed for external use. That said, this is easily done even without
订阅 d3v4