CCS/MSP430F5529: How to use the Line Graph in GUI?

lynn liu53

Part Number: MSP430F5529

Tool/software: Code Composer Studio

I would like to know how to use the Line Graph in TI GUI Composer? Because the accepted vaules reading from GUI like these:

{"V":2065,"C":285}

{"V":2065,"C":276}

{"V":2065,"C":269}

and the line graph only accepts the series values.

Thanks.

over 8 years ago

0 AartiG over 8 years ago

TI__Guru**** 173310 points

Are you using online GUI Composer v2?

Are you trying to plot values coming from the target (passed via JSON strings) or directly specifying the values in the Graph properties?
Please take a look at these related threads here and here , and let us know if it still does not help answer your question.

0 lynn liu53 over 8 years ago in reply to AartiG

Prodigy 40 points

Hi AartiG,

Yes, I am using online GUI Composer v2 via JSON. I still stuck with the plotting the line graph. I have read two sources, but the question didn't figure out.Here my example code is

var result[];

gc.databind.registry.bind('widget.ti_widget_linegraph.series_0_values', "widget.ti_widget_numberbox.value",
function(result) {
var points_string = "";
for(var i=1; i<result.length; i++){
points_string = result + ";"+ points_string ;
}
return points_string;

});

Would you give me a good example to work properly?Many thanks.

0 MartinS over 8 years ago in reply to lynn liu53

TI__Genius 15860 points

Hi Lynn,

I am not sure if two fields in your json are intended to represent x/y axis in your graph or two different lines. However, if you want to graph two independent lines, then I would suggest that you use Scalar Graph widget. In the binding you would set value_0 property to "v", take a look at tutorial available at link below. The tutorial shows a simple JSON object with a single field, which is bound to a LED widget. The process to bind a scalar graph widgets value_0 property would be the same.

You can configure how big the buffer should be in property page as well.

If you are looking for x/y type graph and V/C fields are corresponding to x/y coordinates, then I would suggest that you create a new customCodec_0.js file (from File->New menu) and take a look at its decode function. There is a commented out example code that shows how to parse json objects. You could insert your data accumulation function there and then add a plotly graph and then configure its x/y properties to graph it. You could probably take a look at application available on second link below (which you can import into GUI Composer designer and expand the folder view to see its files) as an example. The application is implemented not to accept JSON but rather a custom set of data that looks like below, which are readings from two sensors that this particular app uses.

1234

4567

8976

3322

Code Composer Studio™︎

Code Composer Studio forum

CCS/MSP430F5529: How to use the Line Graph in GUI?