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

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

1 голос
/ 13 февраля 2012

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

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

  • Подсказка, по умолчанию это поле с текстом внутри
  • объект DataTipTarget, по умолчанию окружение быка над точкой 'серии
  • выноска, линия от dataTipTarget до поля DataTip

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

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

1 Ответ

4 голосов
/ 14 февраля 2012

Оказывается, стиль 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, включает отображение только BOXES подсказок данных. Они отображаются в стиле dataTipRenderer, а текст поля подсказки данных создается с использованием свойства dataTipFunction.

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

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