Форум | Последние учебники веб-разработки
×

Google Диаграммы Руководство

Google Диаграммы Главная Google Диаграммы обзор Google Диаграммы Environment Setup Google Диаграммы Синтаксис конфигурации Google Диаграммы Площадь Диаграммы Google Диаграммы Бар Графики Google Диаграммы пузырьковые диаграммы Google Диаграммы Календарь Графики Google Диаграммы Подсвечники Графики Google Диаграммы Гистограммы Google Диаграммы Комбинированная диаграмма Google Диаграммы Гистограмма Диаграммы Google Диаграммы Линейные графики Google Диаграммы Карты Google Диаграммы Организационная диаграмма Google Диаграммы Круговые диаграммы Google Диаграммы Санки Графики Google Диаграммы Точечные диаграммы Google Диаграммы Ступенчатые Диаграммы района Google Диаграммы Таблица Диаграмма Google Диаграммы Хронология Графики Google Диаграммы TreeMap Диаграмма Google Диаграммы Trendline Графики Google Диаграммы Краткое пособие Google Диаграммы Полезные ресурсы


 

Google Диаграммы Учебник



Google Диаграммы является чисто на основе JavaScript графиков библиотека предназначена для улучшения веб - приложений, добавляя интерактивные возможности построения графиков.Google Графики предоставляет широкий спектр графиков. Например, линейные графики, диаграммы сплайн, область диаграммы, гистограммы, круговые диаграммы и так далее.

Этот урок научит вас основам Google Charts. Учебник содержит главы, обсуждающих все основные компоненты Google диаграмм с соответствующими примерами.


Аудитория

Это руководство предназначено для программного обеспечения профессионалов, которые готовы учиться Google Графики в простых шагов. Этот учебник даст вам большое понимание о концепциях Google Диаграммы и после завершения этого учебника вы будете на промежуточном уровне experties, откуда вы можете взять себя на более высоком уровне знаний.


Предпосылки

Прежде чем приступить к этой обучающей программе вы должны иметь базовое понимание JavaScript, HTML, CSS и в любом текстовом редакторе.


Попробуйте Google Графики Интернет

Для большинства из примеров , приведенных в данном руководстве вы найдетеПопробуйте вариант, так что просто сделать использование этой опции для выполнения ваших программ на месте и наслаждаться обучения.

Попробуйте выполнить пример с использованиемПопробуйте опция доступна в правом верхнем углу ниже образца кода коробки -

<html>
<head>
<title>Google Charts Tutorial</title>
   <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
   <script type="text/javascript">
     google.charts.load('current', {packages: ['corechart']});     
   </script>
</head>
<body>
<div id="container" style="width: 550px; height: 400px; margin: 0 auto"></div>
<script language="JavaScript">
function drawChart() {
   // Define the chart to be drawn.
   var data = new google.visualization.DataTable();
   data.addColumn('string', 'Browser');
   data.addColumn('number', 'Percentage');
   data.addRows([
      ['Firefox', 45.0],
      ['IE', 26.8],
      ['Chrome', 12.8],
	  ['Safari', 8.5],
      ['Opera', 6.2],
      ['Others', 0.7]
   ]);
   
   // Set chart options
   var options = {'title':'Browser market shares at a specific website, 2014',
      'width':550,
      'height':400};

   // Instantiate and draw the chart.
   var chart = new google.visualization.PieChart(document.getElementById('container'));
   chart.draw(data, options);
}
google.charts.setOnLoadCallback(drawChart);
</script>
</body>
</html>