Визуализация: пузырьковая диаграмма

Продолжительность анимации в миллисекундах. Подробности смотрите в документации по анимации .

Функция замедления, примененная к анимации. Доступны следующие варианты:

• «линейный» — постоянная скорость.
• 'in' - Легкость - Начинайте медленно и ускоряйтесь.
• 'out' - Успокойтесь - Начинайте быстро и замедляйтесь.
• «inAndOut» — легкость входа и выхода — начинайте медленно, ускоряйтесь, затем замедляйтесь.

Определяет, будет ли диаграмма анимироваться при первоначальном рисовании. Если true , диаграмма начнется с базовой линии и анимируется до конечного состояния.

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

• in — Нарисуйте заголовки осей внутри области диаграммы.
• out — вывести заголовки осей за пределы области диаграммы.
• нет — пропустить названия осей.

Цвет фона основной области диаграммы. Это может быть либо простая цветовая строка HTML, например: 'red' или '#00cc00' , либо объект со следующими свойствами.

Цвет границы диаграммы в виде цветовой строки HTML.

Ширина границы в пикселях.

Цвет заливки диаграммы в виде цветовой строки HTML.

Объект с членами для настройки визуальных свойств пузырьков.

Непрозрачность пузырьков, где 0 — полностью прозрачный, а 1 — полностью непрозрачный.

Цвет обводки пузырьков.

Объект, определяющий стиль пузырькового текста. Объект имеет такой формат:

{color: <string>, fontName: <string>, fontSize: <number>}

color может быть любой цветовой строкой HTML, например: 'red' или '#00cc00' . Также см. fontName и fontSize .

Объект с элементами для настройки размещения и размера области диаграммы (где рисуется сама диаграмма, исключая оси и легенды). Поддерживаются два формата: число или число, за которым следует %. Простое число — это значение в пикселях; число, за которым следует %, представляет собой процент. Пример: chartArea:{left:20,top:0,width:'50%',height:'75%'}

• stroke : цвет, представленный в виде шестнадцатеричной строки или английского названия цвета.
• strokeWidth : если предусмотрено, рисует границу вокруг области диаграммы заданной ширины (и с цветом stroke ).

Насколько далеко рисовать диаграмму от левой границы.

На каком расстоянии рисовать диаграмму от верхней границы.

Ширина области диаграммы.

Высота области диаграммы.

Цвета, используемые для элементов диаграммы. Массив строк, где каждый элемент представляет собой строку цвета HTML, например: colors:['red','#004411'] .

Объект, определяющий сопоставление между значениями столбца цвета и цветами или шкалой градиента. Чтобы указать свойства этого объекта, вы можете использовать буквальную запись объекта, как показано здесь:

 {minValue: 0,  colors: ['#FF0000', '#00FF00']}

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

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

Если присутствует, управляет тем, как значения связаны с цветами. Каждое значение связано с соответствующим цветом в массиве colorAxis.colors . Эти значения применяются к данным цвета диаграммы. Окраска производится согласно градиенту указанных здесь значений. Отсутствие указания значения для этой опции эквивалентно указанию [minValue, maxValue].

Цвета для назначения значениям в визуализации. Массив строк, где каждый элемент представляет собой строку цвета HTML, например: colorAxis: {colors:['red','#004411']} . У вас должно быть как минимум два значения; градиент будет включать в себя все ваши значения, а также вычисленные промежуточные значения, причем первый цвет будет наименьшим значением, а последний цвет — самым высоким.

Объект, определяющий стиль легенды цвета градиента.

Позиция легенды. Может быть одним из следующих:

• 'top' - Над графиком.
• «дно» — под графиком.
• 'in' - Внутри графика, вверху.
• 'none' — легенда не отображается.

Объект, определяющий стиль текста легенды. Объект имеет такой формат:

{color: <string>, fontName: <string>, fontSize: <number>}

color может быть любой цветовой строкой HTML, например: 'red' или '#00cc00' . Также см. fontName и fontSize .

Строка формата для числовых меток. Это подмножество набора шаблонов ICU . Например, {numberFormat:'.##'} будет отображать значения «10,66», «10,6» и «10,0» для значений 10,666, 10,6 и 10.

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

Опция explorer позволяет пользователям панорамировать и масштабировать диаграммы Google. explorer: {} обеспечивает поведение проводника по умолчанию, позволяя пользователям перемещаться по горизонтали и вертикали путем перетаскивания, а также увеличивать и уменьшать масштаб путем прокрутки.

Эта функция является экспериментальной и может измениться в будущих выпусках.

Примечание. Проводник работает только с непрерывными осями (например, числами или датами).

Обозреватель Google Charts поддерживает три действия:

• dragToPan : перетаскивайте диаграмму для перемещения по горизонтали и вертикали. Для панорамирования только по горизонтальной оси используйте explorer: { axis: 'horizontal' } . Аналогично для вертикальной оси.
• dragToZoom : поведение проводника по умолчанию — увеличение и уменьшение масштаба при прокрутке пользователем. Если используется explorer: { actions: ['dragToZoom', 'rightClickToReset'] } , перетаскивание по прямоугольной области увеличивает масштаб этой области. Мы рекомендуем использовать rightClickToReset всякий раз, когда используется dragToZoom . См. explorer.maxZoomIn , explorer.maxZoomOut и explorer.zoomDelta для настройки масштабирования.
• rightClickToReset : щелчок правой кнопкой мыши по диаграмме возвращает ее к исходному уровню панорамирования и масштабирования.

По умолчанию пользователи могут панорамировать как по горизонтали, так и по вертикали, когда используется опция explorer . Если вы хотите, чтобы пользователи могли панорамировать только по горизонтали, используйте explorer: { axis: 'horizontal' } . Аналогично, explorer: { axis: 'vertical' } включает только вертикальное панорамирование.

По умолчанию пользователи могут панорамировать все вокруг, независимо от того, где находятся данные. Чтобы гарантировать, что пользователи не выходят за пределы исходной диаграммы, используйте explorer: { keepInBounds: true } .

Максимальное увеличение, которое может увеличить проводник. По умолчанию пользователи смогут увеличить масштаб настолько, что смогут видеть только 25 % исходного изображения. Настройка explorer: { maxZoomIn: .5 } позволит пользователям увеличивать масштаб только настолько, чтобы увидеть половину исходного изображения.

Максимум, на который может уменьшить масштаб проводник. По умолчанию пользователи смогут уменьшить масштаб настолько, что диаграмма будет занимать только 1/4 доступного пространства. Настройка explorer: { maxZoomOut: 8 } позволит пользователям уменьшать масштаб настолько, что диаграмма будет занимать только 1/8 доступного пространства.

Когда пользователи увеличивают или уменьшают масштаб, explorer.zoomDelta определяет, насколько они увеличивают масштаб. Чем меньше число, тем плавнее и медленнее масштабирование.

Размер шрифта по умолчанию (в пикселях) для всего текста на диаграмме. Вы можете переопределить это, используя свойства для определенных элементов диаграммы.

Шрифт по умолчанию для всего текста на диаграмме. Вы можете переопределить это, используя свойства для определенных элементов диаграммы.

Рисует диаграмму внутри встроенного фрейма. (Обратите внимание, что в IE8 этот параметр игнорируется; все диаграммы IE8 рисуются в i-кадрах.)

Объект с элементами для настройки различных элементов горизонтальной оси. Чтобы указать свойства этого объекта, вы можете использовать буквальную запись объекта, как показано здесь:

{
  title: 'Hello',
  titleTextStyle: {
    color: '#FF0000'
  }
}
    

Базовая линия для горизонтальной оси.

Цвет базовой линии горизонтальной оси. Может быть любой цветовой строкой HTML, например: 'red' или '#00cc00' .

Направление роста значений по горизонтальной оси. Укажите -1 , чтобы изменить порядок значений.

Строка формата для меток числовых осей. Это подмножество набора шаблонов ICU . Например, {format:'#,###%'} будет отображать значения «1000%», «750%» и «50%» для значений 10, 7,5 и 0,5. Вы также можете предоставить что-либо из следующего:

• {format: 'none'} : отображает числа без форматирования (например, 8000000).
• {format: 'decimal'} : отображает числа с разделителями тысяч (например, 8 000 000).
• {format: 'scientific'} : отображает числа в экспоненциальном формате (например, 8e6).
• {format: 'currency'} : отображает числа в местной валюте (например, 8 000 000,00 долларов США).
• {format: 'percent'} : отображает числа в процентах (например, 800 000 000%).
• {format: 'short'} : отображает сокращенные номера (например, 8M)
• {format: 'long'} : отображает числа как полные слова (например, 8 миллионов).

Фактическое форматирование, примененное к метке, определяется языковым стандартом, с которым был загружен API. Дополнительные сведения см. в разделе Загрузка диаграмм с определенной локалью .

При вычислении значений делений и линий сетки будут рассматриваться несколько альтернативных комбинаций всех соответствующих вариантов линий сетки, и альтернативы будут отклонены, если отформатированные метки делений будут дублироваться или перекрываться. Таким образом, вы можете указать format:"#" если хотите отображать только целочисленные значения делений, но имейте в виду, что если ни одна альтернатива не удовлетворяет этому условию, ни линии сетки, ни деления отображаться не будут.

Объект со свойствами для настройки линий сетки на горизонтальной оси. Обратите внимание, что линии сетки по горизонтальной оси рисуются вертикально. Чтобы указать свойства этого объекта, вы можете использовать буквальную запись объекта, как показано здесь:

{color: '#333', minSpacing: 20}

Цвет горизонтальных линий сетки внутри области диаграммы. Укажите допустимую цветовую строку HTML.

Примерное количество горизонтальных линий сетки внутри области диаграммы. Если вы укажете положительное число для gridlines.count , оно будет использоваться для вычисления minSpacing между линиями сетки. Вы можете указать значение 1 , чтобы рисовать только одну линию сетки, или 0 , чтобы линии сетки не отображались. Укажите -1 (значение по умолчанию), чтобы автоматически вычислить количество линий сетки на основе других параметров.

Переопределяет формат по умолчанию для различных аспектов типов данных date/datetime/timeofday при использовании с вычисляемыми линиями сетки диаграммы. Позволяет форматировать годы, месяцы, дни, часы, минуты, секунды и миллисекунды.

Общий формат:

gridlines: {
  units: {
    years: {format: [/*format strings here*/]},
    months: {format: [/*format strings here*/]},
    days: {format: [/*format strings here*/]}
    hours: {format: [/*format strings here*/]}
    minutes: {format: [/*format strings here*/]}
    seconds: {format: [/*format strings here*/]},
    milliseconds: {format: [/*format strings here*/]},
  }
}
    

Дополнительную информацию можно найти в разделе Даты и время .

Объект с элементами для настройки второстепенных линий сетки на горизонтальной оси, аналогично параметру hAxis.gridlines.

Цвет второстепенных горизонтальных линий сетки внутри области диаграммы. Укажите допустимую цветовую строку HTML.

Параметр minorGridlines.count по большей части устарел, за исключением отключения второстепенных линий сетки путем установки счетчика равным 0. Количество второстепенных линий сетки теперь полностью зависит от интервала между основными линиями сетки (см. hAxis.gridlines.interval ) и минимально необходимого пространства (см. hAxis.minorGridlines.minSpacing ).

Переопределяет формат по умолчанию для различных аспектов типов данных date/datetime/timeofday при использовании с вычисляемыми диаграммами majorGridlines. Позволяет форматировать годы, месяцы, дни, часы, минуты, секунды и миллисекунды.

Общий формат:

gridlines: {
  units: {
    years: {format: [/*format strings here*/]},
    months: {format: [/*format strings here*/]},
    days: {format: [/*format strings here*/]}
    hours: {format: [/*format strings here*/]}
    minutes: {format: [/*format strings here*/]}
    seconds: {format: [/*format strings here*/]},
    milliseconds: {format: [/*format strings here*/]},
  }
}
    

Дополнительную информацию можно найти в разделе Даты и время .

Свойство hAxis , которое преобразует горизонтальную ось в логарифмический масштаб (требуется, чтобы все значения были положительными). Установите значение true для «да».

Свойство hAxis , которое преобразует горизонтальную ось в логарифмический масштаб. Может быть одним из следующих:

• null — логарифмическое масштабирование не выполняется.
• 'log' - логарифмическое масштабирование. Отрицательные и нулевые значения не отображаются. Этот параметр аналогичен настройке hAxis: { logscale: true } .
• 'mirrorLog' — логарифмическое масштабирование, при котором отображаются отрицательные и нулевые значения. Нанесенное на график значение отрицательного числа является отрицательным логарифмом абсолютного значения. Значения, близкие к 0, отображаются в линейном масштабе.

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

Объект, определяющий стиль текста по горизонтальной оси. Объект имеет такой формат:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color может быть любой цветовой строкой HTML, например: 'red' или '#00cc00' . Также см. fontName и fontSize .

Заменяет автоматически сгенерированные отметки оси X указанным массивом. Каждый элемент массива должен быть либо допустимым значением тика (например, числом, датой, датой и временем или днем), либо объектом. Если это объект, он должен иметь свойство v для значения отметки и необязательное свойство f , содержащее литеральную строку, которая будет отображаться в качестве метки.

ViewWindow будет автоматически расширен, чтобы включить отметки min и max, если вы не укажете viewWindow.min или viewWindow.max для переопределения.

Примеры:

• hAxis: { ticks: [5,10,15,20] }
• hAxis: { ticks: [{v:32, f:'thirty two'}, {v:64, f:'sixty four'}] }
• hAxis: { ticks: [new Date(2014,3,15), new Date(2013,5,15)] }
• hAxis: { ticks: [16, {v:32, f:'thirty two'}, {v:64, f:'sixty four'}, 128] }

Свойство hAxis , определяющее заголовок горизонтальной оси.

Объект, определяющий стиль текста заголовка по горизонтальной оси. Объект имеет такой формат:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color может быть любой цветовой строкой HTML, например: 'red' или '#00cc00' . Также см. fontName и fontSize .

Перемещает максимальное значение горизонтальной оси на указанное значение; на большинстве графиков это будет вправо. Игнорируется, если для этого параметра установлено значение меньше максимального значения x данных. hAxis.viewWindow.max переопределяет это свойство.

Перемещает минимальное значение горизонтальной оси на указанное значение; на большинстве графиков это будет левое положение. Игнорируется, если для этого параметра установлено значение, превышающее минимальное значение x данных. hAxis.viewWindow.min переопределяет это свойство.

Указывает, как масштабировать горизонтальную ось для отображения значений в области диаграммы. Поддерживаются следующие строковые значения:

• «красиво» — масштабируйте горизонтальные значения так, чтобы максимальные и минимальные значения данных отображались немного внутри левой и правой части области диаграммы. Окно просмотра расширяется до ближайшей основной линии сетки для чисел или ближайшей второстепенной линии сетки для дат и времени.
• «максимизировано» — масштабируйте горизонтальные значения так, чтобы максимальные и минимальные значения данных касались левой и правой части области диаграммы. Это приведет к игнорированию haxis.viewWindow.min и haxis.viewWindow.max .
• «явный» — устаревший параметр для указания значений левого и правого масштаба области диаграммы. (Устарело, поскольку оно избыточно для haxis.viewWindow.min и haxis.viewWindow.max .) Значения данных за пределами этих значений будут обрезаны. Вы должны указать объект hAxis.viewWindow описывающий максимальное и минимальное отображаемые значения.

Указывает диапазон обрезки горизонтальной оси.

Максимальное значение горизонтальных данных для визуализации.

Игнорируется, когда hAxis.viewWindowMode имеет значение «красивый» или «максимальный».

Минимальное значение горизонтальных данных для визуализации.

Игнорируется, когда hAxis.viewWindowMode имеет значение «красивый» или «максимальный».

Высота диаграммы в пикселях.

Объект с членами для настройки различных аспектов легенды. Чтобы указать свойства этого объекта, вы можете использовать буквальную запись объекта, как показано здесь:

{position: 'top', textStyle: {color: 'blue', fontSize: 16}}

Согласование легенды. Может быть одним из следующих:

• «Начало» — выравнивается по началу области, выделенной для легенды.
• 'center' — центрируется в области, отведенной для легенды.
• «конец» — выравнивается по концу области, выделенной для легенды.

Начало, центр и конец зависят от стиля легенды (вертикального или горизонтального). Например, в «правой» легенде «начало» и «конец» находятся вверху и внизу соответственно; для «верхней» легенды «начало» и «конец» будут находиться слева и справа от области соответственно.

Значение по умолчанию зависит от положения легенды. Для «нижних» легенд по умолчанию используется «центр»; другие легенды по умолчанию имеют значение «старт».

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

В настоящее время эта опция работает только тогда, когда Legend.position имеет значение «top».

Начальный выбранный индекс страницы легенды, отсчитываемый от нуля.

Позиция легенды. Может быть одним из следующих:

• «дно» — под графиком.
• «left» — слева от диаграммы, при условии, что с левой осью не связана никакая серия. Поэтому, если вам нужна легенда слева, используйте опцию targetAxisIndex: 1 .
• 'in' — внутри диаграммы, в верхнем левом углу.
• 'none' — легенда не отображается.
• 'right' - Справа от диаграммы. Несовместимо с опцией vAxes .
• 'top' - Над графиком.

Объект, определяющий стиль текста легенды. Объект имеет такой формат:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color может быть любой цветовой строкой HTML, например: 'red' или '#00cc00' . Также см. fontName и fontSize .

Если selectionMode имеет значение 'multiple' , пользователи могут выбрать несколько точек данных.

Объект объектов, ключами которого являются названия серий (значения в столбце Цвет) и каждый объект, описывающий формат соответствующей серии на диаграмме. Если серия или значение не указаны, будет использоваться глобальное значение. Каждый объект поддерживает следующие свойства:

• color — цвет, используемый для этой серии. Укажите допустимую цветовую строку HTML.
• visibleInLegend — логическое значение, где true означает, что серия должна иметь запись легенды, а false означает, что ее не должно быть. По умолчанию верно.

series: {'Europe': {color: 'green'}}

Объект с элементами для настройки связи значений с размером пузырька. Чтобы указать свойства этого объекта, вы можете использовать буквальную запись объекта, как показано здесь:

 {minValue: 0,  maxSize: 20}

Максимальный радиус максимально возможного пузырька в пикселях.

Значение размера (как показано в данных диаграммы), которое должно быть сопоставлено с sizeAxis.maxSize . Большие значения будут обрезаны до этого значения.

Минимальный радиус наименьшего возможного пузырька в пикселях.

Значение размера (как показано в данных диаграммы), которое должно быть сопоставлено с sizeAxis.minSize . Меньшие значения будут обрезаны до этого значения.

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

Тема — это набор предопределенных значений параметров, которые вместе обеспечивают достижение определенного поведения диаграммы или визуального эффекта. На данный момент доступна только одна тема:

• «максимизировано» — увеличивает область диаграммы и рисует легенду и все метки внутри области диаграммы. Устанавливает следующие параметры:

  chartArea: {width: '100%', height: '100%'},
  legend: {position: 'in'},
  titlePosition: 'in', axisTitlesPosition: 'in',
  hAxis: {textPosition: 'in'}, vAxis: {textPosition: 'in'}
          

Текст для отображения над диаграммой.

Где разместить заголовок диаграммы по сравнению с областью диаграммы. Поддерживаемые значения:

• in — Нарисуйте заголовок внутри области диаграммы.
• out — вывести заголовок за пределы области диаграммы.
• нет – опустите заголовок.

Объект, определяющий стиль текста заголовка. Объект имеет такой формат:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color может быть любой цветовой строкой HTML, например: 'red' или '#00cc00' . Также см. fontName и fontSize .

Объект с членами для настройки различных элементов подсказки. Чтобы указать свойства этого объекта, вы можете использовать буквальную запись объекта, как показано здесь:

{textStyle: {color: '#FF0000'}, showColorCode: true}

Если установлено значение true, используйте всплывающие подсказки, отображаемые в формате HTML (а не в формате SVG). Дополнительные сведения см. в разделе «Настройка содержимого всплывающей подсказки» .

Примечание. Настройка содержимого всплывающей подсказки HTML с помощью роли данных столбца подсказки не поддерживается визуализацией пузырьковой диаграммы .

Объект, определяющий стиль текста подсказки. Объект имеет такой формат:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color может быть любой цветовой строкой HTML, например: 'red' или '#00cc00' . Также см. fontName и fontSize .

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

• «фокус» — всплывающая подсказка будет отображаться, когда пользователь наводит курсор на элемент.
• «нет» — всплывающая подсказка не будет отображаться.
• «выбор» — всплывающая подсказка будет отображаться, когда пользователь выбирает элемент.

Объект с элементами для настройки различных элементов вертикальной оси. Чтобы указать свойства этого объекта, вы можете использовать буквальную запись объекта, как показано здесь:

{title: 'Hello', titleTextStyle: {color: '#FF0000'}}

Свойство vAxis , определяющее базовую линию вертикальной оси. Если базовая линия больше самой высокой линии сетки или меньше самой нижней линии сетки, она будет округлена до ближайшей линии сетки.

Указывает цвет базовой линии вертикальной оси. Может быть любой цветовой строкой HTML, например: 'red' или '#00cc00' .

Направление роста значений по вертикальной оси. По умолчанию низкие значения находятся внизу диаграммы. Укажите -1 , чтобы изменить порядок значений.

Строка формата для меток числовых осей. Это подмножество набора шаблонов ICU . Например, {format:'#,###%'} будет отображать значения «1000%», «750%» и «50%» для значений 10, 7,5 и 0,5. Вы также можете предоставить что-либо из следующего:

• {format: 'none'} : отображает числа без форматирования (например, 8000000).
• {format: 'decimal'} : отображает числа с разделителями тысяч (например, 8 000 000).
• {format: 'scientific'} : отображает числа в экспоненциальном формате (например, 8e6).
• {format: 'currency'} : отображает числа в местной валюте (например, 8 000 000,00 долларов США).
• {format: 'percent'} : отображает числа в процентах (например, 800 000 000%).
• {format: 'short'} : отображает сокращенные номера (например, 8M)
• {format: 'long'} : отображает числа как полные слова (например, 8 миллионов).

Фактическое форматирование, примененное к метке, определяется языковым стандартом, с которым был загружен API. Дополнительные сведения см. в разделе Загрузка диаграмм с определенной локалью .

При вычислении значений делений и линий сетки будут рассматриваться несколько альтернативных комбинаций всех соответствующих вариантов линий сетки, и альтернативы будут отклонены, если отформатированные метки делений будут дублироваться или перекрываться. Таким образом, вы можете указать format:"#" если хотите отображать только целочисленные значения делений, но имейте в виду, что если ни одна альтернатива не удовлетворяет этому условию, ни линии сетки, ни деления отображаться не будут.

Объект с элементами для настройки линий сетки по вертикальной оси. Обратите внимание, что линии сетки по вертикальной оси рисуются горизонтально. Чтобы указать свойства этого объекта, вы можете использовать буквальную запись объекта, как показано здесь:

{color: '#333', minSpacing: 20}

Цвет вертикальных линий сетки внутри области диаграммы. Укажите допустимую цветовую строку HTML.

Примерное количество горизонтальных линий сетки внутри области диаграммы. Если вы укажете положительное число для gridlines.count , оно будет использоваться для вычисления minSpacing между линиями сетки. Вы можете указать значение 1 , чтобы рисовать только одну линию сетки, или 0 , чтобы линии сетки не отображались. Укажите -1 (значение по умолчанию), чтобы автоматически вычислить количество линий сетки на основе других параметров.

Переопределяет формат по умолчанию для различных аспектов типов данных date/datetime/timeofday при использовании с вычисляемыми линиями сетки диаграммы. Позволяет форматировать годы, месяцы, дни, часы, минуты, секунды и миллисекунды.

Общий формат:

gridlines: {
  units: {
    years: {format: [/*format strings here*/]},
    months: {format: [/*format strings here*/]},
    days: {format: [/*format strings here*/]},
    hours: {format: [/*format strings here*/]},
    minutes: {format: [/*format strings here*/]},
    seconds: {format: [/*format strings here*/]},
    milliseconds: {format: [/*format strings here*/]}
  }
}
    

Дополнительную информацию можно найти в разделе Даты и время .

Объект с элементами для настройки второстепенных линий сетки на вертикальной оси, аналогично параметру vAxis.gridlines.

Цвет второстепенных вертикальных линий сетки внутри области диаграммы. Укажите допустимую цветовую строку HTML.

Параметр majorGridlines.count по большей части устарел, за исключением отключения второстепенных линий сетки путем установки счетчика равным 0. Количество второстепенных линий сетки зависит от интервала между основными линиями сетки (см. vAxis.gridlines.interval) и минимально необходимого пространства (см. vAxis. minorGridlines.minSpacing).

Переопределяет формат по умолчанию для различных аспектов типов данных date/datetime/timeofday при использовании с вычисляемыми диаграммами majorGridlines. Позволяет форматировать годы, месяцы, дни, часы, минуты, секунды и миллисекунды.

Общий формат:

gridlines: {
  units: {
    years: {format: [/*format strings here*/]},
    months: {format: [/*format strings here*/]},
    days: {format: [/*format strings here*/]}
    hours: {format: [/*format strings here*/]}
    minutes: {format: [/*format strings here*/]}
    seconds: {format: [/*format strings here*/]},
    milliseconds: {format: [/*format strings here*/]},
  }
}
    

Дополнительную информацию можно найти в разделе Даты и время .

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

Свойство vAxis , которое преобразует вертикальную ось в логарифмический масштаб. Может быть одним из следующих:

• null — логарифмическое масштабирование не выполняется.
• 'log' - логарифмическое масштабирование. Отрицательные и нулевые значения не отображаются. Этот параметр аналогичен настройке vAxis: { logscale: true } .
• 'mirrorLog' — логарифмическое масштабирование, при котором отображаются отрицательные и нулевые значения. Нанесенное на график значение отрицательного числа является отрицательным логарифмом абсолютного значения. Значения, близкие к 0, отображаются в линейном масштабе.

Положение текста вертикальной оси относительно области диаграммы. Поддерживаемые значения: «вне», «вход», «нет».

Объект, задающий стиль текста по вертикальной оси. Объект имеет такой формат:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color может быть любой цветовой строкой HTML, например: 'red' или '#00cc00' . Также см. fontName и fontSize .

Заменяет автоматически сгенерированные отметки оси Y указанным массивом. Каждый элемент массива должен быть либо допустимым значением тика (например, числом, датой, датой и временем или днем), либо объектом. Если это объект, он должен иметь свойство v для значения отметки и необязательное свойство f , содержащее литеральную строку, которая будет отображаться в качестве метки.

ViewWindow будет автоматически расширен, чтобы включить отметки min и max, если вы не укажете viewWindow.min или viewWindow.max для переопределения.

Примеры:

• vAxis: { ticks: [5,10,15,20] }
• vAxis: { ticks: [{v:32, f:'thirty two'}, {v:64, f:'sixty four'}] }
• vAxis: { ticks: [new Date(2014,3,15), new Date(2013,5,15)] }
• vAxis: { ticks: [16, {v:32, f:'thirty two'}, {v:64, f:'sixty four'}, 128] }

Свойство vAxis , указывающее заголовок вертикальной оси.

Объект, определяющий стиль текста заголовка вертикальной оси. Объект имеет такой формат:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
  

color может быть любой цветовой строкой HTML, например: 'red' или '#00cc00' . Также см. fontName и fontSize .

Перемещает максимальное значение вертикальной оси на указанное значение; на большинстве графиков это будет вверх. Игнорируется, если для этого параметра установлено значение меньше максимального значения y данных. vAxis.viewWindow.max переопределяет это свойство.

Перемещает минимальное значение вертикальной оси на указанное значение; на большинстве графиков это будет снижение. Игнорируется, если это установлено значение, превышающему минимальное значение y данных. vAxis.viewWindow.min переопределяет это свойство.

Указывает, как масштабировать вертикальную ось, чтобы отобразить значения в области диаграммы. Поддерживаются следующие строковые значения:

• «Довольно» - масштабируйте вертикальные значения так, чтобы максимальные и минимальные значения данных были сделаны немного в нижней и верхней части области диаграммы. ViewWindow расширяется до ближайшей основной линии сетки для чисел или ближайшей незначительной линии сетки для дат и времени.
• «Максимизированный» - масштабируйте вертикальные значения так, чтобы максимальные и минимальные значения данных касались верхней и нижней части области диаграммы. Это приведет к тому, что vaxis.viewWindow.min и vaxis.viewWindow.max будет игнорироваться.
• «Явный» - устаревший вариант для определения значений верхней и нижней шкалы площади диаграммы. (Установилось, потому что он избыточно с vaxis.viewWindow.min и vaxis.viewWindow.max . Значения данных за пределами этих значений будут обрезаны. Вы должны указать объект vAxis.viewWindow , описывающий максимальные и минимальные значения, чтобы показать.

Указывает диапазон обрезки вертикальной оси.

Максимальное значение вертикального данных для рендеринга.

Игнорируется, когда vAxis.viewWindowMode «симпатичный» или «максимизирован».

Минимальное значение вертикального данных для рендеринга.

Игнорируется, когда vAxis.viewWindowMode «симпатичный» или «максимизирован».

Ширина диаграммы, в пикселях.

Рисует диаграмму. Диаграмма принимает дальнейшие вызовы метода только после того, как ready событие будет запущено. Extended description .

Возвращает объект действий подсказки инструментов с запрошенным actionID .

Возвращает объект, содержащий левую, верхнюю, ширину и высоту id элемента диаграммы. Формат для id еще не задокументирован (они являются возвратными значениями обработчиков событий ), но вот несколько примеров:

var cli = chart.getChartLayoutInterface();

Высота зоны графика

cli.getBoundingBox('chartarea').height

Ширина третьего бара в первой серии диаграммы бара или колонны

cli.getBoundingBox('bar#0#2').width

Ограничивающая коробка пятого клина круговой диаграммы

cli.getBoundingBox('slice#4')

Ограничивающая коробка данных диаграммы вертикальной (например, столбца) диаграммы:

cli.getBoundingBox('vAxis#0#gridline')

Ограничивающая коробка данных диаграммы горизонтальной (например, бар):

cli.getBoundingBox('hAxis#0#gridline')

Значения относительно контейнера диаграммы. Назовите это после того, как график будет нарисована.

Возвращает объект, содержащий левую, верхнюю, ширину и высоту содержания диаграммы (то есть, исключая этикетки и легенду):

var cli = chart.getChartLayoutInterface();

cli.getChartAreaBoundingBox().left

cli.getChartAreaBoundingBox().top

cli.getChartAreaBoundingBox().height

cli.getChartAreaBoundingBox().width

Значения относительно контейнера диаграммы. Назовите это после того, как график будет нарисована.

Возвращает объект, содержащий информацию о экране размещения диаграммы и его элементов.

Следующие методы можно вызвать на возвращаемый объект:

• getBoundingBox
• getChartAreaBoundingBox
• getHAxisValue
• getVAxisValue
• getXLocation
• getYLocation

Назовите это после того, как график будет нарисована.

Возвращает горизонтальное значение данных при xPosition , которое представляет собой смещение пикселя из левого края контейнера диаграммы. Может быть отрицательным.

Пример: chart.getChartLayoutInterface().getHAxisValue(400) .

Назовите это после того, как график будет нарисована.

Возвращает диаграмму, сериализованную как изображение URI.

Назовите это после того, как график будет нарисована.

Смотрите печатные диаграммы PNG .

Возвращает массив выбранных диаграмм. Выбираемые объекты - пузырьки. Для этой диаграммы можно выбрать только один объект в любой момент. Extended description .

Возвращает вертикальное значение данных при yPosition , которое представляет собой смещение пикселя вниз по верхней краю контейнера диаграммы. Может быть отрицательным.

Пример: chart.getChartLayoutInterface().getVAxisValue(300) .

Назовите это после того, как график будет нарисована.

Возвращает Pixel X-координату dataValue по сравнению с левым краем контейнера диаграммы.

Пример: chart.getChartLayoutInterface().getXLocation(400) .

Назовите это после того, как график будет нарисована.

Возвращает Pixel Y-координату dataValue по сравнению с верхним краем контейнера диаграммы.

Пример: chart.getChartLayoutInterface().getYLocation(300) .

Назовите это после того, как график будет нарисована.

Удаляет действие подсказки инструментов с помощью запрошенного actionID из диаграммы.

Устанавливает действие подсказки инструментов для выполнения, когда пользователь нажимает на текст действия.

Метод setAction принимает объект в качестве параметра действия. Этот объект должен указать 3 свойства: id - идентификатор установленного действия, text - текст, который должен отображаться в всплеске инструментов для действия, и action - функцию, которую следует запускать, когда пользователь нажимает на текст действия.

Любые действия по всплеске инструментов должны быть установлены до вызова метода draw() . Расширенное описание .

Выбирает указанные диаграммы. Отменяет любой предыдущий выбор. Выбираемые объекты - пузырьки. Для этой диаграммы можно выбрать только один объект. Extended description .

Очищает диаграмму и выпускает все его выделенные ресурсы.

Уволен, когда переходная анимация завершена.

Запускается, когда пользователь щелкнет внутри диаграммы. Можно использовать для определения того, когда нажимают заголовок, элементы данных, записи легенды, оси, сетки или метки.

Уволен, когда возникает ошибка при попытке отобрать диаграмму.

Запускается, когда пользователь нажимает стрелки Legend Pagination. Обращает обратно текущий индекс страниц на основе Legend Zero и общее количество страниц.

Уволен, когда пользователь объединяет визуальную сущность. Передает индексы строки и столбца соответствующего элемента таблицы данных. Пузырь коррелирует со строкой в ​​таблице данных (индекс столбца нулевой).

Выстрелил, когда пользователь уходит от визуальной сущности. Передает индексы строки и столбца соответствующего элемента таблицы данных. Пузырь коррелирует со строкой в ​​таблице данных (индекс столбца нулевой).

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

Уволен, когда пользователь нажимает на визуальную сущность. Чтобы узнать, что было выбрано, позвоните getSelection() .