diff --git a/superx/xml/js/viz/viz_functions.js b/superx/xml/js/viz/viz_functions.js
index de5621c..c6b60cd 100644
--- a/superx/xml/js/viz/viz_functions.js
+++ b/superx/xml/js/viz/viz_functions.js
@@ -2406,69 +2406,78 @@ var captionEmptyTarget=getCommonChartPropertyFromModel(myCommonChartProperties,"
renderWorldMap(myCommonChartProperties,mySvg,data);
}
-function renderWorldMap(myCommonChartProperties,mySvg,data)
-{
-const worldWidth = 960;
-const worldHeight = 600;
-
-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);
-
-const worldProjection = d3.geoMercator()
- .scale(100)
- .translate([worldWidth / 2, worldHeight / 1.5]);
-
-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"),
- /*d3.csv("/superx/viz_worldmap/data.csv", d => ({
- iso3: d.iso3,
- value: +d.value
- }))*/
- d
-]).then(([worldGeojson, worldData]) => {
- const worldDataMap = new Map(worldData.map(d => [d.iso3, d.value]));
-
- mySvg.append("g")
- .selectAll("path")
- .data(worldGeojson.features)
- .enter().append("path")
- .attr("d", worldPath)
- .attr("fill", d => {
- const value = worldDataMap.get(d.id); // Use `d.id` to access ISO 3 codes
- if (value === 0) return "#ccc"; // Handle zero values separately
- return value ? worldColor(worldLogColor(value)) : "#ccc";
- })
- .on("mouseover", function (event, d) {
- const value = worldDataMap.get(d.id);
- worldTooltip.transition()
- .duration(200)
- .style("opacity", .9);
- worldTooltip.html(d.properties.name + "
" + (value ? value : "No data"))
- .style("left", (event.pageX) + "px")
- .style("top", (event.pageY - 28) + "px");
- })
- .on("mouseout", function () {
- worldTooltip.transition()
- .duration(500)
- .style("opacity", 0);
- });
-}).catch(error => {
- console.error('Error loading or parsing data:', error);
-});
-
+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 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(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"),
+ /*d3.csv("/superx/viz_worldmap/data.csv", d => ({
+ iso3: d.iso3,
+ value: +d.value
+ }))*/
+ d
+ ]).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)
+ .enter().append("path")
+ .attr("d", worldPath)
+ .attr("fill", d => {
+ const value = worldDataMap.get(d.id); // Use `d.id` to access ISO 3 codes
+ if (value === 0) return "#ccc"; // Handle zero values separately
+ return value ? worldColor(worldLogColor(value)) : "#ccc";
+ })
+ .on("mouseover", function (event, d) {
+ const value = worldDataMap.get(d.id);
+ worldTooltip.transition()
+ .duration(200)
+ .style("opacity", .9);
+ worldTooltip.html(d.properties.name + "
" + (value ? value : "No data"))
+ .style("left", (event.pageX) + "px")
+ .style("top", (event.pageY - 28) + "px");
+ })
+ .on("mouseout", function () {
+ worldTooltip.transition()
+ .duration(500)
+ .style("opacity", 0);
+ });
+ }).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