{"spec_id":"map-marker-clustered","library":"plotly","language":"python","code":"\"\"\" anyplot.ai\nmap-marker-clustered: Clustered Marker Map\nLibrary: plotly 6.7.0 | Python 3.13.13\nQuality: 86/100 | Updated: 2026-05-23\n\"\"\"\n\nimport os\n\nimport numpy as np\nimport pandas as pd\nimport plotly.graph_objects as go\n\n\n# Theme tokens\nTHEME = os.getenv(\"ANYPLOT_THEME\", \"light\")\nPAGE_BG = \"#FAF8F1\" if THEME == \"light\" else \"#1A1A17\"\nELEVATED_BG = \"#FFFDF6\" if THEME == \"light\" else \"#242420\"\nINK = \"#1A1A17\" if THEME == \"light\" else \"#F0EFE8\"\nINK_SOFT = \"#4A4A44\" if THEME == \"light\" else \"#B8B7B0\"\n\n# Imprint palette — canonical order for categorical series\nIMPRINT = [\"#009E73\", \"#C475FD\", \"#AE3030\", \"#4467A3\"]\n\n# Data - Retail store locations across North America\nnp.random.seed(42)\n\ncities = {\n    \"New York\": (40.7128, -74.0060, 80),\n    \"Los Angeles\": (34.0522, -118.2437, 60),\n    \"Chicago\": (41.8781, -87.6298, 50),\n    \"Houston\": (29.7604, -95.3698, 40),\n    \"Phoenix\": (33.4484, -112.0740, 35),\n    \"Seattle\": (47.6062, -122.3321, 30),\n    \"Denver\": (39.7392, -104.9903, 25),\n    \"Miami\": (25.7617, -80.1918, 45),\n    \"Atlanta\": (33.7490, -84.3880, 35),\n    \"Boston\": (42.3601, -71.0589, 40),\n}\n\ncategories = [\"Electronics\", \"Grocery\", \"Clothing\", \"Hardware\"]\ncategory_colors = {cat: IMPRINT[i] for i, cat in enumerate(categories)}\n\nlats, lons, labels, cats = [], [], [], []\nstore_id = 1\n\nfor city, (lat, lon, count) in cities.items():\n    for _ in range(count):\n        lat_jitter = lat + np.random.normal(0, 0.15)\n        lon_jitter = lon + np.random.normal(0, 0.15)\n        category = np.random.choice(categories)\n        lats.append(lat_jitter)\n        lons.append(lon_jitter)\n        labels.append(f\"Store #{store_id} - {city}\")\n        cats.append(category)\n        store_id += 1\n\ndf = pd.DataFrame({\"lat\": lats, \"lon\": lons, \"label\": labels, \"category\": cats})\ntotal_stores = len(df)\ncity_counts = {city: count for city, (_, _, count) in cities.items()}\ndensest_city = max(city_counts, key=city_counts.get)\n\n# Plot\nmap_style = \"carto-positron\" if THEME == \"light\" else \"carto-darkmatter\"\n\nfig = go.Figure()\n\nfor category in categories:\n    cat_df = df[df[\"category\"] == category]\n    fig.add_trace(\n        go.Scattermap(\n            lat=cat_df[\"lat\"],\n            lon=cat_df[\"lon\"],\n            mode=\"markers\",\n            marker={\"size\": 14, \"color\": category_colors[category], \"opacity\": 0.8},\n            text=cat_df[\"label\"],\n            hovertemplate=(\n                \"<b>%{text}</b><br>\"\n                + f\"Category: {category}<br>\"\n                + \"Lat: %{lat:.4f}<br>Lon: %{lon:.4f}\"\n                + \"<extra></extra>\"\n            ),\n            name=category,\n            cluster={\n                \"enabled\": True,\n                \"maxzoom\": 10,\n                \"size\": 40,\n                \"step\": 1,\n                \"color\": category_colors[category],\n                \"opacity\": 0.75,\n            },\n        )\n    )\n\nfig.update_layout(\n    autosize=False,\n    paper_bgcolor=PAGE_BG,\n    title={\n        \"text\": \"Retail Store Locations · map-marker-clustered · python · plotly · anyplot.ai\",\n        \"font\": {\"size\": 16, \"color\": INK},\n        \"x\": 0.5,\n        \"xanchor\": \"center\",\n    },\n    # lon=-100 shifts viewport ~2° west to keep Boston within the canvas (review feedback)\n    map={\"style\": map_style, \"center\": {\"lat\": 39.0, \"lon\": -100.0}, \"zoom\": 3.5},\n    legend={\n        \"title\": {\"text\": f\"Store Category  (n={total_stores})\", \"font\": {\"size\": 12, \"color\": INK}},\n        \"font\": {\"size\": 10, \"color\": INK_SOFT},\n        \"bgcolor\": ELEVATED_BG,\n        \"bordercolor\": INK_SOFT,\n        \"borderwidth\": 1,\n        \"x\": 0.01,\n        \"y\": 0.99,\n        \"xanchor\": \"left\",\n        \"yanchor\": \"top\",\n    },\n    margin={\"l\": 80, \"r\": 60, \"t\": 80, \"b\": 60},\n)\n\n# Data-context annotation: focal point summarising the dataset\nfig.add_annotation(\n    x=0.97,\n    y=0.04,\n    xref=\"paper\",\n    yref=\"paper\",\n    text=(\n        f\"<b>{total_stores} retail locations</b> across 10 US cities<br>\"\n        f\"Densest cluster: <b>{densest_city}</b> ({city_counts[densest_city]} stores)\"\n        \"  ·  zoom in to expand clusters\"\n    ),\n    showarrow=False,\n    font={\"size\": 10, \"color\": INK_SOFT},\n    bgcolor=ELEVATED_BG,\n    bordercolor=INK_SOFT,\n    borderwidth=1,\n    borderpad=6,\n    align=\"right\",\n    xanchor=\"right\",\n    yanchor=\"bottom\",\n)\n\n# Save\nfig.write_image(f\"plot-{THEME}.png\", width=800, height=450, scale=4)\nfig.write_html(f\"plot-{THEME}.html\", include_plotlyjs=\"cdn\")\n"}