Tooltip for the charts on the card widgets is cutting off about coreui-free-bootstrap-admin-template HOT 5 CLOSED

Same problem. Really annoying. Embarrassing bug.

from coreui-free-bootstrap-admin-template.

Hi, it's chart.js problem. You have to add external tooltips. http://www.chartjs.org/docs/#advanced-usage-external-tooltips

I'm going to add external tooltips in future updates.

from coreui-free-bootstrap-admin-template.

Hi! Thank you for a quick response!!! I'll have it fixed! Thank you!

from coreui-free-bootstrap-admin-template.

Hi, I don 't quite get it, I understand how to enable but how do I enable bootstrap tooltip on it? Should I do like:

1. Add html for tooltip markup:
   <div id="chartjs-tooltip" class="tooltip tooltip-top" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>

2. Add the text:

var customTooltips = function(tooltip) {
     var tooltipEl = $('#chartjs-tooltip');
     if (tooltip.body) {
        var innerHtml = [
          (tooltip.beforeTitle || []).join('\n'), (tooltip.title || []).join('\n'), (tooltip.afterTitle || []).join('\n'), (tooltip.beforeBody || []).join('\n'), (tooltip.body || []).join('\n'), (tooltip.afterBody || []).join('\n'), (tooltip.beforeFooter || [])
          .join('\n'), (tooltip.footer || []).join('\n'), (tooltip.afterFooter || []).join('\n')
        ];
        tooltipEl.find('#tooltip-inner').html(innerHtml.join('\n'));
      }
};

How do I initialize the tooltip so it can show? I think I'm missing something :/

Thanks!

from coreui-free-bootstrap-admin-template.

• CoreUI v2 import and use our CustomTooltips:

  coreui-free-bootstrap-admin-template/src/js/src/main.js

  Line 18 in 112721f

  Chart.defaults.global.tooltips.custom = CustomTooltips

• CoreUI v3 import and use our customTooltips:

  coreui-free-bootstrap-admin-template/src/js/main.js

  Line 17 in 0b81083

  Chart.defaults.global.tooltips.custom = coreui.ChartJS.customTooltips

from coreui-free-bootstrap-admin-template.