fix: Disable cross filtering on charts with no dimensions

superset-frontend/plugins/plugin-chart-echarts/src/Bubble/index.ts

@@ -16,7 +16,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Behavior, ChartMetadata, ChartPlugin, t } from '@superset-ui/core';
+import { ChartMetadata, ChartPlugin, t } from '@superset-ui/core';
 import thumbnail from './images/thumbnail.png';
 import transformProps from './transformProps';
 import buildQuery from './buildQuery';
@@ -25,6 +25,7 @@ import example1 from './images/example1.png';
 import example2 from './images/example2.png';
 import { EchartsBubbleChartProps, EchartsBubbleFormData } from './types';
 
+// TODO: Implement cross filtering
 export default class EchartsBubbleChartPlugin extends ChartPlugin<
  EchartsBubbleFormData,
  EchartsBubbleChartProps
@@ -35,7 +36,6 @@ export default class EchartsBubbleChartPlugin extends ChartPlugin<
  controlPanel,
  loadChart: () => import('./EchartsBubble'),
  metadata: new ChartMetadata({
- behaviors: [Behavior.InteractiveChart],
  category: t('Correlation'),
  credits: ['https://echarts.apache.org'],
  description: t(

superset-frontend/plugins/plugin-chart-echarts/src/Histogram/index.ts

@@ -17,7 +17,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Behavior, ChartMetadata, ChartPlugin, t } from '@superset-ui/core';
+import { ChartMetadata, ChartPlugin, t } from '@superset-ui/core';
 import buildQuery from './buildQuery';
 import controlPanel from './controlPanel';
 import transformProps from './transformProps';
@@ -26,6 +26,7 @@ import example1 from './images/example1.png';
 import example2 from './images/example2.png';
 import { HistogramChartProps, HistogramFormData } from './types';
 
+// TODO: Implement cross filtering
 export default class EchartsHistogramChartPlugin extends ChartPlugin<
  HistogramFormData,
  HistogramChartProps
@@ -46,7 +47,6 @@ export default class EchartsHistogramChartPlugin extends ChartPlugin<
  controlPanel,
  loadChart: () => import('./Histogram'),
  metadata: new ChartMetadata({
- behaviors: [Behavior.InteractiveChart],
  credits: ['https://echarts.apache.org'],
  category: t('Distribution'),
  description: t(

superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/EchartsMixedTimeseries.tsx

@@ -110,13 +110,25 @@ export default function EchartsMixedTimeseries({
 
  const handleChange = useCallback(
  (seriesName: string, seriesIndex: number) => {
- if (!emitCrossFilters) {
+ const isFirst = isFirstQuery(seriesIndex);
+ if (
+ !emitCrossFilters ||
+ (isFirst && groupby.length === 0) ||
+ (!isFirst && groupbyB.length === 0)
+ ) {
  return;
  }
 
  setDataMask(getCrossFilterDataMask(seriesName, seriesIndex).dataMask);
  },
- [emitCrossFilters, setDataMask, getCrossFilterDataMask],
+ [
+ isFirstQuery,
+ emitCrossFilters,
+ groupby.length,
+ groupbyB.length,
+ setDataMask,
+ getCrossFilterDataMask,
+ ],
  );
 
  const eventHandlers: EventHandlers = {
@@ -140,7 +152,7 @@ export default function EchartsMixedTimeseries({
  const isFirst = isFirstQuery(seriesIndex);
  const values = [
  ...(eventParams.name ? [eventParams.name] : []),
- ...(isFirst ? labelMap : labelMapB)[eventParams.seriesName],
+ ...((isFirst ? labelMap : labelMapB)[eventParams.seriesName] || []),
  ];
  if (data && xAxis.type === AxisType.Time) {
  drillToDetailFilters.push({
@@ -179,9 +191,14 @@ export default function EchartsMixedTimeseries({
  }),
  }),
  );
+ const hasCrossFilter =
+ (isFirst && groupby.length > 0) || (!isFirst && groupbyB.length > 0);
+
  onContextMenu(pointerEvent.clientX, pointerEvent.clientY, {
  drillToDetail: drillToDetailFilters,
- crossFilter: getCrossFilterDataMask(seriesName, seriesIndex),
+ crossFilter: hasCrossFilter
+ ? getCrossFilterDataMask(seriesName, seriesIndex)
+ : undefined,
  drillBy: {
  filters: drillByFilters,
  groupbyFieldName: isFirst ? 'groupby' : 'groupby_b',

superset-frontend/plugins/plugin-chart-echarts/src/Sankey/index.ts

@@ -17,7 +17,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Behavior, ChartMetadata, ChartPlugin, t } from '@superset-ui/core';
+import { ChartMetadata, ChartPlugin, t } from '@superset-ui/core';
 import buildQuery from './buildQuery';
 import controlPanel from './controlPanel';
 import transformProps from './transformProps';
@@ -26,6 +26,7 @@ import example1 from './images/example1.png';
 import example2 from './images/example2.png';
 import { SankeyChartProps, SankeyFormData } from './types';
 
+// TODO: Implement cross filtering
 export default class EchartsSankeyChartPlugin extends ChartPlugin<
  SankeyFormData,
  SankeyChartProps
@@ -46,7 +47,6 @@ export default class EchartsSankeyChartPlugin extends ChartPlugin<
  controlPanel,
  loadChart: () => import('./Sankey'),
  metadata: new ChartMetadata({
- behaviors: [Behavior.InteractiveChart],
  credits: ['https://echarts.apache.org'],
  category: t('Flow'),
  description: t(

superset-frontend/plugins/plugin-chart-echarts/src/Sunburst/EchartsSunburst.tsx

@@ -95,7 +95,7 @@ export default function EchartsSunburst(props: SunburstTransformedProps) {
 
  const handleChange = useCallback(
  (treePathInfo: TreePathInfo[]) => {
- if (!emitCrossFilters) {
+ if (!emitCrossFilters || !columns?.length) {
  return;
  }
 
@@ -142,7 +142,9 @@ export default function EchartsSunburst(props: SunburstTransformedProps) {
  }
  onContextMenu(pointerEvent.clientX, pointerEvent.clientY, {
  drillToDetail: drillToDetailFilters,
- crossFilter: getCrossFilterDataMask(treePathInfo),
+ crossFilter: columns?.length
+ ? getCrossFilterDataMask(treePathInfo)
+ : undefined,
  drillBy: { filters: drillByFilters, groupbyFieldName: 'columns' },
  });
  }

superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/EchartsTimeseries.tsx

@@ -70,6 +70,8 @@ export default function EchartsTimeseries({
  setExtraControlHeight(updatedHeight);
  }, [formData.showExtraControls]);
 
+ const hasDimensions = ensureIsArray(groupby).length > 0;
+
  const getModelInfo = (target: ViewRootGroup, globalModel: GlobalModel) => {
  let el = target;
  let model: ComponentModel | null = null;
@@ -139,6 +141,9 @@ export default function EchartsTimeseries({
 
  const eventHandlers: EventHandlers = {
  click: props => {
+ if (!hasDimensions) {
+ return;
+ }
  if (clickTimer.current) {
  clearTimeout(clickTimer.current);
  }
@@ -215,8 +220,10 @@ export default function EchartsTimeseries({
 
  onContextMenu(pointerEvent.clientX, pointerEvent.clientY, {
  drillToDetail: drillToDetailFilters,
- crossFilter: getCrossFilterDataMask(seriesName),
  drillBy: { filters: drillByFilters, groupbyFieldName: 'groupby' },
+ crossFilter: hasDimensions
+ ? getCrossFilterDataMask(seriesName)
+ : undefined,
  });
  }
  },

superset-frontend/plugins/plugin-chart-echarts/src/Treemap/EchartsTreemap.tsx

@@ -97,7 +97,7 @@ export default function EchartsTreemap({
 
  const handleChange = useCallback(
  (data, treePathInfo) => {
- if (!emitCrossFilters) {
+ if (!emitCrossFilters || groupby.length === 0) {
  return;
  }
 
@@ -144,7 +144,10 @@ export default function EchartsTreemap({
  });
  onContextMenu(pointerEvent.clientX, pointerEvent.clientY, {
  drillToDetail: drillToDetailFilters,
- crossFilter: getCrossFilterDataMask(data, treePathInfo),
+ crossFilter:
+ groupby.length > 0
+ ? getCrossFilterDataMask(data, treePathInfo)
+ : undefined,
  drillBy: { filters: drillByFilters, groupbyFieldName: 'groupby' },
  });
  }

superset-frontend/plugins/plugin-chart-echarts/src/Waterfall/index.ts

@@ -17,7 +17,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { Behavior, ChartMetadata, ChartPlugin, t } from '@superset-ui/core';
+import { ChartMetadata, ChartPlugin, t } from '@superset-ui/core';
 import buildQuery from './buildQuery';
 import controlPanel from './controlPanel';
 import transformProps from './transformProps';
@@ -27,6 +27,7 @@ import example2 from './images/example2.png';
 import example3 from './images/example3.png';
 import { EchartsWaterfallChartProps, EchartsWaterfallFormData } from './types';
 
+// TODO: Implement cross filtering
 export default class EchartsWaterfallChartPlugin extends ChartPlugin<
  EchartsWaterfallFormData,
  EchartsWaterfallChartProps
@@ -47,7 +48,6 @@ export default class EchartsWaterfallChartPlugin extends ChartPlugin<
  controlPanel,
  loadChart: () => import('./EchartsWaterfall'),
  metadata: new ChartMetadata({
- behaviors: [Behavior.InteractiveChart],
  credits: ['https://echarts.apache.org'],
  category: t('Evolution'),
  description: t(

superset-frontend/plugins/plugin-chart-echarts/src/utils/eventHandlers.ts

@@ -26,6 +26,7 @@ import {
  getNumberFormatter,
  getTimeFormatter,
 } from '@superset-ui/core';
+import { noop } from 'lodash';
 
 import {
  BaseTransformedProps,
@@ -137,7 +138,8 @@ export const contextMenuEventHandler =
  }
  onContextMenu(pointerEvent.clientX, pointerEvent.clientY, {
  drillToDetail: drillFilters,
- crossFilter: getCrossFilterDataMask(e.name),
+ crossFilter:
+ groupby.length > 0 ? getCrossFilterDataMask(e.name) : undefined,
  drillBy: { filters: drillFilters, groupbyFieldName: 'groupby' },
  });
  }
@@ -157,11 +159,14 @@ export const allEventHandlers = (
  formData,
  } = transformedProps;
  const eventHandlers: EventHandlers = {
- click: clickEventHandler(
- getCrossFilterDataMask(selectedValues, groupby, labelMap),
- setDataMask,
- emitCrossFilters,
- ),
+ click:
+ groupby.length > 0
+ ? clickEventHandler(
+ getCrossFilterDataMask(selectedValues, groupby, labelMap),
+ setDataMask,
+ emitCrossFilters,
+ )
+ : noop,
  contextmenu: contextMenuEventHandler(
  groupby,
  onContextMenu,