I have a composite chart that contains multiple line charts. However, many dots (points) overlap, causing only the last added line chart dots to be displayed. When hovering over the keys in the legend, only the lines are brought forward/highlighted, not the dots. So for any line charts with only one point and no line it is impossible to see the location of that point.
My current solution is to give each line chart a different dot radius in increasing order since I know the order in which each line chart will be added to the composite chart and it seems that the order dictates the stacking position of the lines/dots. This ends up looking clunky:
Another, similar, approach I thought of was to set the fill-opacity to 0 and stroke-opacity to 1 for a cleaner presentation, but there is an issue with stroke not being set.
Are there any options/methods I may have missed in the library for handling this case of overlapping points? Thanks!
Related
I have some labels arranged along the outside of a series of arcs (generated by pie charts). These labels are positioned along 'copies' of the pie arcs, which works to fit them nicely, but they unfortunately also cut them off prematurely, as seen in the screenshot below (in this case, an 'i' from the beginning and bracket contents at the end).
Is it possible to tell the text to extend beyond the path's limits? Or failing that, to extend the path itself along its existing course?
edit: The code I'm using to make the arcs is pretty much exactly what's found here: https://www.visualcinnamon.com/2015/09/placing-text-on-arcs.html.
I have the coordinate indicating the start of each letter within a word. I have set the plot function to make a red circle at that coordinate like so:
The problem is that the paper I am adding this image to has a structure of 2 columns per page. And when I add 2 of the above image to the same column, the circles become very small and difficult to notice.
I tried instead of circles to make triangles or pentagrams. I get the same result, they become too small to distinguish.
How can I make this more distinguishable? Especially when its printed in black and white.
You can change the marker size of the markers, and\or overlay two different markers one of the other. For example:
x=1:100;
y=rand(1,100);
plot(x,y); hold on
n=20:20:60;
plot(x(n),y(n),'r+','MarkerSize',30,'LineWidth',2);
plot(x(n),y(n),'ro','MarkerSize',15,'LineWidth',2);
There are many other degrees of freedom you can use to add \ change to this. It is a very basic question that you could have answered yourself if you read the documentation of plot in TMW website.
I'm quite confused and might need help just formulating the question, so please give good comments...
I'm trying to crossfilter some data where each data point has its own sub-dataset that I want to chart and filter on as well. Each point represents a geographic region, and associated with each point is a time series which measures a certain metric over time.
Here's what I've got so far: http://michaeldougherty.info/dcjs/
The top bar chart shows a particular value for 10 regions, and the choropleth is linked with the same data. Now, below that are two composite line charts. Each line corresponds to a region -- there are 10 lines in each graph, and each graph is measuring a different metric over time. I would like the lines to be filtered as well, so if one bar is selected, only one line will show on the line chart.
Moreover, I want to be able to filter by time on the line charts (through brushing) in addition to some other filter, so I can make queries like "filter out all regions whose line value between 9 AM and 5 PM is less than 20,000", which would also update the bar and choropleth charts.
This is where I'm lost. I'm considering scrapping DC.js for this and using crossfilter and d3.js directly because it seems so complicated, but I would love it if I'm missing something and DC.js can actually handle this. I'd also love some ideas on where to start implementing this in straight crossfilter, because I haven't fully wrapped my head around that yet either.
How does one deal with datasets within datasets?
Screenshot of the link above included for convenience:
i am trying to figure out if there is a reasonably easy way to extend NVD3's lineChart model to allow variable stroke widths along each line path in a chart.
specifically, i am dealing with a simple line chart where i need to show the year-on-year growth of employment in different sectors (for which NVD3's lineChart works perfectly), while also giving an idea of the relative weight of these sectors (i.e. agricolture might be growing while employing only a few hundred people overall, while retail might be struggling but still be employing a large percentage of the population) - this won't be a linear scale of course, but assuming that relative weight of each sector varies across time, a thicker line could represent a sector with more employees than one with a thin line.
obviously i could very easily change the stroke width for the whole line using i.e. an average weight of each sector across the whole timespan, but as far as i understand there is no way in SVG to specify a varying width of a single path element: would it make sense to create an NVD3 model that builds on top of lineChart but splits each line into discrete polygons (triangles?) for each year-on-year period?
Looking for an answer to this myself. It seems there is no easy way, but one possibility is to use the stroke-dasharray attribute.
http://owl3d.com/svg/vsw/articles/vsw_article.html
Essentially, you can create a series of cloned paths, covering a range of stroke widths. If you turn them into dash arrays, you can play with the spacing between dashes to control which paths are visible at each point.
Depending on the shape and width you are looking for, you may also be able to fudge it by adding a second path element with a varying offset from the first.
Perhaps generate a closed path and apply a pattern fill or regular fill on that path. The closed path is effectively a triangle shape, to mimic a line of varied width.
What is the best way to prevent overlapping text on coreplot? Especially when some of the slices may be quite small? The overlapping text appears at the bottom, I think that it runs out of space to put it anywhere and thus must pile one label on top of the other.
I could reduce the size of the pie chart, but is there a more elegant way of achieving this?
Mark
Core Plot doesn't do anything about overlapping labels right now. You have to use your knowledge of the data and remove some of the labels that might be too close together.