dc.js

问题 My data looks like this field1,field2,value1,value2 a,b,1,1 b,a,2,2 c,a,3,5 b,c,6,7 d,a,6,7 I don't have a good way of rearranging that data so let's assume the data has to stay like this. I want to create a dimension on field1 and field2 combined : a single dimension that would take the union of all values in both field1 and field2 (in my example, the values should be [a,b,c,d] ) As a reduce function you can assume reduceSum on value2 for example (allowing double counting for now). (have

问题 I'm trying to figure out of how to get a screenshot the whole web page. I'm working on a dashboard using 20 plus dc.js charts, cross filters all of them, and i'm using JSP. Client want to have a button where a user clicks and it will screen shot the whole web page. I'm running it through java because we have to use IE11 as our standard and all other js libraries such as HTML2canvas.js didnt work (it doesnt display the dc.js charts) though it sort of works on Chrome but we have to use IE11

问题 I'm using the following code in a series chart renderlet to get a D3 tooltip. lines.on('renderlet', function(chart) { chart.selectAll('g.x text') .attr('transform', 'translate(-29,30) rotate(315)') chart.selectAll('circle') .on("mouseover", function(d) { d3.select(this) .transition() .duration(500) div.transition() .duration(200) .style("opacity", 0.9); div.html("<table><thead><tr><th colspan='2' class='toolHead'>" + d.data.key[1] + '</th></tr></thead><tbody>' + '<tr style="margin-top: 100px"

问题 I'm working on a barchart from dc.js. I'm having trouble providing a tooltip or a title on the labels X axis. The reason why I need axis tooltips is that I added a feature to text labels that reaches a maximum length and it will apply the '...' into it. The tooltip will help the users to view the full text of that X axis Text labels. Here are the following that i have done but it didnt work. I use chart.selectAll(g.x text) **or .text and add an .on('mouseover', ...) function which that didn't

问题 How can we control the elasticY recalculation of the Y axis range, on a scatter plot, to be bound by the brushes Y range? Thus if a scatter plot has a brush bounded on the Y axis between [6-8) and the elasticY recalculates the new Y axis range to be [3-7] we would like the new Y axis range to be [3-8], because if it used 7 the top part of the brush would be off the screen. .elasticY(true) A jsfiddle example. Brush the 1st scatter plot x=8, y=[6,9) "Around the two dots". Everything looks good.

问题 Attempted to follow this example Customize dc.js date x-axis here: https://codepen.io/rdavi10471a2/pen/EeYYGB as follows: function calc_ticks(chart) { var ticks = d3.timeMonths(chart.xAxisMin(), chart.xAxisMax()); console.log("min: "+chart.xAxisMin()+' Max:'+chart.xAxisMax()) console.log("ticks") console.log(ticks) chart.xAxis().tickValues(ticks); } Initial rendering is correct but when you use the dc.js filter to filter to a single year the x axis does not render correctly. January for the

问题 I am new to dc.js and facing issues in deciding dimensions and groups. I have data like this this.data = [ {Type:'Type1', Day:1, Count: 20}, {Type:'Type2', Day:1, Count: 10}, {Type:'Type1', Day:2, Count: 30}, {Type:'Type2', Day:2, Count: 10} ] I have to show a composite chart of two linecharts one for type Type1 and other for Type2. My x-axis will be Day. So one of my dimensions will be Day var ndx = crossfilter(this.data); var dayDim = ndx.dimension(function(d) { return d.Day; }) How the

问题 I am attempting to detect click on line chart datapoints. Per this answer ( dc scatter plot binding onClick event ) I am attempting to use the pretransition event as described, but I must be missing something. lineChart.on('pretransition', function() { lineChart.selectAll('path.symbol').on('click', function(d) { alert('value: ' + d); //How would I pop-up the datapoint values? }); }); jsFiddle example 回答1: Each chart uses different elements and classes for its diagrams. This is currently not

问题 I have a table. year,continent,state,export_value,import_value,all 2013,Африка,Angola,94061754,220518.54,94282272.54 2013,Африка,Burundi,4136818,1239175.91,5375993.91 2013,Африка,Benin,3251643.49,65421.6,3317065.09 I need to make a pie chart using dc.js: Here is what I tried: impexDim = ndx.dimension(function (d) {return ((d.export_value > 0 ? 'Export' : 'Import') && (d.import_value > 0 ? 'Import' : 'Export')) ;}), groupeimpexDim = impexDim.group().reduceSum(function(d) {return +d.all}), How

问题 This is my datetime barChart. When I use a fiddle (see here) to try and replicate the issue, it works as intended. NB : The data takes a while (~30sec) to load from github. Here is the code for the graph : pnlPerDaybarChart .height(300) .width(700) .dimension(dims.date) .group(groups.date.pnlSum) .valueAccessor(function(d) { return Math.abs(d.value); }) .renderTitle(false) .x(d3.time.scale().domain([minDate,maxDate])) .xUnits(d3.time.days) .colors(colorChoice) .colorAccessor(function(d) { if