adjust x spacing to shift everything to the left

src/assets/text/text.js

@@ -33,7 +33,7 @@ export default {
       paragraph3: `But these factors are not equally distributed across the Western United States. For example, certain races and ethnicities are more heavily concentrated in some geographic areas than in others. Similarly, some counties have much lower median household incomes than other counties do. Understanding where these vulnerable populations live is important information for water-resource managers to make equitable decisions about water availability and use.`
     },
     socialVulnerabilityText: {
-      title: "Where do we go from here",
+      title: "Where do we go from here?",
       paragraph1: "A crucial and largely unexplored area of research is the <span class='tooltip'><span class='tooltip-span'>intersectionality</span><span class='tooltiptext'>The complex, cumulative way in which the effects of multiple forms of discrimination combine, overlap, or intersect especially in the experiences of marginalized individuals or groups.</span></span> of social vulnerability factors. The factors evaluated by the researchers at USGS represent individual drivers of water insecurity, like household size or ethnicity. What about the people who experience multiple risk factors at the same time?",
       paragraph2: `For example, “Elderly people who have lower incomes are a unique population, existing at the overlap of, but distinct from, the elderly or lower income alone,” says Oronde Drakes, social geographer at USGS and lead author of the <span class="tooltip"><span class="tooltip-span">meta-analysis</span><span class="tooltiptext meta-analysis">Type of review study where researchers combine data from many different studies to try to identify bigger patterns across all the results.</span></span>. “The interaction of those social characteristics may well have different and significant impacts on water security than would be found exploring those social factors on their own.”`,
       paragraph3: "In this burgeoning field of social vulnerability to water insecurity, we have a lot left to learn. Once we better understand not only where water insecurity is happening, but who is most vulnerable and why, we will be better equipped to address <span class='tooltip'><span class='tooltip-span'>environmental justice</span><span class='tooltiptext'>Scientific planning, activities, and information intended to support equitable access and use by all people who may be affected.</span></span> and equity issues in water resources."

src/components/InteractiveDendrogram.vue

@@ -131,10 +131,11 @@ function transformData() {
 
 function createDendrogram(result) {
   const width = 1000;
+  const height = 800; // Adjust height if necessary
   const marginTop = 40;
   const marginRight = 100;
   const marginBottom = 40;
-  const marginLeft = width / 7;
+  const marginLeft = 0; // Set marginLeft to 0
 
   const root = d3.hierarchy(result);
   const dx = 10; // Further decreased vertical spacing
@@ -159,7 +160,8 @@ function createDendrogram(result) {
   const svg = d3.select('#dendrogram-container')
     .append('svg')
     .attr('width', width)
-    .attr('viewBox', [-marginLeft, -marginTop, width, dx * (root.height + 1)])
+    .attr('height', height) // Add height
+    .attr('viewBox', [0, -marginTop, width, height]) // Adjust viewBox
     .style('max-width', '100%')
     .style('height', 'auto')
     .style('font-size', textSize)
@@ -228,7 +230,7 @@ function createDendrogram(result) {
     const transition = svg.transition()
       .duration(duration)
       .attr('height', height)
-      .attr('viewBox', [-marginLeft, left.x - marginTop, width, height])
+      .attr('viewBox', [0, left.x - marginTop, width, height]) // Adjust viewBox
       .tween('resize', window.ResizeObserver ? null : () => () => svg.dispatch('toggle'));
 
     const node = gNode.selectAll('g')