Google Analytics Внедрение авторизации на стороне сервера API. Настройка диаграмм.

Question

.

. Я успешно настроил авторизацию на основе API-интерфейсов API для Google Analytics. Однако мне нужно настроить некоторые цвета, как они сделали here, с использованием обычной авторизации:

Код, который они используют для извлечения и стилизации диаграммы, отличается от кода, который они приводят в качестве примера, приведенного для серверной версии auth, я пробовал смешивать два, но не повезло.

Я предполагаю, что есть различные варианты, вы можете пройти в этом разделе:

  'options': { 
      'width': '100%' 
      } 

Я попробовал несколько вариантов, которые они используют на регулярном примере авторизации, но только один работали (название):

  'options': { 
      'width': '100%', 
      'title': 'My chart' 
      } 

Я вставил полный код, который используется для извлечения диаграммы с использованием серверной стороны аутентификации:

 var dataChart1 = new gapi.analytics.googleCharts.DataChart({ 
     query: { 
      'ids': 'ga:68742285', // The Demos & Tools website view. 
      'start-date': '30daysAgo', 
      'end-date': 'yesterday', 
      'metrics': 'ga:sessions,ga:users', 
      'dimensions': 'ga:date' 
     }, 
     chart: { 
      'container': 'chart-1-container', 
      'type': 'LINE', 
      'options': { 
      'width': '100%' 
      } 
     } 
     }); 
     dataChart1.execute(); 

А вот что они используют для изменения цвета с помощью регулярного AUTH:

 /** 
     * Draw the a chart.js line chart with data from the specified view that 
     * overlays session data for the current week over session data for the 
     * previous week. 
     */ 
     function renderWeekOverWeekChart(ids) { 

     // Adjust `now` to experiment with different days, for testing only... 
     var now = moment(); // .subtract(3, 'day'); 

     var thisWeek = query({ 
      'ids': ids, 
      'dimensions': 'ga:date,ga:nthDay', 
      'metrics': 'ga:sessions', 
      'start-date': moment(now).subtract(1, 'day').day(0).format('YYYY-MM-DD'), 
      'end-date': moment(now).format('YYYY-MM-DD') 
     }); 

     var lastWeek = query({ 
      'ids': ids, 
      'dimensions': 'ga:date,ga:nthDay', 
      'metrics': 'ga:sessions', 
      'start-date': moment(now).subtract(1, 'day').day(0).subtract(1, 'week') 
       .format('YYYY-MM-DD'), 
      'end-date': moment(now).subtract(1, 'day').day(6).subtract(1, 'week') 
       .format('YYYY-MM-DD') 
     }); 

     Promise.all([thisWeek, lastWeek]).then(function(results) { 

      var data1 = results[0].rows.map(function(row) { return +row[2]; }); 
      var data2 = results[1].rows.map(function(row) { return +row[2]; }); 
      var labels = results[1].rows.map(function(row) { return +row[0]; }); 

      labels = labels.map(function(label) { 
      return moment(label, 'YYYYMMDD').format('ddd'); 
      }); 

      var data = { 
      labels : labels, 
      datasets : [ 
       { 
       label: 'Last Week', 
       fillColor : 'rgba(220,220,220,0.5)', 
       strokeColor : 'rgba(220,220,220,1)', 
       pointColor : 'rgba(220,220,220,1)', 
       pointStrokeColor : '#fff', 
       data : data2 
       }, 
       { 
       label: 'This Week', 
       fillColor : 'rgba(151,187,205,0.5)', 
       strokeColor : 'rgba(151,187,205,1)', 
       pointColor : 'rgba(151,187,205,1)', 
       pointStrokeColor : '#fff', 
       data : data1 
       } 
      ] 
      }; 

      new Chart(makeCanvas('chart-1-container')).Line(data); 
      generateLegend('legend-1-container', data.datasets); 
     }); 
     } 

Answer 1

Я бы поиграться с этим кодом заявлением.

var options = { 
    colors: ['#e0440e', '#e6693e', '#ec8f6e', '#f3b49f', '#f6c7b6'] 
}; 

Опция изменения цвета графика находится под «параметрами» диаграммы. Конкретный график, на который я взял этот код, был круговой диаграммой, поэтому я не совсем уверен, как он будет работать с вашей линейной диаграммой. Играйте с ним, и я уверен, что вы найдете способ изменить цвета с кодом, который я опубликовал.