world map parameterisiert

superx/xml/js/viz/viz_functions.js

@@ -2406,30 +2406,31 @@ var captionEmptyTarget=getCommonChartPropertyFromModel(myCommonChartProperties,"
 renderWorldMap(myCommonChartProperties,mySvg,data);
 	
 }
-function renderWorldMap(myCommonChartProperties,mySvg,data)
-{
-const worldWidth = 960;
-const worldHeight = 600;
+function renderWorldMap(myCommonChartProperties, mySvg, data) {
+    const worldWidth = getCommonChartPropertyFromModel(myCommonChartProperties, "width");
+    const worldHeight = getCommonChartPropertyFromModel(myCommonChartProperties, "height");
 
     const worldTooltip = d3.select(".vizTooltip");
 
     const worldColor = d3.scaleSequential(d3.interpolateBlues)
         .domain([0, 1]); // Domain matches the output of logColor
 
-const worldLogColor = d3.scaleLog()
-    .domain([1, 41227]) // Adjust this domain to fit your data range
-    .range([0, 1]);
-
     const worldSvg = d3.select("#world-map")
         .attr("width", worldWidth)
         .attr("height", worldHeight);
 
+    // Calculate the scale and translation dynamically based on width and height
+    const scale = Math.min(worldWidth / 6.28, worldHeight / 3.14);
+    const translate = [worldWidth / 2, worldHeight / 2];
+
     const worldProjection = d3.geoMercator()
-    .scale(100)
-    .translate([worldWidth / 2, worldHeight / 1.5]);
+        .scale(scale)
+        .translate(translate);
 
     const worldPath = d3.geoPath().projection(worldProjection);
+
     var d = getWorldMapData(data);
+
     // Load the world data files
     Promise.all([
         d3.json("https://raw.githubusercontent.com/holtzy/D3-graph-gallery/master/DATA/world.geojson"),
@@ -2441,6 +2442,14 @@ Promise.all([
     ]).then(([worldGeojson, worldData]) => {
         const worldDataMap = new Map(worldData.map(d => [d.iso3, d.value]));
 
+        // Find the maximum value in the data
+        const maxValue = d3.max(worldData, d => d.value);
+
+        // Update the worldLogColor domain based on the maximum value
+        const worldLogColor = d3.scaleLog()
+            .domain([1, maxValue]) // Use the maximum value from the data
+            .range([0, 1]);
+
         mySvg.append("g")
             .selectAll("path")
             .data(worldGeojson.features)
@@ -2468,7 +2477,7 @@ Promise.all([
     }).catch(error => {
         console.error('Error loading or parsing data:', error);
     });
-
+}
 function getWorldMapData(data)
 {
 var myData=[];
@@ -2480,7 +2489,7 @@ for (var i = 0; i < data.length; i++)
 	}
 return myData;
 }
-    }
+    
 function makeSankeyD3(myCommonChartProperties,mySvg,data,metaData,chartElem)
 {
 // load the data