ExtJS 4 Example of pie chart generation

Front desk:

Remote meter reading equipment drop chart data var Store1 = new Ext.data.Store ({<span style= "White-space:pre" ></span>proxy:{<span Style= "White-space:pre" ></span>type: ' Ajax ', <span style= ' white-space:pre ' ></span>url: '/ Newmaterial/servlet/getcountchartgodatas ', <span style= "White-space:pre" ></span>reader:{<span Style= "White-space:pre" ></span>type: ' array ' <span style= ' White-space:pre ' ></span>}<span Style= "White-space:pre" ></span><span style= "White-space:pre" ></span>},<span style= " White-space:pre "></span>fields:[<span style=" White-space:pre "></span>" System ", <span Style= "White-space:pre" ></span>{name: "Share", type: "Float"}<span style= "White-space:pre" ></ Span>]}); Store1.load (); var mychart1 = new Ext.chart.Chart ({<span style= "White-space:pre" ></span>store:store1, <span style= "White-space:pre" ></span>title: ' All material whereabouts overview ', <span style= ' White-space:pre ' ></span >Width:500,<span style= "White-space:pre" ></span>height:500,<span style= "White-space:pre" ></ Span>insetpadding:50,<span style= "White-space:pre" ></span>legend:{position: "Right"},<span Style= "White-space:pre" ></span>series:[{<span style= "White-space:pre" ></span>type: ' Pie ', <span style= "White-space:pre" ></span>field: ' Share ', <span style= ' White-space:pre ' ></span> Showinlegend:true,<span style= "White-space:pre" ></span>highlight:{<span style= "White-space:pre" ></span>segment:{margin:20}<span style= "White-space:pre" ></span>},<span style= " White-space:pre "></span>label:{<span style=" White-space:pre "></span>field: ' System ',< Span style= "White-space:pre" ></span>display: ' Rotate ', <span style= ' White-space:pre ' ></span> Contrast:true<span style= "White-space:pre" ></span>},<span style= "White-space:pre" ></span >tips:{<spanStyle= "White-space:pre" ></span>trackmouse:true,<span style= "White-space:pre" ></span> Renderer:function (rec,item) {<span style= "White-space:pre" ></span>this.update (Rec.get ("System") + ': ' + Rec.get ("Share") + '% '), <span style= "White-space:pre" ></span>}<span style= "White-space:pre" >< /span>}<span style= "White-space:pre" ></span><span style= "White-space:pre" &GT;&LT;/SPAN&GT;}]}) ;

Background:

public class Getcountchartgodatas extends HttpServlet {/** * @Fields serialversionuid: */private static final long serial Versionuid = 1l;/** * The Doget method of the servlet. <br> * This method was called when a form have its tag value method equals to get. * * @param request * The request send by the client to the server * @param response * The response             Send by the server to the client * @throws servletexception * If an error occurred * @throws IOException * If an error occurred */public void doget (HttpServletRequest request, httpservletresponse response) throws Servlete Xception, IOException {request.setcharacterencoding ("Utf-8"); Response.setcontenttype ("text/html"); StringBuffer sb = new StringBuffer (); Nowmaterialdao NMD = new Nowmaterialdao (); Materialdao MD = new Materialdao (); List getlist = Nmd.getsession (). Createcriteria (Nowmaterial.class). Setprojection (Projections.projectionlist (). Add ( Projections.rowcount ()). Add (projections.grOupproperty ("Material.mscode")). List (); int total = 0;for (int i = 0; i < getlist.size (); i++) {object[] row = (object[ ]) Getlist.get (i); total = Total + Integer.parseint (row[0].tostring ());} Response.setcharacterencoding ("Utf-8"); Sb.append ("["); for (int i = 0; I < getlist.size (); i++) {object[] row = (object[]) getlist.get (i); list<material> getonelist = Md.findbyproperty ("Mscode", row[1]); Sb.append ("['" + getonelist.get (0). GetMsName () + "'," + float.parsefloat (row[0].tostring ()) + "],"); Sb.append ("]"); int qu = Sb.lastindexof (","); Sb.deletecharat (qu); Response.getwriter (). Print (sb.tostring ());} /** * The DoPost method of the servlet. <br> * This method was called when a form have its tag value method equals to * post. * * @param request * The request send by the client to the server * @param response * The response             Send by the server to the client * @throws servletexception * If an error occurred * @throws IOException * If an error occurred */public void DoPost (HttpServletRequest request, httpservletresponse response) throws Servletexception, IOException {doget (request, Response);}}

Copyright notice: This article Bo Master original article. Blog, not reproduced without consent.

ExtJS 4 Example of pie chart generation