GitHub user dosubot[bot] added a comment to the discussion: trendline issues from bignumber chart
<!-- Greeting --> Hello @SaiChaitanya06! I'm [Dosu](https://dosu.dev), here to help you with any bugs, questions, or guidance you might need while waiting for a human maintainer. Let's tackle this issue together! <!-- Answer --> To display the sum of values as a bignumber and each individual value over the trendline in Superset, you can use the `BigNumberWithTrendline` visualization. This visualization allows you to render a bignumber along with a trendline, and it can be configured to display individual values over the trendline. Here's a basic setup using the `SuperChart` component from the `@superset-ui/core` package: ```jsx import { SuperChart } from '@superset-ui/core'; import { BigNumberChartPlugin } from '@superset-ui/plugin-chart-echarts'; import testData from './data'; new BigNumberChartPlugin().configure({ key: 'big-number' }).register(); const formData = { colorPicker: { r: 0, g: 122, b: 135, a: 1, }, compareLag: 1, compareSuffix: 'over 10Y', metric: 'sum__SP_POP_TOTL', showTrendLine: true, startYAxisAtZero: true, timeGrainSqla: 'P1Y', vizType: 'big-number', yAxisFormat: '.3s', }; export const basicWithTrendline = () => ( <SuperChart chartType="big-number" width={400} height={400} queriesData={[{ data: testData }]} formData={formData} /> ); ``` Ensure that `queriesData` contains the individual values you want to display over the trendline, and `formData.metric` is set to the sum of those values. Adjust the `formData` properties such as `colorPicker`, `compareLag`, and `yAxisFormat` to customize the appearance of the trendline and bignumber <sup>[[1]](https://github.com/apache/superset/blob/master/superset-frontend/plugins/plugin-chart-echarts/src/BigNumber/BigNumberViz.tsx)</sup><sup>[[2]](https://github.com/apache/superset/blob/master/superset-frontend/plugins/plugin-chart-echarts/src/BigNumber/BigNumberWithTrendline/transformProps.test.ts)</sup><sup>[[3]](https://github.com/apache/superset/blob/master/superset-frontend/packages/superset-ui-demo/storybook/stories/plugins/legacy-preset-chart-big-number/BigNumber/BigNumber.stories.tsx)</sup><sup>[[4]](https://github.com/apache/superset/blob/master/superset-frontend/plugins/plugin-chart-echarts/src/BigNumber/BigNumberWithTrendline/transformProps.ts)</sup>. <!-- Dosu Comment Footer --> *To continue talking to [Dosu](https://dosu.dev), mention @dosu.* --- <sup>Help Dosu learn! Give it feedback: [Great Response](https://app.dosu.dev/response-feedback/f7f26fea-f0d6-4e6f-b1ec-43b4df076418?feedback_type=great_response) | [Irrelevant Answer](https://app.dosu.dev/response-feedback/f7f26fea-f0d6-4e6f-b1ec-43b4df076418?feedback_type=irrelevant_answer) | [Incorrect Sources](https://app.dosu.dev/response-feedback/f7f26fea-f0d6-4e6f-b1ec-43b4df076418?feedback_type=incorrect_sources) | [Too Verbose](https://app.dosu.dev/response-feedback/f7f26fea-f0d6-4e6f-b1ec-43b4df076418?feedback_type=too_verbose) | [Hallucination](https://app.dosu.dev/response-feedback/f7f26fea-f0d6-4e6f-b1ec-43b4df076418?feedback_type=hallucination) | [Bug Report](https://app.dosu.dev/response-feedback/f7f26fea-f0d6-4e6f-b1ec-43b4df076418?feedback_type=bug_report) | [Other](https://app.dosu.dev/response-feedback/f7f26fea-f0d6-4e6f-b1ec-43b4df076418?feedback_type=other)</sup> GitHub link: https://github.com/apache/superset/discussions/33546#discussioncomment-13216245 ---- This is an automatically sent email for [email protected]. To unsubscribe, please send an email to: [email protected] --------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
