asp.net - Muti-bar column Chart with Legend from Datatable -


i trying plot mutibar column chart legend. code. code seems working not adding legend in appropriate format. i'm adding screenshots of data table , output coming code. legend should showing different types of priorities showing "legend text" everywhere.

output

datatable

//plotting matrix chart         chartmatrix.visible = true;         loadchartdata(dthourvsprioritymatrix);         chartmatrix.series["priority"].charttype = seriescharttype.column;         chartmatrix.series["priority"]["drawingstyle"] = "emboss";         //chartmatrix.chartareas["chartarea1"].area3dstyle.enable3d = true;         chartmatrix.series["priority"].isvalueshownaslabel = true;          // create new legend called "legend".         chartmatrix.legends.add(new legend("legend"));          // set docking of legend chart default chart area.         chartmatrix.legends["legend"].dockedtochartarea = "chartareaf";          // assign legend series=priority.         chartmatrix.series["priority"].legend = "legend";         chartmatrix.series["priority"].isvisibleinlegend = true;          legendcellcolumn lcc = new legendcellcolumn("priority", legendcellcolumntype.text, "legendtext");         lcc.headerfont = new system.drawing.font("trebuchet ms", 12f, system.drawing.fontstyle.bold);         chartmatrix.legends["legend"].cellcolumns.add(lcc);   private void loadchartdata(datatable initialdatasource)     {         (int = 1; < initialdatasource.columns.count; i++)         {             series series = new series();             foreach (datarow dr in initialdatasource.rows)             {                 int y = (int)dr[i];                 series.points.addxy(dr["hour"].tostring(), y);             }             chartmatrix.series.add(series);         }     }    

try use canvasjs chart.

use web service binding data

<script type="text/javascript">         $(document).ready(function () {             var district = $('#contentplaceholder1_hiddistrict').val();             var assembly = $('#contentplaceholder1_hidassembly').val();             $.ajax({                 type: "post",                 contenttype: "application/json; charset=utf-8",                 datatype: "json",                 url: "../webmyvoterservice.asmx/genderwise",                 data: '{"districtid":"' + district + '","assembly" :"' + assembly + '" }',                 processdata: false,                 success: onsuccess,                 failure: function (response) {                     alert(response);                 },                 error: function (response) {                     alert(response);                 }             });                function onsuccess(response) {                 var dpmale = [];                 var dpfemale = [];                 (var = 0; < response.d.length; i++) {                     var obj = response.d[i];                     var datamale =                     {                         y: parseint(obj.male),                         label: obj.boothno,                      };                     var datafemale =                      {                          y: parseint(obj.female),                          label: obj.boothno,                       };                     dpmale.push(datamale);                     dpfemale.push(datafemale);                 }                   var chart = new canvasjs.chart("chartcontainerbar", {                      animationenabled: true,                     axisx: {                         interval: 1,                         labelfontsize: 10,                         linethickness: 0,                      },                     axisy2: {                         valueformatstring: "0",                         linethickness: 0,                         labelfontsize: 10,                     },                     tooltip: {                         shared: true                     },                     legend: {                         verticalalign: "top",                         horizontalalign: "center",                         fontsize: 10,                     },                      data: [{                          type: "stackedbar",                         showinlegend: true,                         name: "male",                         axisytype: "secondary",                         color: "#f8d347",                         datapoints: dpmale                      },                     {                          type: "stackedbar",                         showinlegend: true,                         name: "female",                         axisytype: "secondary",                         color: "#6ccac9",                          datapoints: dpfemale                      }                     ]                 });                 chart.render();             }          });     </script> 

url : http://canvasjs.com/


Comments

Popular posts from this blog

Spring Boot + JPA + Hibernate: Unable to locate persister -

go - Golang: panic: runtime error: invalid memory address or nil pointer dereference using bufio.Scanner -

c - double free or corruption (fasttop) -