How can I have multiple fills within the same d3 arc - css

I'm trying to do something like this:
In d3.js. I can draw the donut chart fine but I'm struggling on how I can have multiple colors within an arc. Is there a way I plot multiple arcs within the same arc and style them independently?

Rather than putting multiple colors within a single arc, I would recommend having a single arc for each color. This way, if your data changes, you can just change the lengths of each arc, rather than changing the gradient you're using.
A good example of this is here: d3 gallery donut chart

Related

Cicular contour map using Plotly

I am trying to create contour plots of film thicknesses on a wafer using plotly, but would like the outputted plot to be a circle since it is a wafer instead of the default square. Do I have to somehow overlay a circle on to the plot and then exclude anything outside of it after the plot is generated? I prefer using plotly if possible since it looks nice. I've tried using ggplot as well but for some reason my data doesn't work with it since the x and y coordinates are apparently irregularly spaced. I've searched around but have not seen any results at least using R.
Thanks!

Coloring markers in a scatter plot according to RGB values with Plots.jl

I have been looking for a way to color markers in a scatter plot without creating an entire new series for every point. Is there a way to color them individually with different RGB values for each?
a single color gradient (the solution to the question asked in:
How do you color (x,y) scatter plots according to values in z using Plots.jl?)
is not what I´m looking for. Maybe if I could overlap 3 gradients, one for each RBG color, that could work. Thanks.
As Fredrik said, you can pass a vector... it's pretty flexible, and if your vector is too short it should cycle.
using Plots
scatter(sin, c=[:red, colorant"blue", RGB(0,1,0)])

Select objects within an area using d3

I am currently creating a tool which displays graphs and then I want to perform statistical analysis on a select set of nodes in each graph.
Is there a way to detect which nodes are contained by the red area (see image) using d3.js. I understand I could use the coordinates for the rectangle as draw but I would like to implement more arbitary shapes.

images ds3.js heatmap

I am having trouble determining if you can create a heatmap with DS3 or R that can map onto a list of icons. Specifically wanted to use little people icons like these http://goo.gl/Yt8CG and then show concentrations of activity onto them. I am fairly new to data visualization with DS3.js and R so I might not be doing the right google-fu. Thanks ahead of time if anyone can show me an example or let me know if you CAN do shading on icons not just dynamically generated blocks like http://bl.ocks.org/mbostock/4063318
The basic approach is no different from drawing a normal heatmap (see for example here). The only difference would be that instead of appending rectangles, you append a container for the graphic that you want to use.
Whether you would be able to adjust the shading depends on the graphic itself -- if it's a bitmap you're out of luck. If it's an SVG for example you can simply select the path inside that SVG and set the fill color just like you would for a rectangle in a normal heatmap.

Create area line graph that colors in-between series?

I am trying to create a new Area Line Graph that colors the space in-between the two lines, but for some reason I cannot accomplish this. The default behavior is to color the area from the series to the x-axis. Is there a way that you can only color in the space between the two series instead?
I am trying to mimic the behavior, but with HighCharts, here: https://confluence.atlassian.com/download/attachments/185729594/report_chart_created_vs_resolved_report.png?version=3&modificationDate=1354064895573&api=v2
I think you need to use the area range chart type: http://www.highcharts.com/demo/arearange

Resources