JSFiddle - React, Tailwind, and code Playground

by Patricia Warwick

JavaScript

var categoryImage = {
    "Regional Group": "/sites/default/files/images/bullet_regional.gif",
    "Volunteer": "/sites/default/files/images/bullet_volunteer.gif",
    "Community Group": "/sites/default/files/images/bullet_community.gif"
  };

function prettyAlert(p_message, p_title) {
  p_title = p_title || "";
  $(p_message).dialog({
       title: p_title,
       width:400,
       height:400,
       resizable: false,
       modal : true,
       close: function(ev, ui) {
         $(this).remove(); 
         }
  }).css("background", "lightgrey"); 
}

var cx; var cy;
var width  = 1000;
var height = 800;

// Create the Google Map…
var map = new google.maps.Map(d3.select("#map") .node(), {
    zoom: 11,
    zoomControlOptions: {
      style: google.maps.ZoomControlStyle.LARGE,
      position: google.maps.ControlPosition.RIGHT
    },
    center: new google.maps.LatLng(43.7, -79.4),
    mapTypeId: google.maps.MapTypeId.TERRAIN // was ROADMAP
}
); // end new map

var circles;
  hoverover=d3.select("body")
    .append("div")
    .attr("class","datamaps-hoverover")
    .style("display","none")
    .style("position","absolute");

d3.json("/participants-json-file?nocache=" + (new Date()).getTime(),function(error,participants){
      var bottom=participants.participants.map(function(participants) {
        return participants.participant;
      });

  var overlay = new google.maps.OverlayView();

  // Add the container when the overlay is added to the map.
    overlay.onAdd = function() {
    var layer = d3.select(this.getPanes() .overlayMouseTarget)
        .append("div")
        .attr("class", "members")
        ; // end var layer

    // Draw each marker as a separate SVG element.

    overlay.draw = function() {
      var projection = this.getProjection(),
          padding = 10; // end var projection
      
      var marker = layer.selectAll("svg")
          .data(bottom)
          .each(transform) // update existing markers
        .enter()
         ...