How to make a chart grouped between bars and lines with google Chart and export to pdf (C#, MVC)

Asked

Viewed 552 times

1

It would be something like the image below: inserir a descrição da imagem aqui

Vlw guys

c# html asp.net mvc google-charts

1 answer

0


The examples of the Google Chart website are very detailed, see this: https://developers.google.com/chart/interactive/docs/gallery/combochart#example

Demonstrates exactly the crossing between a bar and line graph. The generation is done with the options below:

var options = {
  title : 'Monthly Coffee Production by Country',
  vAxis: {title: 'Cups'},
  hAxis: {title: 'Month'},
  seriesType: 'bars',
  series: {5: {type: 'line'}}
};

Even with example in Jsfiddle working. What you will obviously change is only the data that is passed in the variable date:

var data = google.visualization.arrayToDataTable([
     ['Month', 'Bolivia', 'Ecuador', 'Madagascar', 'Papua New Guinea', 'Rwanda', 'Average'],
     ['2004/05',  165,      938,         522,             998,           450,      614.6],
     ['2005/06',  135,      1120,        599,             1268,          288,      682],
     ['2006/07',  157,      1167,        587,             807,           397,      623],
     ['2007/08',  139,      1110,        615,             968,           215,      609.4],
     ['2008/09',  136,      691,         629,             1026,          366,      569.6]
  ]);

I believe that in your case comes through the Webapi. PDF conversion is possible using SVG, in this Jsfiddle here already has this implementation:

http://jsfiddle.net/zvx6eb7e/10/

Using CSS2PDF --> xepOnline.jqPlugin.js

Browser other questions tagged c# html asp.net mvc google-charts

You are not signed in. Login or sign up in order to post.