zilav Posted January 31, 2012 Share Posted January 31, 2012 A simple wrapper class and demo project using Kendo charts in UniGUI applications. Kendo Charts demos Kendo Charts API This project showcases only a small amount of available customization options, refer to Kendo API for help. Please note: this is a demo, it doesn't have checks, exception handlers and might contain bugs. Use it as an example to write your own class. Have fun! KendoDataViz.zip 3 Quote Link to comment Share on other sites More sharing options...
rsanford Posted February 1, 2012 Share Posted February 1, 2012 thank you! Quote Link to comment Share on other sites More sharing options...
richard_wu Posted February 1, 2012 Share Posted February 1, 2012 very good ! Quote Link to comment Share on other sites More sharing options...
delphiboy Posted February 1, 2012 Share Posted February 1, 2012 Good Job! Quote Link to comment Share on other sites More sharing options...
Administrators Farshad Mohajeri Posted February 9, 2012 Administrators Share Posted February 9, 2012 Great. Thanks for sharing. Quote Link to comment Share on other sites More sharing options...
Marlon Nardi Posted March 2, 2013 Share Posted March 2, 2013 try{O83.stopAll()}catch(e){};$("#O2F_id").find("div").find("div").kendoChart({title: {text: "Internet Users"},theme: "Default",seriesDefaults: {type: "column",stack: false,labels: {visible: true, position: "insideEnd", format: "{0}%"}},categoryAxis: {categories: [2005,2006,2007,2008,2009]},series: [{name: "United States", data: [67.96,68.93,75,74,78]},{name: "World", data: [15.7,16.7,20,23.5,26.6]}],valueAxis: {labels: {format: "{0}%"}},legend: {position: "top"},seriesClick: function(e) {ajaxRequest(MainForm.UniHTMLFrame1, "Click", ["name="+e.series.name, "category="+e.category, "value="+((typeof e.value==='object')?e.value.x+","+e.value.y:e.value)]);}}); does not work in version: 0.91.0.981 of UniGui: Quote Link to comment Share on other sites More sharing options...
mehmet07 Posted May 22, 2013 Share Posted May 22, 2013 Cannot call method 'width' of undefined try{O83.stopAll()}catch(e){};$("#O2F_id").find("div").find("div").kendoChart({title: {text: "Internet Users"},theme: "Default",seriesDefaults: {type: "column",stack: false,labels: {visible: true, position: "insideEnd", format: "{0}%"}},categoryAxis: {categories: [2005,2006,2007,2008,2009]},series: [{name: "United States", data: [67.96,68.93,75,74,78]},{name: "World", data: [15.7,16.7,20,23.5,26.6]}],valueAxis: {labels: {format: "{0}%"}},legend: {position: "top"},seriesClick: function(e) {ajaxRequest(MainForm.UniHTMLFrame1, "Click", ["name="+e.series.name, "category="+e.category, "value="+((typeof e.value==='object')?e.value.x+","+e.value.y:e.value)]);}}); My unigui version : 0.93.1.999 Quote Link to comment Share on other sites More sharing options...
knopix Posted May 31, 2013 Share Posted May 31, 2013 can not unigui 0.93 Regards Knopix Quote Link to comment Share on other sites More sharing options...
eono Posted June 5, 2013 Share Posted June 5, 2013 Hi All, Got stock UniKendoDataViz for work. Versions: UniGUI: Version:0.93.1 build 999 Delphi: XE2 TUniKendoDataViz: stock version above Edits: 1. Constructor: constructor TUniKendoDataViz.Create(HostFrame: TUniHTMLFrame); var p: TWinControl; begin HTMLFrame := HostFrame; DOM_ID := HTMLFrame.JSName + '_id'; p := HTMLFrame.Parent; while not ((p is TUniForm) or (p is TUniFrame)) do p := p.Parent; AjaxHandler := p.Name + '.' + HTMLFrame.Name; HTMLFrame.OnAjaxEvent := UniHTMLFrameAjaxEvent; Series := TStringList.Create; Properties := TStringList.Create; SeriesProperties := TStringList.Create; Title := 'Kendo Chart'; Theme := 'default'; DefaultType := 'column'; Clear; end; 2. Render: function TUniKendoDataViz.Render; var chart, sl: TStringList; i: integer; sClick: string; begin chart := TStringList.Create; sl := TStringList.Create; { 04-may-2013} //add tooltip //chart.Add('tooltip: {visible: true,format: "{0:C}",template: "#= series.name #<br /> #number_format(#= value #)"}'); kendo.template(number_format(5000000)) if sametext(DefaultType,'pie') then chart.Add('tooltip: {visible: true,format: "{0:C}",template: "#= category #<br /> #= number_format(value,2,''.'','','') #"}') else chart.Add('tooltip: {visible: true,format: "{0:C}",template: "#= series.name #<br /> #= number_format(value,2,''.'','','') #"}'); { 04-may-2013} // map Title property chart.Add(Format('title: {text: "%s"}', [Title])); // map Theme property chart.Add(Format('theme: "%s"', [Theme])); // map DefaultType, DefaultProperties and Stack property sl.Add(Format('type: "%s"', [DefaultType])); sl.Add(Format('stack: %s', [boolToStr(Stacked)])); if SeriesDefaults <> '' then sl.Add(SeriesDefaults); chart.Add(Format('seriesDefaults: {%s}', [implode(sl)])); sl.Clear; // generates data series for i := 0 to Series.Count - 1 do begin if Series.Names <> 'categoryAxis' then sl.Add(RenderSeries(Series.Names)) else chart.Add(Format('categoryAxis: %s', [RenderSeries('categoryAxis')])); end; if sl.Count > 0 then chart.Add(Format('series: [%s]', [implode(sl)])); sl.Clear; // add other additional properties for i := 0 to Properties.Count - 1 do chart.Add(Format('%s: %s', [Properties.Names, Properties.ValueFromIndex])); // assign onclick callback chart.Add(Format('seriesClick: function(e) {ajaxRequest(%s, "Click", '+ '["name="+e.series.name, "category="+e.category, "value="+((typeof e.value===''object'')?e.value.x+","+e.value.y:e.value)]);}', [AjaxHandler])); (*sClick := Format('ajaxRequest(%s, "Click", '+ '["name="+e.series.name]);', [AjaxHandler]); chart.Add('seriesClick: function(e) {' + sClick + '}'); *) // get the final KendoChart javascript object Result := '{' + Implode(chart) + '}'; FreeAndNil(sl); FreeAndNil(chart); end; 3. Draw: procedure TUniKendoDataViz.Draw; var str: string; begin (* the 2 find('div') statements are commented out below. This is the only way to have it draw. I have not researched the reason why. *) str := Format('$("#%s")./*find("div").find("div").*/kendoChart(%s);', [DOM_ID, Render]); UniSession.AddJS(str); end; @Admin: Hope posting source code updates to components as regular posts is allowd? @Zilav: I could send you my updates so u can incorporate into your sources. Regards 2 Quote Link to comment Share on other sites More sharing options...
dmitry.akimenko Posted June 13, 2013 Share Posted June 13, 2013 Zilav, Eldad, can you please share the updated project for the latest unigui version? Regards, Dmitry Quote Link to comment Share on other sites More sharing options...
zilav Posted June 14, 2013 Author Share Posted June 14, 2013 Eldad please link me the fixed version and I'll update the first post. Quote Link to comment Share on other sites More sharing options...
Marlon Nardi Posted June 20, 2013 Share Posted June 20, 2013 Thank Eldad, Problem solved ... Att, Marlon Quote Link to comment Share on other sites More sharing options...
eono Posted June 26, 2013 Share Posted June 26, 2013 Hi All, Just saw the updates to this post! I had configured to be notified when this post is updated, but guess it didn't work out. @Zilav: will send in a couple of hours. Kind regards. Quote Link to comment Share on other sites More sharing options...
mehmet07 Posted July 29, 2013 Share Posted July 29, 2013 Hi, i executing my application exe(standalone) , i get no error. But i executing dll and I get the following error. Problem solved ... Object [object Object] has no method 'kendoChart' _rsov_(O62,0);$("#O2F_id").kendoChart({tooltip: {visible: true,format: "{0:C}",template: "#= series.name #<br /> #= number_format(value,2,'.',',') #"},title: {text: "Internet Users"},theme: "Default",seriesDefaults: {type: "bar",stack: false,labels: {visible: true, position: "insideEnd", format: "{0}%"}},categoryAxis: {categories: [2005,2006,2007,2008,2009,2010,2017,2018,2019,2027,2038,2049,2020,2021,2032,2042]},series: [{name: "United States", data: [67.96,68.93,75,74,78,68.93,75,74,78,75,74,78,78,75,74,78]},{name: "World", data: [15.7,16.7,20,23.5,26.6,16.7,20,23.5,26.6,20,23.5,26.6,26.6,20,23.5,26.6]},{name: "deneme", data: [67.96,68.93,75,74,78,68.93,75,74,78,75,74,78,78,75,74,78]}],valueAxis: {labels: {format: "{0}%"}},legend: {position: "top"},seriesClick: function(e) {ajaxRequest(MainForm.UniHTMLFrame1, "Click", ["name="+e.series.name, "category="+e.category, "value="+((typeof e.value==='object')?e.value.x+","+e.value.y:e.value)]);}}); Quote Link to comment Share on other sites More sharing options...
eelias Posted February 17, 2014 Share Posted February 17, 2014 A simple wrapper class and demo project using Kendo charts in UniGUI applications. Kendo Charts demos Kendo Charts API This project showcases only a small amount of available customization options, refer to Kendo API for help. Please note: this is a demo, it doesn't have checks, exception handlers and might contain bugs. Use it as an example to write your own class. Have fun! Zilav, Thank you in sharing this important code. I have added the changes that Eldad Onojetah suggested and that fixed the problem as reported from others on this thread. I wonder if you have a newer version of your component and if you have added new options that you could share with us, including the fix. I am using in UniGUI 0.93, did you test on 0.94 and is working? Thank you Eduardo Quote Link to comment Share on other sites More sharing options...
brunotoira Posted April 14, 2014 Share Posted April 14, 2014 it's possible zoom chart? Anyone knows how set a color of series chart? Thanks Bruno Quote Link to comment Share on other sites More sharing options...
ChenHaibin Posted July 10, 2014 Share Posted July 10, 2014 Could you convert the MainForm to a Frame? Thank you! Quote Link to comment Share on other sites More sharing options...
mehmet07 Posted July 10, 2014 Share Posted July 10, 2014 how i can kendo ui chart ? http://demos.telerik.com/kendo-ui/radial-gauge/index Quote Link to comment Share on other sites More sharing options...
topajin Posted July 11, 2014 Share Posted July 11, 2014 very good,thanks for sharing! Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.