This is a migrated thread and some comments may be shown as answers.

"Stacked bar chart Tooltip -- Single Bar of multi Stacks should show all color with value on tooltip"

8 Answers 162 Views
Charts
This is a migrated thread and some comments may be shown as answers.
Nilesh
Top achievements
Rank 1
Nilesh asked on 06 Oct 2015, 10:40 AM
"Stacked bar chart Tooltip -- Single Bar of multi Stacks should show all color with value on tooltip"

8 Answers, 1 is accepted

Sort by
0
Accepted
Daniel
Telerik team
answered on 08 Oct 2015, 08:03 AM
Hello,

You can use shared toolitp to show all values. The colors will not be shown by default but it is possible to use template in order to show them(live demo).

Regards,
Daniel
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Nilesh
Top achievements
Rank 1
answered on 08 Oct 2015, 08:29 AM
Thanks Daniel :)
0
Nilesh
Top achievements
Rank 1
answered on 02 Dec 2015, 11:39 AM

Hi,

One issue with sharedTooltip is, its showing area above the bars also, i want to show only on bars area.

 

 

0
Iliana Nikolova
Telerik team
answered on 04 Dec 2015, 09:05 AM
Hi Nilesh,

I am afraid what you are trying to achieve is not supported and there is no a suitable workaround which I could suggest. Please accept my apologies for any inconvenience this may cause. 

Regards,
Iliana Nikolova
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Peter
Top achievements
Rank 1
answered on 19 Aug 2016, 01:20 PM

Hi, 

how can I 'translate' the Dojo to Kendo MVC?

I want show at end the Total, It works in Dojo. in cshtml I insert

<script type="text/kendo" id="sharedTemplate">
        <div>
            <table>
                #var total=0
                for (var i = 0; i < points.length; i++) { #
                <tr>
                    <td>#:points[i].series.name#</td>
                    <td>#:points[i].value#</td>
                </tr>
                #total=total+points[i].value;} #
                <tr>
                    <td>All:</td>
                    <td>#:total#</td>
                </tr>
            </table>
        </div>
    </script>
 
 @(Html.Kendo().Chart<ChartDataViewModel>()
...
.Tooltip(tooltip => tooltip.Visible(true).Shared(true).SharedTemplate("# $('\\\\#sharedTemplate').html() #"))

Then the Tooltip is shown empty.

 

0
Peter
Top achievements
Rank 1
answered on 19 Aug 2016, 03:33 PM

I've got it working with a javascript function:

<script>
    $(document).ready(function () {
        var chart = $("#chart").data("kendoChart");
        var options = chart.options;
        options.tooltip = {
            shared: true,
            visible: true,
            sharedTemplate: $("#sharedTemplate").html()
        }
        chart.setOptions(options);
    });
</script>

But what ist the correct Razor Syntax for

.Tooltip(tooltip => tooltip.Visible(true).Shared(true).SharedTemplate("# $('\\\\#sharedTemplate').html() #"))

 

 

 

0
Daniel
Telerik team
answered on 23 Aug 2016, 10:57 AM
Hello,

The wrapper does not currently support setting external template. The template can only be set inline with the SharedTemplate method:
.SharedTemplate(
    @"<div>
        <table>
        ...
        </table>
    </div>"
)


Regards,
Daniel
Telerik by Progress
 
Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
 
0
Peter
Top achievements
Rank 1
answered on 23 Aug 2016, 12:03 PM

Thanks, Daniel.
So I have to use the Javascript solution.

Peter

Tags
Charts
Asked by
Nilesh
Top achievements
Rank 1
Answers by
Daniel
Telerik team
Nilesh
Top achievements
Rank 1
Iliana Nikolova
Telerik team
Peter
Top achievements
Rank 1
Share this question
or