Thanks a lot Sergey. Much appreciated. got the trick from your code. On Mon, Mar 14, 2016 at 10:15 AM, 'Sergey Grabkovsky' via Google Visualization API <[email protected]> wrote:
> Hi, > > Here are answers to your questions in order: > 1) In order to get rid of the spacing around the chart, you need to set > your 'chartArea' options. > 2) Presumably you're talking about the gridlines here? These can be gotten > rid of by setting the vAxis.gridlines.count setting to 0. > 3) This will happen once your chart size actually matches your div size > and you've gotten rid of the space around the chart area (#1). > 4) Sadly, this is not trivial. In order to actually do this, you will have > to use a numeric axis with custom ticks. > > Here's a jsfiddle example of all the things you requested: > http://jsfiddle.net/jmqug9un/ > > On Sat, Mar 12, 2016 at 7:35 PM <[email protected]> wrote: > >> Hi Guys, >> >> Below is the sample Code >> <script type="text/javascript" src=" >> https://www.gstatic.com/charts/loader.js";></script> >> <script type="text/javascript"> >> google.charts.load("current", {packages:['corechart']}); >> google.charts.setOnLoadCallback(drawChart); >> function drawChart() { >> var data = google.visualization.arrayToDataTable([ >> ["Element", "Density", { role: "style" } ], >> ["Copper", 8.94, "#b87333"], >> ["Silver", 10.49, "silver"], >> ["Gold", 19.30, "gold"], >> ["Platinum", 21.45, "color: #e5e4e2"], >> ["Emerald", 21.45, "color: green"] >> ]); >> >> var view = new google.visualization.DataView(data); >> view.setColumns([0, 1, >> { calc: "stringify", >> sourceColumn: 1, >> type: "string", >> role: "annotation" }, >> 2]); >> >> var options = { >> title: "Density of Precious Metals, in g/cm^3", >> width: 600, >> height: 400, >> bar: {groupWidth: "95%"}, >> legend: { position: "none" }, >> }; >> var chart = new >> google.visualization.ColumnChart(document.getElementById("columnchart_values")); >> chart.draw(view, options); >> } >> </script> >> <div id="columnchart_values" style="width: 900px; height: >> 300px;border:1px solid black;"></div> >> >> Current Output: >> >> >> <https://lh3.googleusercontent.com/-lFrHt18e1ck/VuSx_iQtUiI/AAAAAAAAAAM/EoljioNkiy8aJkXlX660Xs1osr8MVBAPA/s1600/Output.PNG> >> >> >> >> Expected output: >> >> >> <https://lh3.googleusercontent.com/-6oANk5y749s/VuS1ZfBamBI/AAAAAAAAAAw/RFs2Vi4alq4S2tg2z18qkR9fZBozU2b9g/s1600/Output.PNG> >> >> >> >> Please see the different b/w Current output and Expected output >> >> Issues in the Current output: >> >> 1. Extra spaces in the chart area. I tried to reduce the width of the div >> and still i am unable to remove the white space in the chart area. >> 2. Horizontal line needs to be removed >> 3. Need to make the chart in fit to the div border. >> 4.Y axis values need not show but the line needs to be there >> >> I have attached my sample code as well. I request anyone to help me to >> achieve this requirement. Any sample code would be much appreciated. >> >> Thanks >> >> -- >> You received this message because you are subscribed to the Google Groups >> "Google Visualization API" group. >> To unsubscribe from this group and stop receiving emails from it, send an >> email to [email protected]. >> To post to this group, send email to >> [email protected]. >> Visit this group at >> https://groups.google.com/group/google-visualization-api. >> To view this discussion on the web visit >> https://groups.google.com/d/msgid/google-visualization-api/baf1ae3f-761b-419c-8de2-61df754bb031%40googlegroups.com >> <https://groups.google.com/d/msgid/google-visualization-api/baf1ae3f-761b-419c-8de2-61df754bb031%40googlegroups.com?utm_medium=email&utm_source=footer> >> . >> For more options, visit https://groups.google.com/d/optout. >> > -- > > *[image: unnamed.gif]• Sergey Grabkovsky• Software Engineer• Google, Inc• > [email protected] <[email protected]>* > > -- > You received this message because you are subscribed to a topic in the > Google Groups "Google Visualization API" group. > To unsubscribe from this topic, visit > https://groups.google.com/d/topic/google-visualization-api/6reyKbMY3pM/unsubscribe > . > To unsubscribe from this group and all its topics, send an email to > [email protected]. > To post to this group, send email to > [email protected]. > Visit this group at > https://groups.google.com/group/google-visualization-api. > To view this discussion on the web visit > https://groups.google.com/d/msgid/google-visualization-api/CAEwwup5fivPme-2YBsV4b1S4qf90aR1xF-cbCR5NoqS3RmiD9Q%40mail.gmail.com > <https://groups.google.com/d/msgid/google-visualization-api/CAEwwup5fivPme-2YBsV4b1S4qf90aR1xF-cbCR5NoqS3RmiD9Q%40mail.gmail.com?utm_medium=email&utm_source=footer> > . > > For more options, visit https://groups.google.com/d/optout. > -- You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at https://groups.google.com/group/google-visualization-api. To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/CAB40d1sS6WzSpSh2Fvu8-HPk2nv4bjVfUE1%2BFmdBYHbmSkRuwQ%40mail.gmail.com. For more options, visit https://groups.google.com/d/optout.
