Hi there,
I have run into a bit of a problem with the kendoChart (bullet in this particular case, but probably concerns the others too) with regard to responsive design. The scenario I have is three columns, with two containing textual data and the third one contains some charts. The layout is constructed with Twitter Bootstrap. I will set up the layout below
<div class="row-fluid">
<div class="span5">First text data</<div>
<div class="span5">Second text data</div>
<div class="span2"><div class="rq-kendoChart" data-chartvalue1="2", data-chartvalue2="90"></div></div>
</div>
So, simple enough setup. My problem is that it appears to only be possible to tell the chart to be a static pixel size (only accepts a number, which is then written out in the end result (svg) as "<number>px;". Giving it a static size doesn't mesh very well with the fluid grid, so I was wondering if there is some option I have missed where you can set a % width, or perhaps some other elegant solutions to this problem?
I do have one way around it (event on window.resize, obtain the chart object, hide it, set new size, show it, call chart.redraw) but it seems very hacky and also not very efficient.
I have run into a bit of a problem with the kendoChart (bullet in this particular case, but probably concerns the others too) with regard to responsive design. The scenario I have is three columns, with two containing textual data and the third one contains some charts. The layout is constructed with Twitter Bootstrap. I will set up the layout below
<div class="row-fluid">
<div class="span5">First text data</<div>
<div class="span5">Second text data</div>
<div class="span2"><div class="rq-kendoChart" data-chartvalue1="2", data-chartvalue2="90"></div></div>
</div>
So, simple enough setup. My problem is that it appears to only be possible to tell the chart to be a static pixel size (only accepts a number, which is then written out in the end result (svg) as "<number>px;". Giving it a static size doesn't mesh very well with the fluid grid, so I was wondering if there is some option I have missed where you can set a % width, or perhaps some other elegant solutions to this problem?
I do have one way around it (event on window.resize, obtain the chart object, hide it, set new size, show it, call chart.redraw) but it seems very hacky and also not very efficient.
1 Answer, 1 is accepted
0
Accepted
Miika
Top achievements
Rank 1
Rank 1
answered on 23 Oct 2013, 12:28 PM
This was accidentally posted under the MVC forum where it doesn't really belong, have reposted it under: http://www.kendoui.com/forums/kendo-ui-dataviz/chart/kendochart-%28type-bullet%29-and-responsive-width.aspx