Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Tooltip for Line not using the provided DataRecord #399

Open
ghost opened this issue Jun 8, 2024 · 3 comments
Open

Tooltip for Line not using the provided DataRecord #399

ghost opened this issue Jun 8, 2024 · 3 comments

Comments

@ghost
Copy link

ghost commented Jun 8, 2024

As by the documentation, you can define a Tooltip onto a line like so:

<script setup lang="ts">
import { VisXYContainer, VisTooltip } from '@unovis/vue'

const props = defineProps<{ data: DataRecord[] }>()
const triggers = {
    [StackedBar.selectors.bar]: (d: DataRecord) => `Bar`,
    [Line.selectors.line]: (d: DataRecord) => `Line`,
  }
</script>

<template>
  <VisTooltip :triggers="triggers" />
</template>

This suggests that the Line.selectors.line uses the provided DataRecord.
However that does not seem to be the case, assume the DataRecord is typed as the following:

type DataRecord = { date: Date, votes: number }

The expected data from the line selector would then be {date: <some_date>, votes: <some_number>}.
But the actual data is in the form of {x: <some_number>, y: <some_number>}.
This seems to be either a bug or the documentation has an error in it.

Note: The data for the StackedBar is correct i.e. on the form of {date: <some_date>, votes: <some_number>}.

Versions:

"@unovis/ts": "^1.4.1"
"@unovis/vue": "^1.4.1"
@ghost ghost changed the title Tooltip for Line not using the provided DataRecord Tooltip for Line not using the provided DataRecord - Vue Jun 10, 2024
@ghost ghost changed the title Tooltip for Line not using the provided DataRecord - Vue Tooltip for Line not using the provided DataRecord Jun 10, 2024
@zernonia
Copy link
Contributor

zernonia commented Jun 14, 2024

Thanks for the issue @samuelhafsteinsson . It seems like the (d: DataRecord) is indeed wrong for the case of [Line.selectors.line]. Here's a reproduction showcasing that both callback return different value

Edit: Also checked Area component with the tooltip, seems like it return all the data, instead of d: DataRecord

@rokotyan
Copy link
Contributor

@samuelhafsteinsson Thanks for pointing this out, we'll have to make a correction in our docs. However, the behavior is correct because the line is represented by the entire data array, not a single element.

If you want to have a tooltip for a single element, you can combine it with Crosshair https://unovis.dev/docs/auxiliary/Crosshair#adding-a-tooltip

@ghost
Copy link
Author

ghost commented Jun 18, 2024

@samuelhafsteinsson Thanks for pointing this out, we'll have to make a correction in our docs. However, the behavior is correct because the line is represented by the entire data array, not a single element.

If you want to have a tooltip for a single element, you can combine it with Crosshair https://unovis.dev/docs/auxiliary/Crosshair#adding-a-tooltip

I figured, did exactly that and worked well, thank you

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants