get data from api

frontend/src/Legend.vue

@@ -181,24 +181,6 @@ export default class Legend extends Vue{
     mounted(){
         console.log("Legend mounted");
 
-        let series: TemperatureSeries[] = new Array<TemperatureSeries>();
-        series.push({date: 2005, value: 3});
-        series.push({date: 2006, value: 5});
-        series.push({date: 2007, value: 7});
-        series.push({date: 2008, value: 4});
-        series.push({date: 2009, value: 9});
-        series.push({date: 2010, value: 3});
-        series.push({date: 2011, value: 5});
-        series.push({date: 2012, value: 7});
-        series.push({date: 2013, value: 4});
-        series.push({date: 2014, value: 9});
-        /* let tChart1 = new TemperatureLegendChart();
-        tChart1.render("legendTemperature1", series);
-
-        let tChart2 = new TemperatureLegendChart();
-        tChart2.render("legendTemperature2", series); */
-
-
         axios.get("http://127.0.0.1:42000/annualMean", {
             headers: {'Access-Control-Allow-Origin': '*'}
         }).then(resp => {

frontend/src/StationLayer.ts

@@ -28,7 +28,7 @@ export default class StationLayer{
         this.layer = new VectorLayer({
             className: StationLayer.layerName,
             source: new VectorSource({
-                url: "http://localhost/germanStation.geojson",
+                url: "http://localhost:42000/",
                 format: new GeoJSON(),
             }),
             style: (feature)=>{return this.stationStyle(feature)}
@@ -69,7 +69,7 @@ export default class StationLayer{
         let fontSize = 15
         let label = '';
         if(this.mapProperties.getZoomLevel()>=8){
-            label += feature.get("id");
+            label += feature.get("station_id");
         }
         
         let iconColor = "none";

frontend/src/TemperatureLegendChart.ts

@@ -6,14 +6,14 @@ export default class TemperatureLegendChart{
 
     private d3svg: any;
 
-    private margin = {top: 10, right: 30, bottom: 30, left: 30}
+    private margin = {top: 10, right: 30, bottom: 30, left: 20}
     private width = 0;
     private height = 0;
 
     public render(chartID: string, tSeries: TemperatureSeries[]):void{
 
-        this.width = 350 - this.margin.left - this.margin.right;
-        this.height = 70 - this.margin.top - this.margin.bottom;
+        this.width = 360 - this.margin.left - this.margin.right;
+        this.height = 80 - this.margin.top - this.margin.bottom;
 
         this.d3svg = d3.select("#"+chartID)
         .append("svg")
@@ -28,7 +28,7 @@ export default class TemperatureLegendChart{
 
         this.d3svg.append("g")
             .attr("transform", "translate(0," + this.height + ")")
-            .call(d3.axisBottom(xScale).ticks(10).tickFormat(d3.format("d"));
+            .call(d3.axisBottom(xScale).ticks(5).tickFormat(d3.format("d"));
         
         let yScale = d3.scaleLinear()
             .domain([d3.min(tSeries, function(d){return d.value}), d3.max(tSeries, function(d){return d.value})])