Is it possible to show a drop shadow behind a Chart.js tooltip? I think there used to be a showShadow:true option, but it doesn't exist or isn't documented in the current version of Chart.js.
Related
I'm trying to have the tooltips always shown on a doughnut in Chart.js v3. Is there any way to achieve this?
Not by default, if you want to see all the values all the time you are better of using the datalabels plugin: https://chartjs-plugin-datalabels.netlify.app/samples/charts/doughnut.html
I am using Chart.js version 2.7.2 to create a simple, single series bar chart. I want every bar in the chart to fill all available space such that each bar in the chart "touches" its neighbor(s).
My research has indicated that I should be using the barPercentage and categoryPercentage settings, setting both to 1. I've done this and it makes the bars very wide, but it leaves a single pixel gap between them.
My initial assumption is that this was due to a grid line, but even if I turn off grid lines (gridLines.display: false) it still has the one-pixel gap.
JsFiddle
Here is a screenshot. See the gap between each bar? How do I get rid of that?
You will have to update to 2.8+ version of the library.
There were multiple instances of issues around this on their GitHub (i.e. [BUG] Spacing between vertical bars with percentages set to 1 and [BUG] Small gap between bars even with barPercentage and categoryPercentage set to 1).
There was a PR that made it into their 2.8.0 version that is supposed to fix the issues around this (as noted by #benmccann at the bottom of the PR page).
When using echarts, in several lines of code the following can be achieved: https://ecomfe.github.io/echarts-examples/public/editor.html?c=pie-doughnut , more specifically notice the entrance animation and the hover behaviors and the legends hover and the smooth tooltip movement and legend click behavior and the quick chart rerendering.
On the other hand echarts lacks touch events support and some other stuff and thus I wanted to use chart.js to build this same doughnut chart to see if chart.js is capable of it. The chart.js examples I saw online have very basic animations and interactions.
I saw in chart.js website that support is given by creating appropriate stackoverflow question with chart.js tag, so I am creating this question to ask if its possible to create a dougnut chart with the described behaviors using chart.js
I have the goal of showing a tooltip on a near real-time chart that is updating constantly.
Using the standard tooltips in the chartjs library, calling Chart.update() will destroy the tooltip.
In the example here, if the user is hovering the chart, and the graph is updated, the tooltip goes away.
Note: if I change the chartjs version to 2.5.0, there is no issue. It appears to be a bug in 2.7.2
How do I prevent this behavior?
Right now there seems to be no official solution. There is still a discussion ongoing on how to fix this: Do not hide tooltip when update is called
I'm trying to automate some PowerPoint charts, but I'm having problems preserving some formatting.
When I add a chart using a chart template, the chart doesn't use the slides color scheme, but rather the colors it was saved with. It doesn't help to change the color scheme for the slide - the chart isn't updated. To make the chart update to the color scheme of the slide, I have to clear formatting for the chart. The problem with doing this is that all font sizes are automatically set to 18pt. I cannot find any easy way restore the font sizes for the chart without saving all sizes before calling clear, and set them back after clearing.
Have you looked into using the Format Painter function it may or may not work depending on a variety of factors from my quick look on the net (google it for lots of articles).
Also if you've done one chart you should be able to copy the formatting from one chart to another using the paste special option as mentioned here http://www.pcreview.co.uk/forums/there-format-painter-equivalent-use-many-charts-t3611646.html .