I'm currently working with highcharts to generate a chart that has several pie charts inside. So basically a data set that has 3 or 4 series, each with their own name and data. The charts render perfectly, and now I would like to place the series name above each pie in the chart. The only way I can see to do this is with the label property. The issue that I'm having is that the series are positioned within the chart with percentages. A series looks like:
series: [
{
name: 'series name',
data: [25, 25, 50],
center: ['33%']
}
]
So now I want to apply a label to that series, but I'm having issues deriving what the "style" property should be set to. using the series center (which I was hoping would position the label directly over the series pie) doesn't seem to work.
Any ideas?
Related
I'm using c3js charts and having problems with a donut/pie chart.
One data value is very small compared to the others in the chart and this is causing the arc to fill the chart completely.
This is a simple example that has the issue:
var chart = c3.generate({
data: {
// iris data from R
columns: [
['data1', 1000000000],
['data2', 1],
],
type: 'pie'
}
});
jsfiddle here: https://jsfiddle.net/ahill/44yha98s/10/
data2 is filling the chart, whereas it should be data1 that fills it.
Decreasing the value of data1 'fixes' it so it's something to do with the ratio between the two data items.
Any suggestions greatly appreciated.
Thanks
I am trying to make a dynamic chart in icCube, in which bubbles are sized and colored in accordance with a specific data field in the MDX result set.
Example MDX result set:
(the x/y coordinates have been removed for the sake of simplicity):
amount color bullet size
Swiss 100 #0000FF 10
Spain 120 #FF0000 12
NL 70 #00FF00 7
I do not know how to do this now in the amChart widget in icCube, but I know it is possible to do this in amCharts itself. You can set for example the following attributes in the amCharts editor:
Alpha field, Bullet field, Bullet size field, Description field, Fill colors field, Label color field, Line color field, ... etc (see for more in the amCharts live editor).
Enclosed a sample chart with two series, in which one has colored bubbles:
example
Is it possible in icCube web reporting to do this, and if so, how?
Yes it is possible:
The table should look like this:
In your amCharts bubble widget, add the following in Graph:
"colorField":"color" //the name of the column that contains the colors
and set use mdx colors to "no".
I named my colorField "kleur". Any value here is possible, but it has to be the same as the column name that contains the colors.
Yes you can, just you have to write the following into the "Extra Options" field:
:{
graphs:[{
xField: "your_x_field",
yField: "your_y_field",
valueField: "amount",
bulletSizeField: "bullet size",
bullet : "round",
colorField: "color"
}]
}
Note that, your graphs defined above will be overwritten by this one, you have to specify here all the graph settings.
I have a Kendo UI (Telerik) bar chart with long label names. When I set the label rotation to anything outside of 0,180,90,360 the labels slant but they use the center of the text as the slant point instead of the start of the text. This causes all the labels to be off by a full bar.
http://snag.gy/m2XxJ.jpg
Is there a way to get the chart to use the start of the label as the rotation point instead of the center?
The only way I've gotten the labels to line up properly when using rotation, is to also set the padding.
Sample categoryAxis
categoryAxis: { field: 'name', labels: { rotation: -60, padding: { right: 10 }}}
JSbin sample http://jsbin.com/zoloc/1/edit
Kendo Documentation http://docs.telerik.com/kendo-ui/api/dataviz/chart#configuration-categoryAxis.labels.padding
You can use both rotation and margin to arrange the category axis text like this,
.CategoryAxis(axis => axis
.Categories(model => model.StudentName).Labels(labels => labels.Rotation(330).Margin(-5,45,0,0).Visible(true))
.MajorGridLines(lines => lines.Visible(false))
.Line(line => line.Visible(false))
)
Response from Telerik:
You have a valid point. Excel for example rotates the text around its left edge.
We'll look into this issue, but for the moment I can only suggest the multi-line option in the upcoming Q2 release.
You'll be able to split the labels by using a new-line character:
categories: ["J.R. SIMPLOT\nCOMPANY", ...]
I have a pie chart generated by nvd3, but it has too many slices.
By clicking legend, we can control the slice display or not, I want top 10 (by count) of the chart slices show by default, and others hide (by clicking legend, they can be added to pie chart).
Can I do this in nvd3?
Finally, I complete this by transforming my data:
[{
'x': 10,
'y': 1,
'disabled': true,
}]
set the disabled attribute to true.
I am using kendo UI dataviz charts to display data that has text(symbols) on x-axis and a numerical value on the y-axis. I have serverside datasource that provides the data. How can I achieve this?
I tried to use Scatter charts but they are XY charts and need numerical values on both x and y axis. I can display the data as a linecharts which are categorical but the line connecting the markers is meaningless in my case and I don't need that displayed.
here's an example of my data
var data = [{id:"1", number:"1.23", label:"A"},{id:"2", number:"4.11", label:"B"}]
You could use simple line chart and set
markers visible
series.opacity to 0
series: [{
field: "value",
type: "line",
opacity: 0,
markers: {
size: 5,
visible: true,
}
}]
http://docs.kendoui.com/api/dataviz/chart#configuration-series.opacity