How can we achieve the Kendo chart combination of Area, Line, and Scatter/Bubble? I had tried a couple of options but I couldn't achieve that in Kendo.
How can we plot the below series in one chart? Is there any option to handle this scenario? or any other plugin/library suggestion?
Line
Area
Scatter/Bubble
Here is the stackblitz - https://stackblitz.com/edit/angular-kendo-chart-line-color-issue-xrwwrk
Related
Consider the Kendo scatter chart HERE in the telerik demos. What I want is to visually separate the chart area with some background colors. As I know Kendo itself doesn't facilitate such configuration.
I'm tring to solve it within the Kendo. I guess it can be done through svg drawings. But I've never done it before. If it's really impossible is there any way to do it or is there any other scatter chart to fulfill this requirement.(saw somewhat similar thing in google charts)
I'm including the expected result as below.
I came up with this code . It does the exact thing what I want. This is the solution.
Is there any way to draw x-axis at the bottom the chart in case or negative data provided to chart. Please have a look at attached screenshot.
I think Kendo has an option to set axisCrossingValue which may help you to achieve this.
Try the example: http://docs.telerik.com/kendo-ui/api/javascript/dataviz/ui/chart#configuration-categoryAxis.axisCrossingValue
Set some very high negative value to valueAxis.axisCrossingValue.
I want to add data to kendo linechart series but when I add data then kendo redraw chart with all series so it cause performance problem. Is there any way draw it one by one ? Or how can I make real time line chart with kendo ?
This is my code. It cause performance problem.
http://demos.kendoui.com/dataviz/api/benchmark.html How can do it like in this link?
BlueChart.options.series[0].data.push(bvalue);
BlueChart.redraw();
Disable the chart animation. That will help a lot. Here is a complete list of perf tips for the DataViz suite...
http://docs.telerik.com/kendo-ui/dataviz/performance-tips
So, in nvd3 charts, clicking on a legend entry basically filters that out of the chart window (for instance in the case of area charts). I want to invert this functionality..i.e. show the particular chart when its corresponding legend is shown and hide all the others...is there a way to do it?
It is similar to what happens when user hits the chart itself (i.e. only the one that is clicked is expanded and rest of the streams hide).
I am referring to this example: http://nvd3.org/ghpages/stackedArea.html
There's a radioButtonMode that should do exactly what you want. You should be able to set this on the chart, i.e.
chart.radioButtonMode(true);
I have just started using NVD3 for drawing simple charts such as line/pie/bar and such.
I would like to add some mouse interactivity to these charts but cannot find specific documentation nor example code:
allow user to click a specific line point, pie slice, bar component
receive in my program notification of the click with details of the series and point/data row pertinent to the click.
E.g., if I drew sales versus years, I would like user to be able to drill down to sales of a particular year. The line graph onclick example I have seen here are way too coarse for such detailed interaction.
Is there a relevant page(s) that documents the mouse click specifications for these types of charts?
Is it even possible with NVD3?
Thanks.
here you can see the plunker example ,may be you can get some help .
this example is for the pie chart drill down using angularjs and Nvd3 charting lib.
http://plnkr.co/edit/UjOP0k5Jo3OvQ6A79Qv9?p=preview