"xxxxxx is not a valid hex color" error in column chart with annotation column

1,028 views
Skip to first unread message

chris....@gmail.com

unread,
May 22, 2014, 8:39:44 AM5/22/14
to google-visua...@googlegroups.com
Is this a bug in the API, or is it me? The following chart throws an "xxxxxx is not a valid hex color" error. If I remove the color option, the chart is drawn correctly. If I remove the annotation column, the chart is drawn correctly. But with both the annotation column and the color option, the error occurs.

<html>
<head>
<script src="https://www.google.com/jsapi" type="text/javascript"></script>
<script>
google.load('visualization', '1.0', {packages:['corechart']});
google.setOnLoadCallback(create_chart);
function create_chart() {
  data = new google.visualization.DataTable();
  data.addColumn('string', 'X');
  data.addColumn('number', 'Y');
  data.addColumn({type:'string', role:'annotation'});
  data.addRows([
    ['Monday',1,'a1'],
    ['Tuesday',2,'a2'],
    ['Wednesday',3,'a3']]);
  options = {width:400,height:200,series:[{color:'FF0A4B'}]};
  chart = new google.visualization.ColumnChart(document.getElementById('chart_1'));
  chart.draw(data, options);
}
</script>
</head>
<body>
<div id="chart_1"></div>
</body>
</html>

Sergey Grabkovsky

unread,
May 22, 2014, 9:43:26 AM5/22/14
to google-visua...@googlegroups.com
Hex colors must be specified with a '#' in front. To correct your example, the new options would be:
  options = {width:400,height:200,series:[{color:'#FF0A4B'}]};
--
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-visualizati...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/d/optout.

chris....@gmail.com

unread,
May 22, 2014, 10:30:40 AM5/22/14
to google-visua...@googlegroups.com
Many thanks Sergey. It's a bit odd though. I always specify colours without the # and this is the only case that has ever generated an error. It also appears this is one place you can't use colour names ('red' is not a valid hex color).

Sergey Grabkovsky

unread,
May 22, 2014, 10:46:56 AM5/22/14
to google-visua...@googlegroups.com
You are absolutely correct. After investigating a bit further, this is indeed a bug that only occurs for ColumnCharts with annotations. You can expect this to be fixed in v40, our next release.


On Thu May 22 2014 at 10:30:43 AM, <chris....@gmail.com> wrote:
Many thanks Sergey. It's a bit odd though. I always specify colours without the # and this is the only case that has ever generated an error. It also appears this is one place you can't use colour names ('red' is not a valid hex color).

--
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+unsub...@googlegroups.com.
To post to this group, send email to google-visualization-api@googlegroups.com.

chris....@gmail.com

unread,
May 22, 2014, 11:35:56 AM5/22/14
to google-visua...@googlegroups.com
I'm sure that when I started using the API the # wasn't specified, or maybe I just picked up an incorrect example from somewhere. Anyway, the documentation definitely shows colours defined with # so I will change my code. 

Thanks again.
Reply all
Reply to author
Forward
0 new messages