How to change bar color in pocket query template

I want to change bar color in pocket query template which is written as below, default color is blue but i want to change as per my requirement. Please suggest.

<script>
PocketQuery.chart('ColumnChart', {
  title: ''Test",
  width: 500,
  height: 450,
  showTip: true
});

1 answer

1 accepted

This widget could not be displayed.

Hi Chandra,

Thank you for using PocketQuery!

To change the bar color, you simply need one more line of code:

&lt;script&gt;
PocketQuery.chart('ColumnChart', {
  title: "Test",
  width: 500,
  height: 450,
  showTip: true,
  colors:['#ff0000']
});
&lt;/script&gt;

Does this work for you?

Please let me know, if you need further help!

Best regards,

Carla

Hi Chandra,

Did my answer solve your issue? If it did, it would be very helpful if you could "accept" it - that way other users can see at the first glance that this question has a working solution.

HI Harth,

Your answer has helped me to resolve the one point, is it possible to force barchart to start from 0 always and then accordingly it will create bar, instead of start it from some base value which is the lowest value like I have value starting from 52 so my bar chart starts from 50 instead of 0, and next value I have for other graph is 55, though the difference is not much but in graph its big, becuase graphs start from 50 not 0, could you please help me in this.

Hi Kulbhushan,

are we talking about a BarChart or a ColumnChart? Additionally, a screenshot of how your chart looks like right now and the code of your template would be really helpful.

There are options like "vAxis: {minValue: 0}" and "vAxis: {viewWindow: {min:0}}" and maybe they do what you need. But I can't say that for sure without some more details about your current setup.

Please, feel free to open a new question here on answers using the label "addon-de.scandio.confluence.plugins.pocketquer". Then we can get into more details there.

Regards,

Carla

we are talking about columnchart here,

<script>

PocketQuery.chart('ColumnChart', {

  title: '',

  width: 370,

  height: 400,

  colors: ['#66AA00'],

  bar: {groupWidth: "30%"},

legend: {position: 'none'},

  showTip: true

});

</script>

Hi Carla,

Any update on this?

Thanks!

Kulbhushan Mayer

Hi Kulbhushan,

For me it worked with the option "vAxis: {viewWindow: {min:0}}" - have you tried that already?

My complete template looked like this (I hardcoded some data similar to yours, of course you can omit the whole dataTable attribute):

&lt;script&gt;
PocketQuery.chart('ColumnChart', {
	dataTable: [['Month', 'Value'], 
		['JAN-17', 52.1],
		['FEB-17', 51.2], 
		['MAR-17', 51.7]
		],
	width: 370,
	height: 400,
	colors: ['#66AA00'],
	bar: {groupWidth: "30%"},
	legend: {position: 'none'},
	showTip: true,
	vAxis: {viewWindow: {min:0}}
});
&lt;/script&gt;

Edit: Alternatively, it should also work with "isStacked: true". You can find more information on this here: https://developers.google.com/chart/interactive/docs/gallery/columnchart#stacked-column-charts

Thanks Carla, It worked fine for me. I am marking this as bookmark this link for all our template queries smile

I am glad I could help smile

Two more links, that might come handy:

Have fun exploring the possiblities of PocketQuery!

If you are satisfied with our plugin, would you mind leaving a review at the marketplace? We would highly appreciate!

Thanks again for the help you provide.

Suggest an answer

Log in or Sign up to answer
Atlassian Summit 2018

Meet the community IRL

Atlassian Summit is an excellent opportunity for in-person support, training, and networking.

Learn more
Community showcase
Published Tuesday in Confluence

Add-on evaluation with confluence templates

Atlassian market place contains number of Apps/Addons which improves the capability of out of the box Atlassian products. It is good to follow a plugin evaluation process before install add-ons. So t...

75 views 9 6
Read article

Atlassian User Groups

Connect with like-minded Atlassian users at free events near you!

Find a group

Connect with like-minded Atlassian users at free events near you!

Find my local user group

Unfortunately there are no AUG chapters near you at the moment.

Start an AUG

You're one step closer to meeting fellow Atlassian users at your local meet up. Learn more about AUGs

Groups near you