mexico.json

{
  "$schema": "https://vega.github.io/schema/vega/v5.json",
    "title": {"text": {"signal":"'Perception of ' + Color_Variable + ' by Region'" }},
  "width": 675,
  "height": 500,
  "config": {"style": {"cell": {"stroke": "transparent"}}},
  
  "data": [
    {
      "name": "symbols",
      "values": [ "Capital", "Admin City", "Airport"]
    },
    {
      "name": "Mexico City",
      "values": [{"city": "Mexico City", "lat": 19.9806, "lng": -99.7578}], 
      "transform": [{
        "type": "geopoint",
        "projection": "projection",
        "fields": ["lng", "lat"]
      }]
    },  
    {
      "name": "regions",
      "url": "https://gist.githubusercontent.com/Birdasaur/048b8f1ca6823b68f7d1c06f7e627ac6/raw/4739bc338bdf33f753c11b0a97031448d20adc57/MexicoRegionsISOCodes.csv",
      "format": {"type": "csv", "parse": "auto"}
    },
    {
      "name": "mexico",
      "url": "https://gist.githubusercontent.com/Birdasaur/0668957f2f51341dfd49f986dff8552e/raw/0b5edbccc21e7f347abcd8b8e7197f297d76c50f/geoBoundaries-MEX-ADM1.topojson",
      "format": {"type": "topojson","feature": "MEX-ADM1-58226515"}
      ,"transform": [
        {
          "type": "lookup",
          "from": "regions",
          "key": "n_region_iso_region_iso_3166_2",
          "fields": ["properties.shapeISO"],
          "values": ["Abundant_Corruption_Percent"]
        },         
        {
          "type": "lookup",
          "from": "regions",
          "key": "n_region_iso_region_iso_3166_2",
          "fields": ["properties.shapeISO"],
          "values": ["Work_Is_Important_Percent"]
        },         
        {
          "type": "lookup",
          "from": "regions",
          "key": "n_region_iso_region_iso_3166_2",
          "fields": ["properties.shapeISO"],
          "values": ["Religion_Very_Important_Percent"]
        } 
        //
       ]
    }
  ],
  
 "signals": [
    {
      "name": "Color_Variable",
      "value": "Abundant_Corruption_Percent",
      "bind": {
        "input": "select",
        "options": [
          "Abundant_Corruption_Percent",
          "Work_Is_Important_Percent",
          "Religion_Very_Important_Percent"
        ]
      }
    }
  ],
  "projections": [
    {
      "name": "projection",
      "type": "mercator",
      "rotate": [95,-25],
      "center": [0, 0],
      "scale": 1250
    } 
  ],
  "scales": [
    {
      "name": "symbolScale",
      "type": "ordinal",
      "domain": {"data": "symbols", "field":"data"},
      "range": "category"
    },
    {
      "name": "color",
      "type": "quantize",
      "domain": [30, 100],
      "range": {"scheme": "reds", "count": 7}
    }
  ],
  
  "legends": [
    {
      "title": "Symbology",
      "orient": "top-right",
      "type": "symbol",
      "fill": "symbolScale",
      "encode": {
        "symbols": {
          "update": {
            "shape": [
              { "test": "datum.value == 'Admin City'", "value": "circle" },
              { "test": "datum.value == 'Airport'", "value": "cross" },
              { "test": "datum.value == 'Capital'", "value": "M0,.5L.6,.8L.5,.1L1,-.3L.3,-.4L0,-1L-.3,-.4L-1,-.3L-.5,.1L-.6,.8L0,.5Z" }
            ],
            "fill": [
              { "test": "datum.value == 'Admin City'", "value": "blue" },
              { "test": "datum.value == 'Airport'", "value": "green" },
              { "test": "datum.value == 'Capital'", "value": "white" }
            ],
            "stroke":[
              { "test": "datum.value == 'Capital'", "value": "black" }
            ],
            "strokeWidth": {"value": 1}
          }
        }
      }
    },
    {
      "title": "Survey Response Percent",
      "orient": "top-left",
      "type": "symbol",
      "fill": "color",
      "clipHeight": 16,
      "encode": {
        "symbols": {
          "name": "legendSymbol",
          "size": {"value": 64}
          }
        }
    }
  ],
    
  "marks": [
    {
      "type": "shape",
      "from": {"data": "mexico"},
      "encode": {
        "enter": {
          //"opacity": { "value": 0.85 }
        },
        "update": {
           "fill": {"scale": "color", "field": { "signal": "Color_Variable"}   },
           "stroke": {"scale": "color", "field": { "signal": "Color_Variable"} },
          "stroke":{"value":"red"},          
          "strokeOpacity": {"value":1},
          "strokeWidth": {"value": 1.25}
        }
        ,"hover": {
          "tooltip": { "signal" : "{'Region':datum.properties.shapeName, 'Percent Max': datum[Color_Variable]}"},
          "stroke": {"value": "blue"},
          "strokeWidth": {"value": 2},
          "scaleX": {"value": 1.5},
          "scaleY": {"value": 1.5}
        }        
      },
      "transform": [{"type": "geoshape", "projection": "projection"}]
    },
    {
      "name": "capitalStar",
      "type" : "symbol",
      "from" : { "data" : "Mexico City"},
      "encode": {
        "enter": {
          "shape":{"value": "M0,.5L.6,.8L.5,.1L1,-.3L.3,-.4L0,-1L-.3,-.4L-1,-.3L-.5,.1L-.6,.8L0,.5Z"},
          "fill": { "value" : "white" },
          "tooltip": { "signal" : "{ 'Capitol':datum.city, 'Population':datum.population}"}
        },
        "update": {
          "size": { "value":100 },
          "stroke": {"value": "silver"},
          "x": {"field": "x"},
          "y": {"field": "y"}
        },
        "hover": {
          "stroke": {"value": "blue"},
          "strokeWidth": {"value": 1},
          "size": { "value":300 }
        }
      }
    }
  ]
}