I am not able to put text like 15% or 16% in the graph. I s there any way to do it.
Since the chart generation has changed a lot from Chart 1.X (docs) to 2.X (docs), it all depend on the version you are currently using for your project :
Version 1.X
Not available for Doughnut charts
If you are working with Pie charts, it is built in in the data you are passing to the chart.
See this jsFiddle for more information and a full result.
Version 2.X
Two methods :
You can create a new chart type using .extend() method.
Then during the creation of the new type, you draw the percentage in the section.
Check this jsFiddle to see the result (better than the first version, IMHO).
You can force the tooltip to always be enabled (as asked in this other question).
You will just have to edit what is displayed in the tooltip to put the percentage instead of the value. And also move (edit X and Y positions) the tooltip to appear where it should be.
The image displays a Pie chart, but you can make it work for a Doughnut.
Related
I have a simple linechart with 2 lines. On hover, I would like to display both y-values in the tooltip that appears. I know I can accomplish this by writing a Javascript function that creates a custom tooltip for every x-value on the graph, but this seems so redundant to do, especially when the graph gets large. Since Google Chart is able to auto-generate the standard tooltip which contain both the x and y-value I feel like there should be an option to do this with built-in tools, is there?
Probably setting focusTarget to 'category' will do the trick.
See here for an example that uses it.
I am looking for this solution. I would like to know how to recreate this style of the stacked bar chart.
I will use this to indicate the status of the machinery during the day. so the color can be used more than once like in the picture.
Show picture of Example graph
Would suggest you to use any library -
Chart.js is good one that I have used and they do support stacked-bar graph
https://www.chartjs.org/docs/3.5.0/samples/bar/stacked.html
They have a good document also on how to use it.
I'm trying to setup a graph that looks somewhat like this:
The graph consists of two data series, one for the stacked and another for the averages. Pay attention that is has two x-axis (multiaxis).
Looking at the ChartJS documentation, mixed graph types are possible, but not for stacked horizontal bars. Other articles seem to outline this as well, like this one on Alligator.io. I've yet to see any chart library to showcase such an example even.
Question is therefore if this is even possible, or if I should look into alternate approaches instead.
Currently it's not possible (only proof I could find right now).
The next version of chart.js will be 3.0 which has many major impovements, including changes to the horizontal bar chart, verbatim "Remove horizontalBar and make all charts capable of being horizontal". I think it will be possible with this version. But unfortunately not now.
Highmaps provides a way to implement map with overlaid pie charts, is there a way to change pie with column?
http://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/maps/demo/map-pies/
The mappie series is not a part of Highcharts core. It is a custom series created with Highcharts.seriesType function (you can find it here: http://code.highcharts.com/highcharts.src.js) at the beginning of the demo. You can modify provided example and create series such as mapcolumn. Although, map is not very readable and tooltip does not work correctly when rendering columns instead of pies. You give it a try and create your own custom series.
Example:
http://jsfiddle.net/wsuhws7c/
I can’t draw in my charts using drawingIconsEnabled
i need to draw in my charts an make markup
Link my code :plnkr.co/edit/uKdqrGvMHaAx7wixax5m?p=preview
drawingIcontsEnabled is a stock chart feature, not a serial chart feature. You have to use the stock charts library instead if you need drawing functionality. Look at this demo on AmCharts' site to see how it's implemented and change your code accordingly.
Note that stock charts only work with date-based data. String-based categories will not work.
The user can also enable annotations in the export menu if they want to draw on the chart as well. This works in both stock and non-stock charts.