dc.js Scatter Plot with Vertical Brush - dc.js

We are preparing to upgrade our application from dc.js v2 & d3.js v3 to the latest code dc.js v3.0.6 and d3.js 5.6. 18 months ago as we were getting with dc.js we developed our own vertical brushing for the scatter plot.
I was interested when I notice dc.js v3 coordinateGridMixin had a new method brush([]). I saw all the notes and cautions, but was hoping it would be simple to use just a vertical brush on the scatter plot by defining
.brush(d3.brushY())
So now the scatter plot only allows vertical brushing visually, but of course errors occur because scatter plot is expecting 2 dimensional brushing by default and it has override coordinateGridMixin brushing code.
What is the best ay to approach my requirement to only allow vertical brushing on a scatter plot?

Related

How to set zooming options for pyramid chart of Amcharts

I am not able to have zoom in option in pyramid chart of Amcharts . I didn't find any inbuilt attribute as well. Is it possible to have zoom in and zoom out for pyramid charts in Amcharts

In nvd3.js is there any direct option for displaying polylines for Pie/Donut Chart with labels outside the arcs

Refer Animated Donut Chart with Labels, Legend and Tooltips created using d3.js
I don't see any option for creating a Pie/Donut Chart with polylines for marking labels outside the arcs as per the official documentation.
Also it will be great if we can fill the line stoke with same color as that of the point as shown here.

How to draw horizontal stacked area chart by ios-charts

I am using iOS Charts by Daniel Gindi.
I need to draw horizontal stacked area chart (Example). But I cannot find similar charts in examples of the library. I am trying to customise Horizontal Bar Chart like in example. But I cannot to avoid square corners.
How can I draw line instead of bars with squared corners?
Is it possible in this library or I should use another one?
Yes you can.
Use line chart instead ,and set drawFilledEnabled to true.
But the filled area is between line and x axis, so you may need to rotate the chart.

d3 v4 zooming line without scaling up/down svg line elements

I'm porting a D3 v3 graph widget that uses panning and zooming to v4 and got stuck on the zooming changes. The zooming API in v4 uses a different model where zooming is managed on the elements rather than a general zoom transform.
I have a lot of datapoints that get plotted on a timescale that initially intentionally clumps the datapoints very close to each other, and the user can use zooming to drill deeper into the data for more detail. In v3 when zooming in the svg line automatically adjusted with the new scale however in v4 when applying zoom scaling on the svg line I get an increases the thickness of the svg line elements rather than resolving more detail (and keeping the line thickness constant). I have no problems with scaling the x or y axis.
This behavior is expected with a scale function but not what I want. I've read the new API for zoom and can't work out what zoom function to use that would give me v3 behaviour where zooming in shows more detail in the line graph and doesn't scale up the line thickness.
In v3 D3 would zoom the svg line with the following in the zoom event handler, however this won't work in v4.
chart.select("#seriesLine" + i).attr("d", series[i].d3Line(series[i].data))
Its been a while since I wrote the original graphing widget so possibly I'm just not remembering how to setup D3 correctly, but I think I'm just not groking the new zoom function, and there are no similar zoom examples to learn from.
Any tips?

Zoomable scatter chart

In Qlikview 11 I managed to set up (amongst others) a nice scatter chart without any major problems. Now I would like to be able to zoom into a region in that chart. Intuitively this could be accomplished by selecting a rectangular region with the mouse. Incidentally this works fine in "regular" line or bar charts. The new x and y axis regions correspond to the selected rectangle. However this does not happen with my scatter chart. I suspect this has something to do with the way dimensions are handled in scatter charts. For easier understanding I appended to screen-shots of the status quo - or how I don't want it to be.
Full chart with selected region http://img801.imageshack.us/img801/4873/6ccc.png
Chart displaying only the selected data http://imageshack.us/a/img138/9053/kck5.png
From what it looks like, I would guess that the scatter plot has hard coded axis max and mins. Check the "Axes" tab under chart properties, and uncheck the scale boxes. That should allow the chart to zoom in.

Resources