Как DataTips работают во Flex-графике?

Подсказки в диаграммах Flex являются плохо документированной и мало понятной функцией.

Есть три части:

  • DataTip, по умолчанию ящик с текстом внутри
  • DataTipTarget, по умолчанию окружение бычьего глаза над точкой ряда
  • Выноска, строка из dataTipTarget в поле DataTip

Как эти три элемента созданы / нарисованы и как их можно настроить?

Смотрите также мой ответ о том, как правильно настроить отображение DataTipTargets и строк выноски.

Источник

1 ответ

Решение

Оказывается, что dataTipRenderer стиль из ChartBase класс по умолчанию DataTip,

DataTip является IDataRenderer и, следовательно, может выступать в качестве рендерера. Однако метод DataTip.updateDisplayList(w,h) не рисует круг в точке данных. Он рисует прямоугольник с HTML-текстом внутри.

Так что же тогда привлекает неуловимые глаза быков?

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

Моя версия SDK - 4.1.0.

Код, который визуализирует точку данных круга при наведении курсора, которая является значением по умолчанию, является не средством визуализации, как мы думали, а фактически функцией внутри mx.charts.chartClasses.ChartBase класс, строка 3873:

/**
 *  Defines the locations of DataTip objects on the chart.
 *  This method ensures that DataTip objects do not overlap each other
 *  (if multiple DataTip objects are visible) or overlap their target data items.
 *  
 *  @langversion 3.0
 *  @playerversion Flash 9
 *  @playerversion AIR 1.1
 *  @productversion Flex 3
 */
protected function positionDataTips():void

Там похожая функция positionAllDataTips() в том же классе.

Существует простой логический стиль на ChartBase, showDataTipTargets, что при значении false отключит рисование круга на линии при зависании.

Цели данных всплывают в positionDataTips() функция ChartBase (начиная со строки 4204).

Однажды я понял, что showDataTipTargets С этим связано, я смог ответить еще на один вопрос. Там вы можете найти подробное объяснение того, как настроить DataTipTarget

ChartBase логическое свойство, showDataTips, включает только рендеринг ящиков с подсказками. Они отображаются с использованием стиля dataTipRenderer и текст поля подсказки данных создается с использованием свойства dataTipFunction,

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

  • ChartBase.getStyle("showDataTipTargets"):Boolean переключит видимость круга по умолчанию, который отображается при наведении курсора на точку.
    • Чтобы действительно внести изменения в отображение целей DataTip, необходимо переопределить / изменить способ их рисования в ChartBase.positionDataTips() функция
  • Окна DataTip обрабатываются отдельно
    • ChartBase.showDataTips:Boolean переключит видимость DataTips и DataTip Targets для всей диаграммы
    • ChartBase.getStyle("dataTipRenderer"):Class будет обрабатывать только графическую визуализацию окна DataTip.
    • dataTipRenderer будет использовать строку, возвращенную ChartBase.dataTipFunction:Function для отображения данных.
    • Соглашение, которому следует следовать:
      • Обычай dataTipRenderer должен обрабатывать графику / рисунок подсказки
      • Обычай dataTipFunction должен обрабатывать форматирование текста данных для данной точки
  • Линия выноски, которая является дополнительной линией, проведенной из поля DataTipTarget в поле DataTip, может быть включена и настроена путем настройки ChartBase.getStyle(“dataTipCalloutStroke”):IStroke,
Источник
Другие вопросы по тегам