Features
This bar graph is created to show simple data with customizable UI.
Getting started
- The size occupied by the graph is Before:
MediaQuery.of(context).size.height * 0.6
Now: Height of the bar graph will based on the user's input.
- The bar graph requires four data.
List<GraphModel>, double, Color, Color, double.dart pu
-
The array of GraphModel is used for plotting the data in graph bar.
-
The GraphModel consist of three data.
I. dateData
i. Doesn't necessary mean it only requires date. This is a string so the user can change what should be words under the value.
II. valueData
i. double which will be shown in the bar graph.
III. colorData
i. To make the UI customizable, this is also required so the user can input what is the color of the data.
-
The double required is the largest value/data from the graph bar.
-
The first color is for background color and the second is for text color.
Usage
Sample for getting the largestData:
double largestData = 0;
for(var item in graphModelList)
{
var itemValue = item.valueData;
if(itemValue > largestData)
{
setState((){
largestData = itemValue;
});
}
}
Sample for list of GraphModel:
List<GraphModel> graphModelList = [];
graphModelList.add
(
GraphModel
(
dateData: "07-02",
valueData: 9,
colorData: Colors.cyan
)
);
Sample for BarGraph:
BarGraph
(
graphData: graphModelList,
largestValue: largestData,
backgroundColor: Colors.black,
textColor: Colors.white,
graphHeight: 300.0
)