How to change annotation font and tick color/opacity?

[Roberto Tremonti]

Hi guys,

I'm trying to find a way to change font and tick color/opacity for annotations in a area chart.

I can't find any options in documentation.

At the moment I change style using a JS function on chart redraw.

function cleanStyle () {

var rectTags = document.getElementsByTagName("rect");

for (var i = 0; i < rectTags.length; i++) {

if (

rectTags[i].hasAttribute("width") &&

parseInt(rectTags[i].getAttribute("width")) == 1

) {

rectTags[i].setAttribute("fill", "white");

rectTags[i].setAttribute("opacity", 0.5);

}

}

var textTags = document.getElementsByTagName("text");

for (var i = 0; i < textTags.length; i++) {

textTags[i].setAttribute("font-family", "HelveticaNeue-Light");

}

}

It's rough but it works, as my only rect and text elements are related to annotations.

Release notes for latest version of Jan 29th talk about "A set of boxStyle options for annotations." but I can't find them in documentation.

Thanks for your help.

[Jon Orwant]

Hi Roberto, 

I'll add documentation for boxStyle in a few hours, but here's a glimpse:

'annotations': {
      'textStyle': {
        'fontSize': 10,
        'auraColor': 'none'
      },
      'boxStyle': {
        'stroke': '#888888', 'strokeWidth': 0.5,
        'rx': 2, 'ry': 2,
        'gradient': {
          'color1': '#eeeeee',
          'color2': '#dddddd',
          'x1': '0%', 'y1': '0%',
          'x2': '0%', 'y2': '100%',
          'useObjectBoundingBoxUnits': true
        }
     }
}

Jon

--
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/groups/opt_out.

[Roberto Tremonti]

Thanks, Jon, but it doesn’t solve my problem.

I thought there were options to change font and tick color/opacity.

Font is Arial.

Tick color is gray with full opacity.

You can’t change these styles.

Perhaps a new feature in next release?

[Jon Orwant]

Hi Roberto, you can change the font type and label opacity.  

annotations: { 

  textStyle: {

    fontName: 'Times-Roman',

    opacity: 0.1,

  }

}

Unfortunately, you can't change the leaderline (which I think is what you mean by "tick") opacity.  I'll add that as a feature request, but it may be a long time before we can get to it -- too much else to do!

Jon

[Sergey Grabkovsky]

If by "tick" you mean the annotation stem, then the option you're looking for is annotations.stemColor. Here is a jsfiddle: http://jsfiddle.net/PK25R/

- Sergey

[Roberto Tremonti]

Thanks, Jon.

[Roberto Tremonti]

Thanks, Sergey.

Yes, I was talking about the stem.

It works great.

I didn’t know this options and still can’t find it in documentation.

[Sergey Grabkovsky]

Yes, this option is unfortunately undocumented. We're working on it =)

- Sergey

[Daniel Giagnorio]

if you don't want the stem you can put: annotations: {stemColor: "none"}

[Dinara Krasilnikova]

Thanks a lot, Sergey!

Your advise really helped me, because this is still not in docs.

Dinara

четверг, 30 января 2014 г., 17:52:50 UTC+1 пользователь Sergey написал:

- Sergey

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-visua...@googlegroups.com.
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/groups/opt_out.

--
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.