关于vue使用highcharts饼状图渐变色报错问题

今天用highchart画3d渐变色时用了官方的示例代码

// 创建渐变色
Highcharts.getOptions().colors = Highcharts.map(Highcharts.getOptions().colors, function (color) {
	return {
		radialGradient: { cx: 0.5, cy: 0.3, r: 0.7 },
		stops: [
			[0, color],
			[1, Highcharts.Color(color).brighten(-0.3).get('rgb')] // darken
		]
	};
});
// 构建图表
var chart = Highcharts.chart('container',{
	title: {
		text: '2014年某网站各浏览器的访问量占比'
	},
	tooltip: {
		pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
	},
	plotOptions: {
		pie: {
			allowPointSelect: true,
			cursor: 'pointer',
			dataLabels: {
				enabled: true,
				format: '<b>{point.name}</b>: {point.percentage:.1f} %',
				connectorColor: 'silver'
			}
		}
	},
	series: [{
		type: 'pie',
		name: '浏览器占比',
		data: [
			['Firefox',   45.0],
			{
				name: 'Chrome',
				y: 12.8,
				sliced: true,
				selected: true
			},
		]
	}]
});

但是在vue热更新以后总是会报错[Vue warn]: Error in mounted hook: "TypeError: b[1].indexOf is not a function" 
发现只有热更新的时候会报这个错，所以应该是第二次加载的时候会有问题，通过调试发现第二次function里的color从字符串色值变为了我们设置的这个对象所以导致设置色值的时候拿到的是一个对象。下面为优化写法，保证每次都color都为色值

let startColor = ''
let endColor = ''
// 第二次的时候color变为了对象，所以取色值要从对象里取
if (color instanceof Object) {
  startColor = color.stops[0][1]
  endColor = color.stops[1][1]
} else {
  startColor = color
  endColor = Highcharts.Color(color)
    .brighten(0.15)
    .get('rgb')
}
return {
  radialGradient: { cx: 0, cy: 0, r: 1 },
  stops: [[0, startColor], [1, endColor]]
}

还有一点，highcharts官网上的Highcharts.map方法建议改为Array.map