Graph Animation for bolt graphs

1

For google charts the command setAnimation(true); works but what command to use for boltGraph(); because setAnimation doesn’t work on that?

2

Try this format:

var lineGraph = new boltGraph();
lineGraph.setChartType("lineGraph");
lineGraph.setAxisName('X-Axis Name','Y-axis Name');
lineGraph.plotChart('time_stamp','var1');
var barGraph = new boltGraph();
barGraph.setChartType("barGraph");
barGraph.setAxisName('X-Axis Name','Y-axis Name');
barGraph.plotChart('time_stamp','var6');
3

I know the code but how to add animation in this?

5

HELLO @siddharthoza00 I was facing the same problem,

  1. In your code enter setAnimation(true);
  2. save the code and deploy the configuration
  3. now when your click on view device , your page will open
  4. **the ANIMATION works at the 1st 2 seconds after the page loads , you will see your graph forming form the bottom in a animation form
  5. As in case if you setAnimation(false) you will see graph forms directly

hope the clear you , mark solution if helpfull

6

Does setAnimation(true); work for bolt chart library?

7

@siddharthoza00 , see the BOLT Cloud platfrom gives us the access to use different charts. These graphs ranges from Line Graphs to Gauge Graphs. In order to use these different types of graphs, first you have to set the chart library to GoogleChart and then you have to define the axis’ name and so on and so forth.

Basically the setAnimation() function accepts a boolean type argument i.e. true or false. This function describes how to animate modifications made to a chart, instead of applying them instantly. setAnimation() function supports the following options as parameter- true, false. It is enabled (true) by default and this function should be called before the plotChart() function.

If you want the real-time effect of this function, then first made a product and write the necessary code for that in order to plot the graph and then click on View this device. Then you will be re-directed to the page where you can see the graph. On that page click on the button Push Data to cloud to instantly push the new reading to the graph, then you would see that the line of the graph from the old point to the new point will be in a transiting way (it will move towards the end point). Even after the page loads you can see the transition.

As I have told that by default the setAnimation() is set to true that means even if you don’t write this, the animations will be there. So, once write setAnimation(fale) and then click on Push Data to Cloud, you will youself see the difference.

As you can use the graphs only after using the function setChartLibrary() it means that setAnimation() works for all these.

bolt chart library is nothing, we use GoogleChart library to use the different charts

1 Like
8

can I use multiple google charts in a project like a bar graph and a line graph together?

9

Yes you can pretty much.

10

Yes @siddharthoza00 , if you are handy with the code for each of the graphs then you can plot any number of graphs together :slight_smile: