Default image and title

reports/templates/L2ASCL_data.html

@@ -248,7 +248,7 @@
                     <!-- AREA CHART -->
                     <div class="box box-primary">
                         <div class="box-header with-border">
-                            <h3 class="box-title"> {{ type }} Chart Km²</h3>
+                            <h3 class="box-title"> {{ title }} SCL Image Classification Data(Km²)</h3>
 
                             <div class="box-tools pull-right">
                                 <button type="button" class="btn btn-box-tool" data-widget="collapse"><i
@@ -275,7 +275,7 @@
                     <!-- DONUT CHART -->
                     <div class="box box-danger">
                         <div class="box-header with-border">
-                            <h3 class="box-title">Map Image</h3>
+                            <h3 class="box-title" id="titleMap">{{dafaultLabel}}</h3>
 
                             <div class="box-tools pull-right">
                                 <button type="button" class="btn btn-box-tool" data-widget="collapse"><i
@@ -287,7 +287,7 @@
                         </div>
                         <div class="box-body">
                             <img onclick="window.open(this.src)" class="img-responsive" id="satImage" width="400"
-                                 height="400px"
+                                 height="400px" src = "../../static/reports/tmpImages/repsat_test_dev/{{IMAGE_PATH}}/{{dafaultLabel}}_TCI_60m.jpg"
                                  style="margin-left: auto; margin-right: auto; display: block;">
                         </div>
                         <!-- /.box-body -->
@@ -358,8 +358,7 @@
                 config.options = {
                     responsive: true,
                     maintainAspectRatio: false,
-                    <!--			scales: {xAxes: [{stacked: true}],yAxes: [{stacked: true}]},-->
-                    title: {text: "SCL Image Classification Data (Km²)", display: true},
+                    // scales: { xAxes: [{ stacked: true }], yAxes: [{ stacked: true }] },
                 };
         {% endautoescape %}
         // Creamos una gráfica con los datos al macenados en config
@@ -379,6 +378,7 @@
             label = myChart.data.labels[firstPoint._index];
             //alert("{{ IMAGE_PATH }}"+label+"_TCI_60m.jpg");
             //document.getElementById("satImage").src = "{{ IMAGE_PATH }}"+label+"_TCI_60m.jpg";
+            document.getElementById("titleMap").innerHTML = label;
             document.getElementById("satImage").src = "../../static/reports/tmpImages/repsat_test_dev/{{IMAGE_PATH}}/" + label + "_TCI_60m.jpg"
         };
 

reports/views.py

@@ -67,12 +67,13 @@ def report_L2ASCL(request, report,purchase_id):
         data['datasets'].sort(key=lambda k: max(k['data']))
 
         graphData['data'] = data
+        defaultLabel = graphData['data']['labels'][0]
         # print(settings.BASE_URL)
         #		graphData['options']['responsive']=True
         #		graphData['options']['maintainAspectRatio']=False
         # print(json.dumps(graphData).encode("utf-8"))
 
-    return render(request, 'L2ASCL_data.html', {"graphData": json.dumps(graphData), "report_name": report, "IMAGE_PATH": image_path})
+    return render(request, 'L2ASCL_data.html', {"graphData": json.dumps(graphData), "report_name": report, "IMAGE_PATH": image_path, 'dafaultLabel': defaultLabel})
 
     # -------------------------------------------------------------------------------def Reports(request):