Я хочу сделать эту функцию Javascript более эффективной?

Question

У меня есть три круговые диаграммы, создаваемые с использованием API графиков Google. Я хочу сжать эту функцию дальше, так как есть много дублирования. Есть ли цикл я могу сделать для него и т.д.

if (data) { 
      var myVar = []; 
      var myVar1 = []; 
      var myVar2 = []; 

      myVar.push(['Label', 'Value']); 
      myVar1.push(['Label', 'Value']); 
      myVar2.push(['Label', 'Value']); 

      myVar.push(['Car Sales Today', data.salesToday, ]); 
      myVar1.push(['Car Sales Yesterday', data.salesYesterday]); 
      myVar2.push(['Car Sales Last Week', data.salesLastWeek]); 

      var build1 = { 
       package: 'PieChart', 
       data: myVar, 
       customTooltips: [ 
        data.salesToday, 
       ], 
       container: 'today-sales-chart', 
       options: { 
        width: 'auto', 
        height: 300, 
        chartArea: { width: '50%', height: '80%' }, 
        yAxis: { textPosition: 'none' }, 
        legend: { position: "bottom" }, 
        tooltip: { isHtml: true }, 
        colors: ['#e6dc39'], 
        pieSliceText: 'none' 
       } 
      }; 
      var build2 = { 
       package: 'PieChart', 
       data: myVar1, 
       customTooltips: [ 
        data.salesYesterday, 
       ], 
       container: 'yesterday-sales-chart', 
       options: { 
        width: 'auto', 
        height: 300, 
        chartArea: { width: '50%', height: '80%' }, 
        yAxis: { textPosition: 'none' }, 
        legend: { position: "bottom" }, 
        tooltip: { isHtml: true }, 
        colors: ['#33bb18'], 
        pieSliceText: 'none' 
       } 
      }; 
      var build3 = { 
       package: 'PieChart', 
       data: myVar2, 
       customTooltips: [ 
        data.salesLastWeek 
       ], 
       container: 'lastweek-sales-chart', 
       options: { 
        width: 'auto', 
        height: 300, 
        chartArea: { width: '50%', height: '80%' }, 
        yAxis: { textPosition: 'none' }, 
        legend: { position: "bottom" }, 
        tooltip: { isHtml: true }, 
        colors: ['#e06e29'], 
        pieSliceText: 'none' 
       } 
      }; 
      charts.push(build1, build2, build3); 
      google.setOnLoadCallback.drawCharts(build1.container); 
      google.setOnLoadCallback.drawCharts(build2.container); 
      google.setOnLoadCallback.drawCharts(build3.container); 
     } 

Я попытался сделать следующее, например:

var myVar, myVar1, myVar2 = []; 

, но я получаю сообщение об ошибке. Любая помощь будет большой.

Answer 1

Я потратил некоторое время, чтобы оптимизировать ваш код, но я не тестировал его. убедитесь, что все имена переменных в порядке, и не делают конфликт на код

if (data) { 
    var allData = [{ 
      arr : [['Label', 'Value'], ['Car Sales Today', data.salesToday]], 
      container : 'today-sales-chart', 
      customTooltips: data.salesToday 
     } 
     ,{ 
      arr : [['Label', 'Value'], ['Car Sales Yesterday', data.salesYesterday]], 
      container : 'yesterday-sales-chart', 
      customTooltips: data.salesYesterday 
     } 
     ,{ 
      arr : [['Label', 'Value'], ['Car Sales Last Week', data.salesLastWeek]], 
      container : 'lastweek-sales-chart', 
      customTooltips: data.salesLastWeek 
     } 
    ]; 

    var options = { 
     width: 'auto', 
     height: 300, 
     chartArea: { width: '50%', height: '80%' }, 
     yAxis: { textPosition: 'none' }, 
     legend: { position: "bottom" }, 
     tooltip: { isHtml: true }, 
     colors: ['#e6dc39'], 
     pieSliceText: 'none' 
    } 

    var builds = []; 
    for (var index in allData) { 
     builds.push({ 
      package: 'PieChart', 
      data: allData[index].arr, 
      customTooltips: [ allData[index].customTooltips ], 
      container: allData[index].container, 
      options: options 
     }); 
    } 

    for(var index in builds) { 
     charts.push(builds[index]); 
     google.setOnLoadCallback.drawCharts(builds[index].container); 
    } 
} 

Update

добавить возможность изменить цвет, в этом случае вам не нужно использовать параметры в качестве независимой переменной:

var builds = []; 
    for (var index in allData) { 
     builds.push({ 
      package: 'PieChart', 
      data: allData[index].arr, 
      customTooltips: [ allData[index].customTooltips ], 
      container: allData[index].container, 
      options: { 
       width: 'auto', 
       height: 300, 
       chartArea: { width: '50%', height: '80%' }, 
       yAxis: { textPosition: 'none' }, 
       legend: { position: "bottom" }, 
       tooltip: { isHtml: true }, 
       colors: allData[index].color, // <--- you set the color here 
       pieSliceText: 'none' 
      } 
     }); 
    }