График изображения свечи

Важно! Часть «Диаграммы изображений» в Google Chart Tools официально объявлена ​​устаревшей с 20 апреля 2012 г. Она продолжит работать в соответствии с нашей политикой прекращения поддержки .

  1. Обзор
  2. Пример
  3. Загрузка
  4. Формат данных
  5. Параметры конфигурации
  6. Методы
  7. События
  8. Политика данных

Обзор

Свечная диаграмма, отображаемая в виде изображения с помощью API Google Charts .

Свечной график используется для отображения значений открытия и закрытия, наложенных на общую дисперсию. Свечные графики часто используются для отображения поведения стоимости акций. На этой диаграмме элементы, у которых значение открытия меньше значения закрытия, нарисованы зеленым цветом, а элементы, у которых значение открытия больше значения закрытия, нарисованы красным. Дополнительную информацию см. в документации по свечам в API Google Charts .

Пример 

<html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load("current", {packages:["imagechart"]});
      google.charts.setOnLoadCallback(drawChart);

      function drawChart() {

        var options = {};
        dataTable = google.visualization.arrayToDataTable([
          ['Gainers',10,30,45,60],
          ['Losers',20,35,25,45],
          ], true);

       var chart = new google.visualization.ImageCandlestickChart(document.getElementById('chart_div'));
       chart.draw(dataTable, options);
      }
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 400px; height: 240px;"></div>
  </body>
</html>

Загрузка

Имя пакета google.charts.load — "imagechart" .

  google.charts.load('current', {packages: [imagechart]});

Имя класса визуализации — google.visualization. ImageCandlestickChart .

  var visualization = new google.visualization.ImageCandlestickChart(container);

Формат данных

Пять столбцов, где каждая строка описывает один свечной маркер:

  • Столбец 0: строка, используемая в качестве метки для этого маркера на оси X.
  • Столбец 1: Число, указывающее нижнее/минимальное значение этого маркера. Это основа черной линии.
  • Столбец 2: Число, определяющее начальное/начальное значение этого маркера. Это одна вертикальная граница свечи. Если значение меньше значения в столбце 3, свеча будет зеленой; в противном случае он будет красным.
  • Столбец 3: Число, определяющее закрывающее/окончательное значение этого маркера. Это вторая вертикальная граница свечи. Если значение меньше значения в столбце 2, свеча будет красной; в противном случае он будет зеленым.
  • Столбец 4: Число, определяющее верхнее/максимальное значение этого маркера. Это вершина черной линии.

Параметры конфигурации

В дополнение к опциям, поддерживаемым графиком общего изображения , свечной график поддерживает следующие параметры:

Имя Тип По умолчанию Описание
фоновый цвет нить '#FFFFFF' (белый) Цвет фона диаграммы. Это строка #RRGGBB, включая знак #.
showAxisLines логическое значение истинный Показывать ли оси. Если установлено значение false, метки осей также не будут отображаться.
высота число Высота содержащего элемента Высота диаграммы в пикселях. Если 30 < высота или высота > 1000, то это значение по умолчанию будет равно 200.
Макс число Максимальное значение данных Максимальное значение оси Y.
мин число Минимальное значение данных Минимальное значение оси Y.
showCategoryLabels логическое значение истинный Если false, метки оси X скрываются.
showValueLabels логическое значение истинный Если false, метки оси Y скрываются.
showValueLabelsInternal число авто Расстояние между метками оси Y в пикселях.
заголовок нить '' Текст для отображения над диаграммой.
ширина число Ширина содержащего элемента Ширина диаграммы в пикселях. Если ширина меньше 30 или больше 1000, то для ширины будет установлено значение 300.

Методы

Метод Тип возврата Описание
draw(data, options) никто Рисует диаграмму.

События

Вы можете зарегистрироваться, чтобы услышать события, описанные на странице «Общая диаграмма изображений» .

Политика данных

См. политику ведения журналов Chart API .