Hi Sergey,
I want to fix the bar width in Bar chart and i am using Material chart.
the below mentioned code not working for me.
Options = {
width: '100%',
height: '100%',
bar: {groupWidth: "15%"},
titlePosition: 'none', //hiding chart
title.
legend: {
position: 'right' //setting legend
position to right.
},
isStacked: true,
vAxis: {
title: "Incident Count",
textStyle: {
color: 'black' //set axis color
to black.
}
},
hAxis: {
title: "Locations",
textStyle: {
color: 'black' //set axis color
to black.
}
},
bars: 'horizontal', //show horizontal
bars
series: {
0: {
targetAxisIndex: 0,
color: '#F3C1BC'
},
1: {
targetAxisIndex: 0,
color: '#E7827A'
},
2: {
targetAxisIndex: 0,
color: '#DB4437'
}
}
}
I have checked the issue which you sent already.
This is not in the list.
Please advice me,
Thanks
Natarajan Govindavel
On Thursday, March 10, 2016 at 8:20:52 PM UTC+5:30, natarajan govindavel
wrote:
>
> Working fine.
> you are rocks sergey
>
> Thanks
> Natarajan Govindavel
>
>
> On Thursday, March 10, 2016 at 8:13:18 PM UTC+5:30, Sergey wrote:
>>
>> Natarajan,
>>
>> As I've said in an earlier email, you should only include /jsapi if you
>> use a GeoChart, and it doesn't appear that you do, so you should not
>> include it at all.
>>
>> Remember, that with the new loader, you need to do: google.*charts*.load
>> and google.*charts*.setOnLoadCallback.
>>
>> On Thu, Mar 10, 2016 at 9:15 AM natarajan govindavel <natara...@gmail.com>
>> wrote:
>>
>>> Hi Sergey,
>>>>
>>>> I tried your solution which is working fine in Firefox and Chrome but
>>>> Not in IE (checked with IE10,IE9,IE8,IE7).
>>>> It produce same issue . SCRIPT5007: Unable to get property
>>>> 'arrayToDataTable' of undefined or null reference.
>>>>
>>> I am using both classical and material charts on same page. should i
>>> include both library?
>>> <script type="text/javascript" src="https://www.google.com/jsapi
>>> "></script>
>>> <script type="text/javascript" src="
>>> https://www.gstatic.com/charts/loader.js";></script>
>>> google.setOnLoadCallback(function() {
>>> dataArray[0] =
>>> google.visualization.arrayToDataTable([['Status','Count'],['Open',183],['Closed',32]]);TitleArray[0]
>>>
>>> = 'Incident Status';;
>>> if (typeof dataArray[0] != "undefined") {
>>> // Array dynamically generated from code behind
>>>
>>> var options = {
>>> width: '100%',
>>> height: 400,
>>> titlePosition: 'none',//hiding the chart title
>>> legend: {
>>> position: 'bottom' //fix legend in bottom
>>> },
>>> is3D: true
>>> };
>>> var colors = new Array()
>>> for (var i = 0; i < dataArray[0].getNumberOfRows();
>>> i++) {
>>> if (dataArray[0].getValue(i, 0) == "Open")
>>> colors[i] = '#DB4437';
>>> else if (dataArray[0].getValue(i, 0) == "Closed")
>>> colors[i] = '#3FC380';
>>> else if (dataArray[0].getValue(i, 0) == "Incident
>>> Disposition")
>>> colors[i] = '#F9BF3B';
>>> }
>>> options.colors = colors;
>>> $('#status').text(TitleArray[0]);
>>> drawChart('Pie', dataArray[0], 'div_id_1', options);
>>> }
>>> });
>>>
>>>
>>>
>>>
>>>> Thanks
>>>> Natarajan
>>>>
>>>>
>>>> On Tuesday, March 8, 2016 at 8:22:16 PM UTC+5:30, Sergey wrote:
>>>>
>>>> It sounds like you're not putting your chart code into a callback. That
>>>> is, you're probably doing something like:
>>>> <script src=".../jsapi?autoload=..."></script>
>>>> <script>
>>>> var data = google.visualization.arrayToDataTable(...);
>>>> // more chart stuff
>>>> </script>
>>>>
>>>> When you should be doing:
>>>> ...
>>>> <script>
>>>> google.charts.load(...);
>>>> google.charts.setOnLoadCallback(drawChart);
>>>>
>>>> function drawChart() {
>>>> var data = google.visualization.arrayToDataTable(...);
>>>> // more chart stuff
>>>> }
>>>> </script>
>>>>
>>>> On Tue, Mar 8, 2016 at 1:50 AM natarajan govindavel <
>>>> natara...@gmail.com> wrote:
>>>>
>>>>
>>>> Hi Sergey,
>>>>
>>>> If i remove jsapi loader code as you said i faced the following issue.
>>>>
>>>> <script type="text/javascript" src="
>>>> https://www.gstatic.com/charts/loader.js";></script>
>>>> <%-- <script type="textSergey,/javascript" src="
>>>> https://www.google.com/jsapi?autoload={
>>>> 'modules':[{
>>>> 'name':'visualization',
>>>> 'version':'1.1',
>>>> 'packages':['corechart','bar','controls']
>>>> }]
>>>> }"></script>--%>
>>>> google.charts.load('current', {
>>>> 'packages': ['corechart','bar', 'controls']
>>>> });
>>>> it shows the error message. Uncaught TypeError: Cannot read property
>>>> 'arrayToDataTable' of undefined.
>>>> In the visualization charts not loaded.
>>>>
>>>> Thanks
>>>> Natarajan
>>>>
>>>> On Monday, March 7, 2016 at 8:39:37 PM UTC+5:30, Sergey wrote:
>>>>
>>>> Natarajan,
>>>>
>>>> *Please do not use autoload and the gstatic loader on the same page*.
>>>> This can lead to issues that are very difficult to figure out.
>>>>
>>>> The gstatic loader is the only place where we're pushing new versions
>>>> at this point. Loading jsapi as well will cause older versions to be
>>>> loaded. The gstatic loader should be the only loader you use at this point
>>>> (this means you should remove the jsapi script entirely, unless you use
>>>> the
>>>> GeoChart, in which case you still should not have it autoload). You need
>>>> to
>>>> add 'corechart' to your google.charts.load call though.
>>>>
>>>> Sadly, there is currently no way to hide an axis in Material Charts.
>>>>
>>>> On Mon, Mar 7, 2016 at 7:59 AM natarajan govindavel <
>>>> natara...@gmail.com> wrote:
>>>>
>>>> I forget to mention one thing. The below given chart is material chart.
>>>>
>>>>
>>>> On Monday, March 7, 2016 at 5:02:37 PM UTC+5:30, natarajan govindavel
>>>> wrote:
>>>>
>>>> Hi Sergey,
>>>>
>>>> Thank so much for your support. Almost fixed all the issues except one.
>>>> Is their anyway to hiding these (highlighted) supplementary axis from
>>>> the chart.
>>>>
>>>>
>>>> <https://lh3.googleusercontent.com/-BQreKtbVfs0/Vt1mVZ_4l2I/AAAAAAAAA0A/-RHFf_0xwKQ/s1600/Capture345.PNG>
>>>>
>>>> Thanks
>>>> Natarajan Govindavel
>>>>
>>>> On Wednesday, February 24, 2016 at 9:31:59 PM UTC+5:30, Sergey wrote:
>>>>
>>>> Hi Natarajan,
>>>>
>>>> You should be able to use html2canvas to save the charts as images, as
>>>> the stackoverflow post suggests. You may be aware that some of our charts
>>>> (like ComboChart and the rest of the charts provided by the 'corechart'
>>>> package) support getImageUri, which will basically allow you to save
>>>> images
>>>> of the charts, but Material Charts do not yet support this API.
>>>>
>>>> On Wed, Feb 24, 2016 at 10:26 AM natarajan govindavel <
>>>> natara...@gmail.com> wrote:
>>>>
>>>> Hi Sergey,
>>>>
>>>> Is there any other way to save material chart as images.
>>>> like given in that link :
>>>> http://stackoverflow.com/questions/6887183/how-to-take-screen-shot-of-a-div-with-javascript
>>>>
>>>> Thanks
>>>> Natarajan Govidavel
>>>>
>>>>
>>>> On Friday, February 19, 2016 at 8:43:59 PM UTC+5:30, Sergey wrote:
>>>>
>>>> So I don't see anything obviously wrong with your code. Could you link
>>>> to a page on which you're experiencing the error? If you're uncomfortable
>>>> sharing the link over the forum, feel free to send me a private message.
>>>>
>>>> On Fri, Feb 19, 2016 at 8:47 AM natarajan govindavel <
>>>> natara...@gmail.com> wrote:
>>>>
>>>> Hi sergey,
>>>>
>>>> I have seen below mentioned issue in browser console
>>>> Error: one or more fonts could not be loaded.
>>>>
>>>> In FireFox (44.0.2) this issue happen more frequently.
>>>> And I checked with the link
>>>>
>>>> https://groups.google.com/forum/#!topic/google-visualization-api/bSJLBO_fm2w
>>>>
>>>> so i changed from current to 43 still issue exists.
>>>> And my code is very complex because making the array dynamically from
>>>> webservice (asmx) and calling that data using jquery ajax.
>>>>
>>>> function ChangePeriodL(id) {
>>>> if (id != "") {
>>>> $(".loc").removeClass('active');
>>>> $(id).addClass('active');
>>>> value = $(id).attr('id');
>>>> event_id = "CLICK"; //click event
>>>> g_var = 0;
>>>> } else
>>>> value = 0;
>>>> $.ajax({
>>>> type: "POST",
>>>> url: "remote url",
>>>> contentType: "application/json; charset=utf-8",
>>>> dataType: "json",
>>>> data: JSON.stringify({
>>>> "timespan": value
>>>> }),
>>>> success: function(data) {
>>>> if (data.d != "Empty") {
>>>> addCode(data.d);
>>>> if (typeof dataArray[8] != "undefined") {
>>>> $('#AllLoc').text(TitleArray[8]);
>>>> if (dataArray[8].getNumberOfRows() > 3)
>>>> var height = dataArray[8].getNumberOfRows() *
>>>> 40 + 100; //Set dynamic height = Number of Rows * bar + padding
>>>> else
>>>> var height = 300;
>>>>
>>>> $('#div_id_9').height(height);
>>>> var chartnew = new
>>>> google.charts.Bar(document.getElementById('div_id_9'));
>>>> chartnew.draw(dataArray[8],
>>>> google.charts.Bar.convertOptions({
>>>> width: 1000,
>>>> height: '100%',
>>>> titlePosition: 'none', //hiding chart title
>>>> legend: {
>>>> position: 'right' //place chart legend at
>>>> right side
>>>> },
>>>> isStacked: true, //for stacked chart
>>>> vAxis: {
>>>> title: "Incident Count",
>>>> textStyle: {
>>>> color: 'black'
>>>> }
>>>> },
>>>> hAxis: {
>>>> title: "Locations",
>>>> textStyle: {
>>>> color: 'black'
>>>> }
>>>> },
>>>> bars: 'horizontal', //for showing bars
>>>> horizontal
>>>> series: {
>>>> 0: {
>>>> targetAxisIndex: 0,
>>>> color: '#F3C1BC'
>>>> },
>>>> 1: {
>>>> targetAxisIndex: 0,
>>>> color: '#E7827A'
>>>> },
>>>> 2: {
>>>> targetAxisIndex: 0,
>>>> color: '#DB4437'
>>>> }
>>>> }
>>>> }));
>>>> google.visualization.events.addListener(chartnew,
>>>> 'ready', myReadyHandler);
>>>> }
>>>> } else {
>>>> $('#AllLoc').text("All Incident By Location");
>>>> $("#div_id_9").html(message);
>>>> myReadyHandler(); // increment the g_var by 1 if no
>>>> record exists otherwise program thought still one chart not redered. by NG
>>>> 02/16/2016
>>>> }
>>>> },
>>>> error: function(x, e) {
>>>> alert(x.responseText);
>>>> }
>>>> });
>>>> }
>>>>
>>>> function addCode(code) {
>>>> var JS = document.createElement('script');
>>>> JS.text = code;
>>>> document.body.appendChild(JS);
>>>> }
>>>>
>>>> Thanks
>>>> Natarajan Govindavel
>>>>
>>>>
>>>> On Tuesday, February 16, 2016 at 8:57:53 PM UTC+5:30, Sergey wrote:
>>>>
>>>> Natarajan,
>>>>
>>>> We've seen a number of bugs with multiple Material charts not rendering
>>>> on the same page. I was under the impression that these issues were all
>>>> fixed (presuming you're using the latest Charts code). It is highly likely
>>>> that the issues are due to *how* you're using Charts, and not due to
>>>> Charts code itself. However, it is also possible that there's still a bug.
>>>> Without seeing the code that you're using, I couldn't say whether this is
>>>> a
>>>> bug in our code or in yours.
>>>>
>>>> On Mon, Feb 15, 2016 at 10:09 AM natarajan govindavel <
>>>> natara...@gmail.com> wrote:
>>>>
>>>> Hi Sergey,
>>>>
>>>> I have dynamically loading multiple charts in same page using jquery
>>>> and ajax.
>>>> Sometimes ( not frequent and random manner ) some of the charts not
>>>> displayed.
>>>> Is this known issue? Is there any workaround for this.
>>>> Please guide me.
>>>>
>>>> Thanks
>>>> Natarajan Govindavel
>>>>
>>>>
>>>> On Monday, February 1, 2016 at 3:15:29 PM UTC+5:30, natarajan
>>>> govindavel wrote:
>>>>
>>>> Hi Sergey,
>>>>
>>>> I have multiple charts on the same page.Everything working fine one of
>>>> the chart bar color not applied properly.
>>>> It shows the default color(blue). I faced this issue only in IE 9 and
>>>> IE 10.
>>>> i given my code below. please advice me
>>>>
>>>> var chartnew = new
>>>> google.charts.Bar(document.getElementById('div_id_9'));
>>>> chartnew.draw(dataArray[8],
>>>> google.charts.Bar.convertOptions({
>>>> width: 1000,
>>>> height: 330,
>>>> titlePosition: 'none',
>>>> legend: { position: 'right'},
>>>> isStacked: true,
>>>> vAxis: {title: "Incident Count",textStyle: {color:
>>>> 'black'}},
>>>> hAxis: {title: "Locations",textStyle: {color:
>>>> 'black'}},
>>>> series: {
>>>> 0:{
>>>> targetAxisIndex: 0,
>>>> color:'#F3C1BC'
>>>> },
>>>> 1:{
>>>> targetAxisIndex: 0,
>>>> color:'#E7827A'
>>>> },
>>>> 2:{
>>>> targetAxisIndex: 0,
>>>> color:'#DB4437'
>>>> }
>>>> }
>>>> }));
>>>> }
>>>>
>>>> Thanks
>>>> Natarajan Govindavel.
>>>>
>>>> On Friday, January 29, 2016 at 8:35:27 PM UTC+5:30, Sergey wrote:
>>>>
>>>> Forgot to answer the second part of your question, about the jsfiddle.
>>>> If you're asking whether the Classic Charts support axis formatting
>>>> options, they do: https://jsfiddle.net/88z92w4p/
>>>>
>>>> On Fri, Jan 29, 2016 at 10:03 AM Sergey Grabkovsky <gra...@google.com>
>>>> wrote:
>>>>
>>>> I don't have any estimates for when you might expect getImageURI for
>>>> Material Charts. We are currently prioritizing other features.
>>>>
>>>> On Fri, Jan 29, 2016 at 1:46 AM natarajan govindavel <
>>>> natara...@gmail.com> wrote:
>>>>
>>>> Hi Sergey,
>>>>
>>>> Thank you so much for your help. And one more help
>>>> When can we expect this feature (getImageURI()) because one of my
>>>> client really want this.
>>>> Can we do this kind dynamic charts in Classical Chart(ref below)?
>>>> https://jsfiddle.net/vqaLpc23/
>>>>
>>>> Thanks
>>>> Natarajan
>>>>
>>>>
>>>> On Thursday, January 28, 2016 at 8:31:40 PM UTC+5:30, Sergey wrote:
>>>>
>>>> Hi Natarajan,
>>>>
>>>> Your jsfiddle link doesn't link to your jsfiddle (it just links to an
>>>> empty fiddle). You need to save your fiddle before it gives you a valid
>>>> link. Presumably, you're talking about .getImageURI(), which is not
>>>> supported for Material Charts.
>>>>
>>>> On Thu, Jan 28, 2016 at 6:28 AM natarajan govindavel <
>>>> natara...@gmail.com> wrote:
>>>>
>>>> Hi Sergey,
>>>>
>>>> Do we have Export Option in Material Chart?
>>>> Can we do this kind dynamic charts in Classical Chart(ref below)?
>>>> https://jsfiddle.net/api/post/library/pure/
>>>>
>>>> Thanks
>>>> Natarajan Govindavel
>>>>
>>>>
>>>> On Monday, January 25, 2016 at 9:01:05 PM UTC+5:30, Sergey wrote:
>>>>
>>>> Hi Natarajan,
>>>>
>>>> The issue you are talking about now is a known issue. There are known
>>>> issues with text measurement with invisible divs. The recommended
>>>> workaround is to delay the chart rendering until the div becomes visible.
>>>>
>>>> On Mon, Jan 25, 2016 at 10:09 AM natarajan govindavel <
>>>> natara...@gmail.com> wrote:
>>>>
>>>> Hi Sergey,
>>>>
>>>> Thank you for your reply.
>>>> I have one more problem.
>>>> The Chart inside the tab which is not active(div display:none). The
>>>> chart not displayed properly.
>>>> If i make it visibility : Hidden/Visible it is rendering properly but
>>>> shows lot of empty space in the page.
>>>> Is this issue resolved?
>>>> Any fix available for this?
>>>>
>>>>
>>>>
>>>> On Friday, January 22, 2016 at 8:11:08 PM UTC+5:30, Sergey wrote:
>>>>
>>>> The Material Charts support putting the legend on the right or the
>>>> left, but not on top or bottom.
>>>>
>>>> On Fri, Jan 22, 2016 at 3:53 AM natarajan govindavel <
>>>> natara...@gmail.com> wrote:
>>>>
>>>> Hi Sergey,
>>>>
>>>> Thanks you so much for your quick response.
>>>> dataArray[2] is a type of DataTable only and which is generated
>>>> dynamically from code behind.
>>>> And one more clarification is legend position supported by Material
>>>> Charts?
>>>> Anyway i going to refer that link which is given by you.
>>>> Please add some more points that are already which is very useful for
>>>> me.
>>>>
>>>> Thanks again
>>>> Natarajan Govindavel
>>>>
>>>> and
>>>>
>>>>
>>>> On Thursday, January 21, 2016 at 10:23:07 PM UTC+5:30, Sergey wrote:
>>>>
>>>> Hi Natarajan,
>>>>
>>>> The first difference between the two is that the latter is a combo
>>>> chart. This means that it supports multiple series types, like line,
>>>> scatter, bar, and candlestick; where the first chart (google.charts.Bar)
>>>> only supports bars.
>>>>
>>>> The second difference is that google.charts.Bar is a Material Chart,
>>>> which effectively just means that it follows the Material Design
>>>> specification <https://design.google.com/>, and
>>>> google.visualization.{BarChart,ColumnChart,ComboChart} are our "Classic"
>>>> Charts, which means that they precede Material Design.
>>>>
>>>> The Material Charts are newer, which also means that they don't support
>>>> a lot of the features that the Classic Charts do. Here is a bug
>>>> tracking all the unsupported features
>>>> <https://github.com/google/google-visualization-issues/issues/2143>.
>>>> Note that "annotations" are on that list, which answers your last
>>>> question:
>>>> you currently cannot add annotations to Material Charts.
>>>>
>>>> On a side note, I'm not sure where you got the example that passes
>>>> "dataArray[2]" to the Material Chart's draw call, but that seems wrong. It
>>>> takes a DataTable, exactly like the Classic Charts do.
>>>>
>>>> On Thu, Jan 21, 2016 at 8:53 AM natarajan govindavel <
>>>> natara...@gmail.com> wrote:
>>>>
>>>> var chart = new google.charts.Bar(document.getElementById('div_id_3'));
>>>> chart.draw(dataArray[2],
>>>> google.charts.Bar.convertOptions(options2));
>>>>
>>>> And
>>>>
>>>> google.visualization.ComboChart(document.getElementById('chart_div'));
>>>>
>>>> chart.draw(view,options)
>>>>
>>>> what is the different between these two?
>>>>
>>>> How to add Annotation text for first one
>>>>
>>>>
>>>> --
>>>> 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 google-visualization-api+unsubscr...@googlegroups.com.
>>>>
>>>> To post to this group, send email to google-visua...@googlegroups.com.
>>>>
>>>>
>>>> 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/cdc705b3-181b-4028-b924-bd88cfafbd43%40googlegroups.com
>>>>
>>>> <https://groups.google.com/d/msgid/google-visualization-api/cdc705b3-181b-4028-b924-bd88cfafbd43%40googlegroups.com?utm_medium=email&utm_source=footer>
>>>> .
>>>> For more options, visit https://groups.google.com/d/optout.
>>>>
>>>> --
>>>>
>>>> *[image: unnamed.gif]<td *
>>>>
>>>>
--
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 google-visualization-api+unsubscr...@googlegroups.com.
To post to this group, send email to google-visualization-api@googlegroups.com.
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/6f0df3fb-011a-4e71-8c87-89c9fe98abc8%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
