kendo ui always show tooltip on top for pie chart angularjs

Question

I have created a pie chart using kendoui referring to below link on telerik :-

https://demos.telerik.com/kendo-ui/pie-charts/angular

I tried to show tooltip on pie chart created which will always show without hover on pie chart.

I have referred below pages but not found any solution :-

My code is below :-

<!-- Pie chart -->
<div class="demo-section k-content" ng-if="widget.id === 'pie'" id="widgetPie">
    <div id="pieWrapper">
        <div kendo-chart
            k-rebind="firmwareDevices"
            k-title="{ text: 'SLC Firmware Distribution', position: 'top' }"
            k-series-defaults="{ type: 'pie', labels: { visible: true }}"
            k-series="[{
                            field: 'doc_count',
                            name: 'SLC',
                            categoryField: 'key',
                            padding: 0,
                            color: '#b8b8b8'
                        }]"
            k-data-source="deviceObject"
            k-series-hover="onSeriesHover"
            k-series-colors="['#66b3ff', '#b2d9ff']"
            k-tooltip="{ visible: true, template: '#= category # device_count: #= value #' }"
            k-legend = "{ position: 'left' }",
            style="height: 270px; width:450px;"
            id="ltxPie">
        </div>
    </div>
</div>

Please have a look here https://www.telerik.com/forums/tooltip-at-top-of-chart-div — Alexis, Mar 22 '18 at 06:47
@AlexisToby I have mentioned this link above you shared but what option should I use from that link to resolve my probem ? because my 3rd link in question is same as provided by you — , Mar 22 '18 at 07:26

score 0 · Accepted Answer · edited Mar 23 '18 at 05:18

Referring to the demo example below:

http://demos.telerik.com/kendo-ui/line-charts/local-data-binding

Try to set k-series-defaults as follows :-

 k-series-defaults="{ type: 'pie', 
                      labels: {
                          visible: true,
                          format: '{0}%',
                          background: 'transparent'
                      }
                     }"

kendo ui always show tooltip on top for pie chart angularjs

1 Answers1