Vega - отключить всплывающие подсказки для нулевых значений - PullRequest
Новая
       16

Vega - отключить всплывающие подсказки для нулевых значений

0 голосов
/ 19 марта 2019

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

Вот мой код. У меня была неудачная попытка удалить метку, которая является источником метки всплывающих подсказок, с помощью клавиши defined. 

'signals': [
      {
        'name': 'interpolate', 'value': 'monotone'
      },
      {
        'name': 'hover',
        'value': null,
        'on': [
          { 'events': '@voronoi_lines:mouseover', 'update': 'datum' },
          { 'events': '@noronoi_lines:mouseout', 'update': 'null' }
        ]
      }
    ],
...
'marks': [
    {
        'name': 'data_points',
        'description': 'Adds the data points which are used to position the visual indicator',
        'from': { 'data': 'annualSales' },
        'type': 'symbol',
        'encode': {
          'update': {
             // this I added hoping to remove any null values, nothing happened
            'defined': { 'signal': 'datum.expected_sales !== null || datum.actual_sales !== null || datum.difference !== null' },

            'fill': { 'value': 'transparent' },
            'size': { 'value': 10 },
            'stroke': { 'value': 'transparent' },
            'x': { 'scale': 'x', 'field': 'week_start' },
            'y': { 'value': 0 }
          }
        }
      },
      {
        'name': 'voronoi_lines',
        'description': 'The voronoi cells automatically selects the nearest data point to the mouse cursor ',
        'type': 'path',
        'from': { 'data': 'data_points' },
        'zindex': 101,
        'encode': {
          'enter': {
            'tooltip': {
              'signal': 'Expected sales': format(datum.datum.expected_sales, '.2f'), 'Actual sales': format(datum.datum.actual_sales, '.2f')}`
            }
          },
          'update': {
            'defined': { 'signal': 'datum.datum.expected_values !== null || datum.datum.actual_sales !== null' },
            'fill': { 'value': 'transparent' },
            'strokeWidth': { 'value': 1 },
            'stroke': { 'value': 'transparent' }
          }
        },
        'transform': [
          {
            'type': 'voronoi',
            'x': 'datum.x',
            'y': 'datum.y',
            'size': [{ 'signal': 'width' }, { 'signal': 'height' }]
          }
        ]
      }
  ]
...

Затем я отображаю график так: 

 const handler = new Handler();
  this.view = new View(parse(spec))
    .renderer('svg')
    .initialize(this.$refs.vis)
    .tooltip(handler.call)
    .run();

Даже если я попытался отфильтровать значения null с помощью defined ... signal или даже 'config': { 'invalidValues': 'filter' },, эти попытки не привели к удалению всплывающих подсказок, когда значения равны нулю, но чтобы заставить их показать 0.0.

Я просто хочу, чтобы подсказки вообще не отображались. Итак, есть предложения?

...