const toolTip = (value) => {
  return `<div style="background:pink;">
<p>${value}</p>
</div>`;
};

export const data = [
  // Africa
  ["Country", "Value", { type: "string", role: "tooltip", p: { html: true } }],
  ["Nigeria", 100, toolTip("hello")],
  ["South Africa", 50, toolTip("hello")],

  // Asia
  ["China", 100, toolTip("hello")],
  ["India", 50, toolTip("hello")],

  // Europe
  ["France", 100, toolTip("hello")],
  ["Germany", 50, toolTip("hello")],

  // North America
  ["United States", 100, toolTip("hello")],
  ["Canada", 50, toolTip("hello")],

  // Oceania (Australia)
  ["Australia", 100, toolTip("hello")],
  ["New Zealand", 50, toolTip("hello")],

  // South America
  ["Brazil", 100, toolTip("hello")],
  ["Argentina", 50, toolTip("hello")],
];
export const options = {
  region: "world",
  colorAxis: { colors: ["#00C2C2", "#FEBF10"] },
  backgroundColor: "#F5F7F7",
  datalessRegionColor: "#fff",
  defaultColor: "#f5f5f5",
  resolution: "countries",
  legend: "none",
  tooltip: { isHtml: true },
};
