How to pass custom object for graph point on HighCharts Android ?
I want to pass extra information other than x and y values for point on graph. That extra information i want to use in tooltip.
How to achieve this on Android ?
I tried something like this, but it did not work.
data class GraphPoint(val x:Float, val y:Float, val date:Long)
val readings = ArrayList<List<GraphPoint>>()
readings.add(GraphPoint(1f, 10f, 1657255313)
readings.add(GraphPoint(2f, 5f, 1657255351)
readings.add(GraphPoint(3f, 20f, 1662612113)
val scatter = HIScatter()
scatter.data = readings
Answered here
https://github.com/highcharts/highcharts-android/issues/237
For that case, we will need to use maps. In tooltip, we will need to refer to point parameter by its map key equivalent (e.g. point.{key_name}). Check out this example:
HIChartView chartView = findViewById(R.id.chartview1);
HIOptions options = new HIOptions();
HILegend legend = new HILegend();
legend.setEnabled(false);
options.setLegend(legend);
HITooltip tooltip = new HITooltip();
tooltip.setHeaderFormat("<span style=\"font-size:11px\">{series.name}</span><br>");
tooltip.setPointFormat("<b>X: {point.x:.2f}%</b> <b>Y: {point.y:.2f}%</b><br/>Date: point.date");
options.setTooltip(tooltip);
HIScatter series1 = new HIScatter();
HashMap<String, Object> map1 = new HashMap<>();
map1.put("date", 1657255313);
map1.put("x", 1);
map1.put("y", 10);
HashMap<String, Object> map2 = new HashMap<>();
map2.put("date", 1657255351);
map2.put("x", 2);
map2.put("y", 5);;
HashMap<String, Object> map3 = new HashMap<>();
map3.put("date", 1662612113);
map3.put("x", 3);
map3.put("y", 20);
HashMap[] series1_data = new HashMap[] { map1, map2, map3 };
series1.setData(new ArrayList<>(Arrays.asList(series1_data)));
options.setSeries(new ArrayList<>(Arrays.asList(series1)));
chartView.setOptions(options);
Related
I am working on android. By using highchart I have created a barchart.
HIOptions options = new HIOptions();
HIChart chart = new HIChart();
chart.setType("bar");
options.setChart(chart);
HITitle title = new HITitle();
title.setText("GOLM");
options.setTitle(title);
HISubtitle subtitle = new HISubtitle();
subtitle.setText("Growth Over Last Month");
options.setSubtitle(subtitle);
HIXAxis xaxis = new HIXAxis();
String[] categories = new String[] { "Mar-2021", "Apr-2021","May-2021"};
xaxis.setCategories(new ArrayList<>(Arrays.asList(categories)));
options.setXAxis(new ArrayList<HIXAxis>(){{add(xaxis);}});
HIYAxis yaxis = new HIYAxis();
yaxis.setMin(0);
yaxis.setTitle(new HITitle());
yaxis.getTitle().setText("Sales");
yaxis.getTitle().setAlign("high");
yaxis.setLabels(new HILabels());
yaxis.getLabels().setOverflow("justify");
options.setYAxis(new ArrayList<HIYAxis>(){{add(yaxis);}});
HITooltip tooltip = new HITooltip();
options.setTooltip(tooltip);
HILegend legend = new HILegend();
legend.setLayout("vertical");
legend.setAlign("right");
legend.setVerticalAlign("top");
legend.setX(-30);
legend.setY(40);
legend.setFloating(true);
legend.setBorderWidth(1);
legend.setBackgroundColor(HIColor.initWithHexValue("FFFFFF"));
legend.setShadow(true);
options.setLegend(legend);
HICredits credits = new HICredits();
credits.setEnabled(false);
options.setCredits(credits);
HIBar bar1 = new HIBar();
bar1.setName("Sale");
Number[] bar1Data = new Number[]{10,15,20};
bar1.setData(new ArrayList<>(Arrays.asList(bar1Data)));
bar1.setColorByPoint(true);
HILegend hiLegend = new HILegend();
hiLegend.setEnabled(false);
options.setLegend(hiLegend);
options.setSeries(new ArrayList<>(Collections.singletonList(bar1)));
golmChart.setOptions(options);
Output
I want to enable the data labels. The sample code does give a code to enable data labels but it's not working
HIPlotOptions plotOptions = new HIPlotOptions();
plotOptions.setBar(new HIBar());
plotOptions.getBar().setDataLabels(new HIDataLabels());
plotOptions.getBar().getDataLabels().setEnabled(true);
options.setPlotOptions(plotOptions);
It's giving me an error
error: incompatible types: HIDataLabels cannot be converted to ArrayList
plotOptions.getBar().setDataLabels(new HIDataLabels());
Source: Android Basic Bar
Any help would be highly appreciated.
They have changed the datalabel property. Now you have to do the following
HIDataLabels dataLabels = new HIDataLabels();
dataLabels.setEnabled(false);
ArrayList<HIDataLabels> dataLabelsList = new ArrayList<>();
dataLabelsList.add(dataLabels);
bar1.setDataLabels(dataLabelsList);
Try the above code after you set data to bar1
For more information see this comment
so am plotting a graph using com.jjoe64.graphview.GraphView. and from my API am passing only the last 6 value. But the problem is that it does not plot all the 6 it only plot 4 points on the graph and i don't know why.
the code below is a chunk of code from my onPostExecute method in my Asynctask class.
if (valuationList.size() >6){
valuationList = valuationList.subList(valuationList.size() -6,valuationList.size());
totalUnitPoint = new ArrayList<>(totalUnitPoint.subList(totalUnitPoint.size() - 6, totalUnitPoint.size()));
currentValuePoint = new ArrayList<>(currentValuePoint.subList(currentValuePoint.size() - 6, currentValuePoint.size()));
}
DataPoint [] cummuDataPointArr = totalUnitPoint.toArray(new DataPoint[totalUnitPoint.size()]);
LineGraphSeries<DataPoint> cummulativeSeries = new LineGraphSeries<>(cummuDataPointArr);
StaticLabelsFormatter staticLabelsFormatter = new StaticLabelsFormatter(cummulativeChart);
staticLabelsFormatter.setHorizontalLabels(valuationList.toArray(new String[valuationList.size()]));
//staticLabelsFormatter.setVerticalLabels(new String[] {"low", "middle", "high"});
cummulativeChart.getGridLabelRenderer().setLabelFormatter(staticLabelsFormatter);
cummulativeChart.addSeries(cummulativeSeries);
cummulativeSeries.setColor(R.color.royal_blue);
cummulativeChart.setTitle("Units Acquired");
cummulativeChart.getGridLabelRenderer().setVerticalAxisTitle("Cummulative Units");
cummulativeChart.getGridLabelRenderer().setHorizontalAxisTitle("Months");
cummulativeSeries.setDrawDataPoints(true);
cummulativeSeries.setDataPointsRadius(10);
cummulativeSeries.setThickness(2);
DataPoint [] currentDataPointArr = currentValuePoint.toArray(new DataPoint[currentValuePoint.size()]);
LineGraphSeries<DataPoint> currentSeries = new LineGraphSeries<>(currentDataPointArr);
StaticLabelsFormatter currentFormatter = new StaticLabelsFormatter(currentChart);
currentFormatter.setHorizontalLabels(valuationList.toArray(new String[valuationList.size()]));
currentChart.getGridLabelRenderer().setLabelFormatter(currentFormatter);
currentChart.addSeries(currentSeries);
currentSeries.setColor(R.color.green);
currentChart.setTitle("RSA Balance (Naira)");
currentChart.getGridLabelRenderer().setVerticalAxisTitle("Current Value");
currentChart.getGridLabelRenderer().setHorizontalAxisTitle("Months");
currentSeries.setDrawDataPoints(true);
currentSeries.setDataPointsRadius(10);
currentSeries.setThickness(2);
Please i need you help to fix this
I am using the android API for heatmap. I've imported the dependencies and added the heatmap code at the end of my activity.
List<String> temp = Arrays.asList(coordinates.get(i).split(";"));
LatLng coor = new LatLng(Double.parseDouble(temp.get(1)), Double.parseDouble(temp.get(2)));
// Create a heat map tile provider, passing it the latlngs
WeightedLatLng data = new WeightedLatLng(coor, Double.parseDouble(temp.get(0)) );
mProvider = new HeatmapTileProvider.Builder()
//.weightedData(data) //doesn't work
.data(coor) //doesn't work either
.build();
}
I get the following error in the weightedData line:
WeightedData(java.util.Collection<com.google.maps.android.heatmaps.WeightedLatLng>) in Builder cannot be applies (com.google.maps.android.heatmaps.WeightedLatLng)
I tried adding a cast, but that makes the app crash. I have been googling for a long time and trying all kinds of things. Any ideas?
Builder weightedData and data methods take as a parameter a collection:
weightedData(Collection<WeightedLatLng> val)
Try adding all your data to an ArrayList and then pass it to your builder.
WeightedLatLng data = new WeightedLatLng(coor, Double.parseDouble(temp.get(0)) );
ArrayList<WeightedLatLng> weightedLatLngs = new ArrayList<>();
weightedLatLngs.add(data);
mProvider = new HeatmapTileProvider.Builder().weightedData(weightedLatLngs).build();
Ideally your heatmap should contain many weighted latlngs, so loop through your coordinates and add them all into the arraylist.
Hi i think you should write code like this
List<String> temp = Arrays.asList(coordinates.get(i).split(";"));
LatLng coor = new LatLng(Double.parseDouble(temp.get(1)), Double.parseDouble(temp.get(2)));
// Create a heat map tile provider, passing it the latlngs
WeightedLatLng data = new WeightedLatLng(coor, Double.parseDouble(temp.get(0)) );
mProvider = new HeatmapTileProvider.Builder();
mProvider.weightedData(data);
mProvider.data(coor);
mProvider = mProvider.build();
Hi i have a Bar graph using android GraphView. have 3 series that i need to pass into it but its currently drawing all 3 series onto of each other is there a way to change the width of the bar so that it shows
heres what i have sofar
try{
JSONArray graphArray = returnGraphyArray(statistics);
if(graphArray != null){
int graphLength = graphArray.length();
GraphViewData[] calls = new GraphViewData[graphLength];
GraphViewData[] length = new GraphViewData[graphLength];
GraphViewData[] transfered = new GraphViewData[graphLength];
for(int r = 0; r < graphLength; r++){
JSONObject row = graphArray.getJSONObject(r);
calls[r] = new GraphViewData(r,Integer.parseInt(row.getJSONObject("data").getString("total_calls")));
length[r] = new GraphViewData(r,Integer.parseInt(row.getJSONObject("data").getString("avg_call_length"))/60);
transfered[r] = new GraphViewData(r,Integer.parseInt(row.getJSONObject("data").getString("calls_transferred")));
}
GraphViewSeries totalCallsSeries = new GraphViewSeries( "Total Calls", new GraphViewSeriesStyle(getResources().getColor(R.color.pink), 5),calls);
GraphViewSeries totalCallLengthSeries = new GraphViewSeries( "Total Call Length", new GraphViewSeriesStyle(getResources().getColor(R.color.green), 5),length);
GraphViewSeries totalCallsTransSeries = new GraphViewSeries( "Calls Transfered", new GraphViewSeriesStyle(getResources().getColor(R.color.blue), 5),transfered);
BarGraphView graphView = new BarGraphView(context, "");
graphView.addSeries(totalCallLengthSeries);
graphView.addSeries(totalCallsTransSeries);
graphView.addSeries(totalCallsSeries); // data
graphView.setHorizontalLabels(bottomlabels);
graphView.setShowLegend(false);
graphView.setLegendAlign(LegendAlign.TOP);
graphView.setLegendWidth(SM_Global.pxFromDp(context, 100));
graphView.getGraphViewStyle().setNumHorizontalLabels(6);
layout.addView(graphView);
}else{
layout.setVisibility(View.GONE);
ImageView legend = (ImageView)v.findViewById(R.id.graph_legend);
legend.setVisibility(View.GONE);
}
According to the GraphView website:
"Note: It is currently not possible to plot multiple bar charts. To say it more in detail: It is possible, but the bars will be rendered at the same position and so they will be overlapped."
I would suggest using AChartEngine instead. Here's the link to the jar file
https://code.google.com/p/achartengine/downloads/list
and here's an example
http://wptrafficanalyzer.in/blog/android-drawing-bar-chart-using-achartengine/
How can I make my GraphView always start on zero and not on the lowest number of my data ? For example if my data received is {10,44,1,15}, the bottom one will be the 1 and I wanted to be zero. How can I do that ?
And how can I make the GraphViewSeries dynamically ? For example I receive an array with data and I want depending the size of the array to make the GraphViewSeries, like if I receive an array with 3 elements the GraphViewSeries will be like this:
GraphViewSeries exampleSeries = new GraphViewSeries(
new GraphViewData[] {
new GraphViewData(1, total[0]),
new GraphViewData(2, total[1]),
new GraphViewData(3, total[2])});
If the array has 5 elements with would be like this:
GraphViewSeries exampleSeries = new GraphViewSeries(
new GraphViewData[] {
new GraphViewData(1, total[0]),
new GraphViewData(2, total[1]),
new GraphViewData(3, total[2]),
new GraphViewData(4, total[3]),
new GraphViewData(5, total[4]) });
How can I do this ?
You can set the min and max values like this:
GraphView graphView = new LineGraphView(context, "Graph name")
graphView.setManualYAxisBounds((double) max, (double) min);
For dynamic series you can do this:
GraphViewData[] data = new GraphViewData[total.length];
for (int a = 0; a < total.length; a++) {
data[a] = new GraphView.GraphViewData(a, total[a]);
}
then you add your data to a series like this:
GraphViewSeriesStyle style = new GraphViewSeriesStyle(Color.rgb(150, 150, 150), 2);
GraphViewSeries series = new GraphViewSeries(driverName.substring(0, 3).toUpperCase(), style, data);
for the official documentation refer to here.
In GraphView 4.x, setting the axis min and max values has to be done via the viewport:
graphView.getViewport().setYAxisBoundsManual(true);
graphView.getViewport().setMinY(min);
graphView.getViewport().setMaxY(max);
'graphView.setManualYAxisBounds()' no longer exists.
See also http://www.android-graphview.org/documentation/migration-from-31-to-40