求助：IE11中Google注释图表出现getTime方法不支持报错

Hey there, I’ve run into this exact IE11 quirk with Google’s Annotation Chart before—let’s break down why it’s happening and how to fix it fast.

Why this happens #

IE11 has extremely strict (and outdated) handling of JavaScript Date objects compared to modern browsers like Edge or Firefox. The error usually pops up for one of two core reasons:

• You’re passing a date string that IE11 can’t parse into a valid Date instance (it hates formats like "YYYY-MM-DD" that modern browsers handle seamlessly).
• Some part of your code (or the chart’s internal logic) is trying to call getTime() on a value that’s not actually a proper Date object—like a raw string or undefined value.

Step-by-step fixes #

1. Force valid Date instances for your chart data

IE11 won’t reliably parse date strings in YYYY-MM-DD format. Instead, explicitly create Date objects using the year/month/day constructor (remember: months are 0-indexed in JavaScript!).

Here’s how to convert your raw data to IE11-friendly dates:

// Example raw data with problematic date strings
const rawChartData = [
  ["Date", "Value", "Annotation"],
  ["2024-05-01", 85, "Low sales"],
  ["2024-05-08", 120, "Promo start"]
];

// Convert date strings to valid Date objects
const ieFriendlyData = rawChartData.map(function(row, index) {
  // Skip the header row
  if (index === 0) return row;
  
  const [year, month, day] = row[0].split("-");
  // Month is 0-indexed, so subtract 1 from the month value
  const validDate = new Date(year, month - 1, day);
  return [validDate, row[1], row[2]];
});

2. Ditch ES6+ syntax that IE11 doesn’t support

If your code uses arrow functions, template literals, or other modern JS features, transpile it to ES5 (or rewrite it manually for simple cases). For example, replace arrow functions with regular functions:

// Instead of this arrow function (IE11 doesn't support)
// const formattedData = rawData.map(row => { ... });

// Use this regular function instead
const formattedData = rawData.map(function(row) {
  // Your date formatting logic here
});

3. Double-check custom date logic

If you’ve added any custom code to modify dates before passing them to the chart, make sure you’re not accidentally converting Date objects back to strings or invalid types. For example, avoid using date.toString() unless you’re 100% sure the chart can handle it (it usually can’t for date axes).

Quick validation test #

After making these changes, load your page in IE11 and open the developer tools console. If the error is gone, you’re set. If not, inspect the data being passed to the chart and confirm every date value is a valid Date instance (right-click the value in the console to check its type).

内容的提问来源于stack exchange，提问作者Pritam Waje