从 firebase firestore 获取数据并在单击 cardview 时使用 highcharts 绘制直方图 - android
Fetch data from firebase firestore and plot histogram using highcharts when cardview clicked - android
我有一个 activity，其中有许多卡片视图，单击它们时应该从 firebase firestore 获取数据，并在 android.On 每个卡片视图点击中使用 highcharts 以直方图格式绘制数据在 firestore 查询中传递该 cardview 的 d 并且相关数据是 retrieved.But 在我的例子中，卡片视图仅在第二次单击时起作用，并且当单击不同的卡片视图时它保留前一个的值查询，只有在第二次点击时它才会显示正确的数据。
下面是我的适配器视图代码，其中包含卡片视图。
DocumentReference docRef = rootRef.collection("Users").document(tId).collection("Subjects")
.document(subId).collection("Marks").document(testList.get(position).getMarksID());
holder.show_graph.setOnClickListener(v -> {
docRef.get().addOnSuccessListener(documentSnapshot -> {
mMarks = new HashSet<>();
if (documentSnapshot != null && documentSnapshot.exists()) {
Map<String, Object> hm = documentSnapshot.getData();
Set<String> a = hm.keySet();
for (String b : a) {
try {
holder.marks_obtained.setText((String)documentSnapshot.get(email));
if(!b.equals("Max_marks")){
Log.e( "onComplete: ", documentSnapshot.get(b+".com") + " " +documentSnapshot.getId() );
mMarks.add(Float.parseFloat((String)documentSnapshot.get(b+".com")));
}
} catch (Exception e) {
e.printStackTrace();
}
}
}
});
v = LayoutInflater.from(context).inflate(R.layout.graph_plot,null);
final View alertLayout = v;
try{
//HICharts
HIChartView chartView = alertLayout.findViewById(R.id.hc);
chartView.plugins = new ArrayList<>(Arrays.asList("histogram-bellcurve"));
HIOptions options = new HIOptions();
HIChart chart = new HIChart();
chart.setType("variwide");
options.setChart(chart);
HITitle title = new HITitle();
title.setText("Score Division");
options.setTitle(title);
HIXAxis xaxis1 = new HIXAxis();
HITitle ht = new HITitle();
ht.setText("Count");
xaxis1.setTitle(ht);
HIXAxis xaxis2 = new HIXAxis();
xaxis2.setTitle(new HITitle());
xaxis2.setOpposite(true);
options.setXAxis(new ArrayList<>(Arrays.asList(xaxis1, xaxis2)));
HIYAxis yaxis1 = new HIYAxis();
HITitle ht2 = new HITitle();
ht2.setText("Marks");
yaxis1.setTitle(ht2);
HIYAxis yaxis2 = new HIYAxis();
yaxis2.setTitle(new HITitle());
yaxis2.setOpposite(true);
options.setYAxis(new ArrayList<>(Arrays.asList(yaxis1, yaxis2)));
HILegend legend = new HILegend();
legend.setEnabled(true);
options.setLegend(legend);
HIHistogram series1 = new HIHistogram();
series1.setType("histogram");
series1.setName("Histogram");
series1.setXAxis(1);
series1.setYAxis(1);
series1.setBaseSeries("s1");
series1.setZIndex(-1);
HIScatter series2 = new HIScatter();
series2.setType("scatter");
series2.setName("Data");
Number[] series2_data = new Number[mMarks.size()];
int i = 0;
for(float m : mMarks){
series2_data[i] = m;
i++;
}
series2.setId("s1");
series2.setData(new ArrayList<>(Arrays.asList(series2_data)));
series2.setMarker(new HIMarker());
series2.getMarker().setRadius(2.5);
options.setSeries(new ArrayList<>(Arrays.asList(series1, series2)));
options.setExporting(new HIExporting());
options.getExporting().setEnabled(false);
chartView.setOptions(options);
AlertDialog.Builder alertBox = new AlertDialog.Builder(v.getRootView().getContext());
alertBox.setTitle("Graph");
alertBox.setView(alertLayout);
alertBox.setCancelable(false);
alertBox.setPositiveButton("Done", (dialog, which) -> dialog.dismiss());
AlertDialog dialog = alertBox.create();
dialog.show();
}
catch (NullPointerException e){
Log.e("",e.getLocalizedMessage());
}
finally {
if(mMarks != null){
mMarks.clear();
}
}
});
}
正如@daniel_s 提到的，这不是 highcharts 的问题。这也不是 firebase 的问题。它以您放置代码的方式。
现在我不是谈论 firebase 的合适人选，但让我们理解这一点。
Firebase 工作在异步机制上，Firebase 的所有方法都是异步类型的。因此，当您单击 Cardview 时，firebase 方法和 highchart 方法会同时运行，而不是一个接一个地运行。
要按照您的方式完成这项工作，您应该这样做：
holder.show_graph.setOnClickListener(v -> {
docRef.get().addOnSuccessListener(documentSnapshot -> {
mMarks = new HashSet<>();
if (documentSnapshot != null && documentSnapshot.exists()) {
Map<String, Object> hm = documentSnapshot.getData();
Set<String> a = hm.keySet();
for (String b : a) {
try {
holder.marks_obtained.setText((String)documentSnapshot.get(email));
if(!b.equals("Max_marks")){
Log.e( "onComplete: ", documentSnapshot.get(b+".com") + " " +documentSnapshot.getId() );
mMarks.add(Float.parseFloat((String)documentSnapshot.get(b+".com")));
}
} catch (Exception e) {
e.printStackTrace();
}
}
// All of your highcharts code here.....
v = LayoutInflater.from(context).inflate(R.layout.graph_plot,null);
final View alertLayout = v;
try{
//HICharts
HIChartView chartView = alertLayout.findViewById(R.id.hc);
chartView.plugins = new ArrayList<>(Arrays.asList("histogram-bellcurve"));
HIOptions options = new HIOptions();
HIChart chart = new HIChart();
chart.setType("variwide");
options.setChart(chart);
HITitle title = new HITitle();
title.setText("Score Division");
options.setTitle(title);
HIXAxis xaxis1 = new HIXAxis();
HITitle ht = new HITitle();
ht.setText("Count");
xaxis1.setTitle(ht);
HIXAxis xaxis2 = new HIXAxis();
xaxis2.setTitle(new HITitle());
xaxis2.setOpposite(true);
options.setXAxis(new ArrayList<>(Arrays.asList(xaxis1, xaxis2)));
HIYAxis yaxis1 = new HIYAxis();
HITitle ht2 = new HITitle();
ht2.setText("Marks");
yaxis1.setTitle(ht2);
HIYAxis yaxis2 = new HIYAxis();
yaxis2.setTitle(new HITitle());
yaxis2.setOpposite(true);
options.setYAxis(new ArrayList<>(Arrays.asList(yaxis1, yaxis2)));
HILegend legend = new HILegend();
legend.setEnabled(true);
options.setLegend(legend);
HIHistogram series1 = new HIHistogram();
series1.setType("histogram");
series1.setName("Histogram");
series1.setXAxis(1);
series1.setYAxis(1);
series1.setBaseSeries("s1");
series1.setZIndex(-1);
HIScatter series2 = new HIScatter();
series2.setType("scatter");
series2.setName("Data");
Number[] series2_data = new Number[mMarks.size()];
int i = 0;
for(float m : mMarks){
series2_data[i] = m;
i++;
}
series2.setId("s1");
series2.setData(new ArrayList<>(Arrays.asList(series2_data)));
series2.setMarker(new HIMarker());
series2.getMarker().setRadius(2.5);
options.setSeries(new ArrayList<>(Arrays.asList(series1, series2)));
options.setExporting(new HIExporting());
options.getExporting().setEnabled(false);
chartView.setOptions(options);
AlertDialog.Builder alertBox = new AlertDialog.Builder(v.getRootView().getContext());
alertBox.setTitle("Graph");
alertBox.setView(alertLayout);
alertBox.setCancelable(false);
alertBox.setPositiveButton("Done", (dialog, which) -> dialog.dismiss());
AlertDialog dialog = alertBox.create();
dialog.show();
}
catch (NullPointerException e){
Log.e("",e.getLocalizedMessage());
}
finally {
if(mMarks != null){
mMarks.clear();
}
}
}
});
希望我说清楚了。如果有效，请点击勾号接受我的回答:)
我有一个 activity，其中有许多卡片视图，单击它们时应该从 firebase firestore 获取数据，并在 android.On 每个卡片视图点击中使用 highcharts 以直方图格式绘制数据在 firestore 查询中传递该 cardview 的 d 并且相关数据是 retrieved.But 在我的例子中，卡片视图仅在第二次单击时起作用，并且当单击不同的卡片视图时它保留前一个的值查询，只有在第二次点击时它才会显示正确的数据。
下面是我的适配器视图代码，其中包含卡片视图。
DocumentReference docRef = rootRef.collection("Users").document(tId).collection("Subjects")
.document(subId).collection("Marks").document(testList.get(position).getMarksID());
holder.show_graph.setOnClickListener(v -> {
docRef.get().addOnSuccessListener(documentSnapshot -> {
mMarks = new HashSet<>();
if (documentSnapshot != null && documentSnapshot.exists()) {
Map<String, Object> hm = documentSnapshot.getData();
Set<String> a = hm.keySet();
for (String b : a) {
try {
holder.marks_obtained.setText((String)documentSnapshot.get(email));
if(!b.equals("Max_marks")){
Log.e( "onComplete: ", documentSnapshot.get(b+".com") + " " +documentSnapshot.getId() );
mMarks.add(Float.parseFloat((String)documentSnapshot.get(b+".com")));
}
} catch (Exception e) {
e.printStackTrace();
}
}
}
});
v = LayoutInflater.from(context).inflate(R.layout.graph_plot,null);
final View alertLayout = v;
try{
//HICharts
HIChartView chartView = alertLayout.findViewById(R.id.hc);
chartView.plugins = new ArrayList<>(Arrays.asList("histogram-bellcurve"));
HIOptions options = new HIOptions();
HIChart chart = new HIChart();
chart.setType("variwide");
options.setChart(chart);
HITitle title = new HITitle();
title.setText("Score Division");
options.setTitle(title);
HIXAxis xaxis1 = new HIXAxis();
HITitle ht = new HITitle();
ht.setText("Count");
xaxis1.setTitle(ht);
HIXAxis xaxis2 = new HIXAxis();
xaxis2.setTitle(new HITitle());
xaxis2.setOpposite(true);
options.setXAxis(new ArrayList<>(Arrays.asList(xaxis1, xaxis2)));
HIYAxis yaxis1 = new HIYAxis();
HITitle ht2 = new HITitle();
ht2.setText("Marks");
yaxis1.setTitle(ht2);
HIYAxis yaxis2 = new HIYAxis();
yaxis2.setTitle(new HITitle());
yaxis2.setOpposite(true);
options.setYAxis(new ArrayList<>(Arrays.asList(yaxis1, yaxis2)));
HILegend legend = new HILegend();
legend.setEnabled(true);
options.setLegend(legend);
HIHistogram series1 = new HIHistogram();
series1.setType("histogram");
series1.setName("Histogram");
series1.setXAxis(1);
series1.setYAxis(1);
series1.setBaseSeries("s1");
series1.setZIndex(-1);
HIScatter series2 = new HIScatter();
series2.setType("scatter");
series2.setName("Data");
Number[] series2_data = new Number[mMarks.size()];
int i = 0;
for(float m : mMarks){
series2_data[i] = m;
i++;
}
series2.setId("s1");
series2.setData(new ArrayList<>(Arrays.asList(series2_data)));
series2.setMarker(new HIMarker());
series2.getMarker().setRadius(2.5);
options.setSeries(new ArrayList<>(Arrays.asList(series1, series2)));
options.setExporting(new HIExporting());
options.getExporting().setEnabled(false);
chartView.setOptions(options);
AlertDialog.Builder alertBox = new AlertDialog.Builder(v.getRootView().getContext());
alertBox.setTitle("Graph");
alertBox.setView(alertLayout);
alertBox.setCancelable(false);
alertBox.setPositiveButton("Done", (dialog, which) -> dialog.dismiss());
AlertDialog dialog = alertBox.create();
dialog.show();
}
catch (NullPointerException e){
Log.e("",e.getLocalizedMessage());
}
finally {
if(mMarks != null){
mMarks.clear();
}
}
});
}
正如@daniel_s 提到的，这不是 highcharts 的问题。这也不是 firebase 的问题。它以您放置代码的方式。
现在我不是谈论 firebase 的合适人选，但让我们理解这一点。 Firebase 工作在异步机制上，Firebase 的所有方法都是异步类型的。因此，当您单击 Cardview 时，firebase 方法和 highchart 方法会同时运行，而不是一个接一个地运行。
要按照您的方式完成这项工作，您应该这样做：
holder.show_graph.setOnClickListener(v -> {
docRef.get().addOnSuccessListener(documentSnapshot -> {
mMarks = new HashSet<>();
if (documentSnapshot != null && documentSnapshot.exists()) {
Map<String, Object> hm = documentSnapshot.getData();
Set<String> a = hm.keySet();
for (String b : a) {
try {
holder.marks_obtained.setText((String)documentSnapshot.get(email));
if(!b.equals("Max_marks")){
Log.e( "onComplete: ", documentSnapshot.get(b+".com") + " " +documentSnapshot.getId() );
mMarks.add(Float.parseFloat((String)documentSnapshot.get(b+".com")));
}
} catch (Exception e) {
e.printStackTrace();
}
}
// All of your highcharts code here.....
v = LayoutInflater.from(context).inflate(R.layout.graph_plot,null);
final View alertLayout = v;
try{
//HICharts
HIChartView chartView = alertLayout.findViewById(R.id.hc);
chartView.plugins = new ArrayList<>(Arrays.asList("histogram-bellcurve"));
HIOptions options = new HIOptions();
HIChart chart = new HIChart();
chart.setType("variwide");
options.setChart(chart);
HITitle title = new HITitle();
title.setText("Score Division");
options.setTitle(title);
HIXAxis xaxis1 = new HIXAxis();
HITitle ht = new HITitle();
ht.setText("Count");
xaxis1.setTitle(ht);
HIXAxis xaxis2 = new HIXAxis();
xaxis2.setTitle(new HITitle());
xaxis2.setOpposite(true);
options.setXAxis(new ArrayList<>(Arrays.asList(xaxis1, xaxis2)));
HIYAxis yaxis1 = new HIYAxis();
HITitle ht2 = new HITitle();
ht2.setText("Marks");
yaxis1.setTitle(ht2);
HIYAxis yaxis2 = new HIYAxis();
yaxis2.setTitle(new HITitle());
yaxis2.setOpposite(true);
options.setYAxis(new ArrayList<>(Arrays.asList(yaxis1, yaxis2)));
HILegend legend = new HILegend();
legend.setEnabled(true);
options.setLegend(legend);
HIHistogram series1 = new HIHistogram();
series1.setType("histogram");
series1.setName("Histogram");
series1.setXAxis(1);
series1.setYAxis(1);
series1.setBaseSeries("s1");
series1.setZIndex(-1);
HIScatter series2 = new HIScatter();
series2.setType("scatter");
series2.setName("Data");
Number[] series2_data = new Number[mMarks.size()];
int i = 0;
for(float m : mMarks){
series2_data[i] = m;
i++;
}
series2.setId("s1");
series2.setData(new ArrayList<>(Arrays.asList(series2_data)));
series2.setMarker(new HIMarker());
series2.getMarker().setRadius(2.5);
options.setSeries(new ArrayList<>(Arrays.asList(series1, series2)));
options.setExporting(new HIExporting());
options.getExporting().setEnabled(false);
chartView.setOptions(options);
AlertDialog.Builder alertBox = new AlertDialog.Builder(v.getRootView().getContext());
alertBox.setTitle("Graph");
alertBox.setView(alertLayout);
alertBox.setCancelable(false);
alertBox.setPositiveButton("Done", (dialog, which) -> dialog.dismiss());
AlertDialog dialog = alertBox.create();
dialog.show();
}
catch (NullPointerException e){
Log.e("",e.getLocalizedMessage());
}
finally {
if(mMarks != null){
mMarks.clear();
}
}
}
});
希望我说清楚了。如果有效，请点击勾号接受我的回答:)