imad-hl commented on code in PR #35859:
URL: https://github.com/apache/superset/pull/35859#discussion_r2589041512
##########
superset-frontend/plugins/legacy-plugin-chart-country-map/src/CountryMap.js:
##########
@@ -83,112 +106,200 @@ function CountryMap(element, props) {
.attr('width', width)
.attr('height', height)
.attr('preserveAspectRatio', 'xMidYMid meet');
- const backgroundRect = svg
- .append('rect')
- .attr('class', 'background')
- .attr('width', width)
- .attr('height', height);
+
const g = svg.append('g');
const mapLayer = g.append('g').classed('map-layer', true);
- const textLayer = g
+ const textLayer = svg
.append('g')
- .classed('text-layer', true)
+ .attr('class', 'text-layer')
.attr('transform', `translate(${width / 2}, 45)`);
- const bigText = textLayer.append('text').classed('big-text', true);
+ const bigText = textLayer
+ .append('text')
+ .classed('big-text', true)
+ .style('font-size', '18px');
const resultText = textLayer
.append('text')
.classed('result-text', true)
- .attr('dy', '1em');
-
- let centered;
-
- const clicked = function clicked(d) {
- const hasCenter = d && centered !== d;
- let x;
- let y;
- let k;
- const halfWidth = width / 2;
- const halfHeight = height / 2;
-
- if (hasCenter) {
- const centroid = path.centroid(d);
- [x, y] = centroid;
- k = 4;
- centered = d;
- } else {
- x = halfWidth;
- y = halfHeight;
- k = 1;
- centered = null;
- }
+ .attr('dy', '1em')
+ .style('font-size', '26px');
+
+ // Cross-filter support
+ const getCrossFilterDataMask = source => {
+ const selected = filterState.selectedValues || [];
+ const iso = source?.properties?.ISO;
+ if (!iso) return undefined;
- g.transition()
- .duration(750)
- .attr(
- 'transform',
-
`translate(${halfWidth},${halfHeight})scale(${k})translate(${-x},${-y})`,
- );
- textLayer
- .style('opacity', 0)
- .attr(
- 'transform',
- `translate(0,0)translate(${x},${hasCenter ? y - 5 : 45})`,
- )
- .transition()
- .duration(750)
- .style('opacity', 1);
- bigText
- .transition()
- .duration(750)
- .style('font-size', hasCenter ? 6 : 16);
- resultText
- .transition()
- .duration(750)
- .style('font-size', hasCenter ? 16 : 24);
+ const isSelected = selected.includes(iso);
+ const values = isSelected ? [] : [iso];
+
+ return {
+ dataMask: {
+ extraFormData: {
+ filters: values.length
+ ? [{ col: entity, op: 'IN', val: values }]
+ : [],
+ },
+ filterState: {
+ value: values.length ? values : null,
+ selectedValues: values.length ? values : null,
+ },
+ },
+ isCurrentValueSelected: isSelected,
+ };
};
- backgroundRect.on('click', clicked);
+ // Handle right-click context menu
+ const handleContextMenu = feature => {
+ const pointerEvent = d3.event;
+
+ // Only prevent default if we have a context menu handler
+ if (typeof onContextMenu === 'function') {
+ pointerEvent?.preventDefault();
+ }
+
+ const iso = feature?.properties?.ISO;
+ if (!iso || typeof onContextMenu !== 'function') return;
+
+ const drillVal = iso;
+ const drillToDetailFilters = [
+ { col: entity, op: '==', val: drillVal, formattedVal: drillVal },
+ ];
+ const drillByFilters = [{ col: entity, op: '==', val: drillVal }];
- const selectAndDisplayNameOfRegion = function selectAndDisplayNameOfRegion(
- feature,
- ) {
+ onContextMenu(pointerEvent.clientX, pointerEvent.clientY, {
+ drillToDetail: drillToDetailFilters,
+ crossFilter: getCrossFilterDataMask(feature),
+ drillBy: { filters: drillByFilters, groupbyFieldName: 'entity' },
Review Comment:
Fixed in 9651b63 : replaced the hardcoded string 'entity' with the actual
`entity` prop
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
