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

Sparkline being clipped

1 Answer 38 Views
Sparkline
This is a migrated thread and some comments may be shown as answers.
Robert
Top achievements
Rank 1
Robert asked on 01 Apr 2014, 11:41 AM
I am raising this in the forums because the support ticket page keeps giving me a 'server had an error' response page.

I was previously running Kendo version 2013.3.1324. I have been developing a column in the Kendo grid to have a sparkline in it's template.  This was displaying correctly in that version.  I have since upgrade to version 2014.1.318 to attempt to fix an issue we have with the Kendo grid where it freezes (I can explain the details in another support ticket to the Grid team).  Now we have upgraded the sparkline is no longer rendering properly. The top and bottom appear to be clipped.  I have attached a screenshot showing the problem.  I have compared the Html output by both version and something new has been added. It is the svg / defs / clippath / path  element.  It seems the new version puts a path element in the clippath node, removing this in the development tools on chrome fixes the display.
Why was it added and how can I fix the new version to display correctly.

I am also using angular-kendo.js. Although I believe this wouldn't affect the html rendered. My sparkline options are: 
{
            chartArea: {
                background: "",
                width: 110
            },
            tooltip: {
                visible: false,
            },
            categoryAxis: {
                crosshair: {
                    visible: false,
                },
            },
            
            seriesDefaults: {
                line: {
                    color: "#5889AD",
                    width: 1,
                },
                markers: {
                    visible: true,
                    size: 1,
                    border: {
                        color: "#d52b1e",
                        width: 2,
                    }
                }
            }
        };

1 Answer, 1 is accepted

Sort by
0
Iliana Dyankova
Telerik team
answered on 02 Apr 2014, 08:17 AM
Hi Robert,

Thank you for pointed our attention to this issue - I forwarded it to the developers and we will do our best to address it as soon as possible. As a small sign of gratitude for this finding I updated your points.

Meanwhile as a workaround I can suggest setting negative min value to the valueAxis. As an example: 
//....
valueAxis: {
   min: -5
},
//....

Regards,
Iliana Nikolova
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
Sparkline
Asked by
Robert
Top achievements
Rank 1
Answers by
Iliana Dyankova
Telerik team
Share this question
or