@undp/data-viz 1.4.2 → 1.4.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/GriddedGraphs.d.ts +4 -7
- package/dist/GriddedGraphsFromConfig.d.ts +4 -7
- package/dist/MultiGraphDashboard.d.ts +4 -7
- package/dist/MultiGraphDashboardFromConfig.d.ts +4 -7
- package/dist/PerformanceIntensiveMultiGraphDashboard.d.ts +4 -7
- package/dist/PerformanceIntensiveMultiGraphDashboardFromConfig.d.ts +4 -7
- package/dist/PerformanceIntensiveScrollStory.d.ts +4 -7
- package/dist/ScrollStory.d.ts +4 -7
- package/dist/SingleGraphDashboard.d.ts +4 -7
- package/dist/SingleGraphDashboardFromConfig.d.ts +4 -7
- package/dist/SingleGraphDashboardGeoHubMaps.d.ts +4 -7
- package/dist/SingleGraphDashboardGeoHubMapsFromConfig.d.ts +4 -7
- package/dist/SingleGraphDashboardThreeDGraphs.cjs +1 -1
- package/dist/SingleGraphDashboardThreeDGraphs.cjs.map +1 -1
- package/dist/SingleGraphDashboardThreeDGraphs.d.ts +4 -7
- package/dist/SingleGraphDashboardThreeDGraphs.js +28 -25
- package/dist/SingleGraphDashboardThreeDGraphs.js.map +1 -1
- package/dist/SingleGraphDashboardThreeDGraphsFromConfig.d.ts +4 -7
- package/dist/ThreeDGlobe.cjs +1 -1
- package/dist/ThreeDGlobe.cjs.map +1 -1
- package/dist/ThreeDGlobe.d.ts +11 -2
- package/dist/ThreeDGlobe.js +278 -253
- package/dist/ThreeDGlobe.js.map +1 -1
- package/dist/Types.d.ts +4 -7
- package/dist/index.d.ts +15 -9
- package/package.json +1 -1
package/dist/ThreeDGlobe.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ThreeDGlobe.js","sources":["../src/Components/Graphs/Maps/ThreeDGlobe/Graph.tsx","../src/Components/Graphs/Maps/ThreeDGlobe/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\r\nimport Globe, { GlobeMethods } from 'react-globe.gl';\r\nimport isEqual from 'fast-deep-equal';\r\nimport { useEffect, useRef, useState } from 'react';\r\nimport { scaleOrdinal, scaleThreshold } from 'd3-scale';\r\nimport * as THREE from 'three';\r\nimport { Modal } from '@undp/design-system-react/Modal';\r\nimport { P } from '@undp/design-system-react/Typography';\r\n\r\nimport { ChoroplethMapDataType, ClassNameObject, StyleObject } from '@/Types';\r\nimport { Tooltip } from '@/Components/Elements/Tooltip';\r\nimport { numberFormattingFunction } from '@/Utils/numberFormattingFunction';\r\nimport { X } from '@/Components/Icons';\r\nimport { string2HTML } from '@/Utils/string2HTML';\r\n\r\ninterface Props {\r\n width: number;\r\n data: ChoroplethMapDataType[];\r\n autoRotate: number;\r\n enableZoom: boolean;\r\n categorical: boolean;\r\n colorDomain: number[] | string[];\r\n colors: string[];\r\n height: number;\r\n globeMaterial?: THREE.MeshPhongMaterialProperties;\r\n polygonData: any;\r\n mapProperty: string;\r\n mapBorderColor: string;\r\n atmosphereColor: string;\r\n tooltip?: string | ((_d: any) => React.ReactNode);\r\n styles?: StyleObject;\r\n classNames?: ClassNameObject;\r\n onSeriesMouseOver?: (_d: any) => void;\r\n onSeriesMouseClick?: (_d: any) => void;\r\n mapNoDataColor: string;\r\n centerPoint: [number, number];\r\n colorLegendTitle?: string;\r\n showColorScale: boolean;\r\n hoverStrokeColor: string;\r\n detailsOnClick?: string | ((_d: any) => React.ReactNode);\r\n resetSelectionOnDoubleClick: boolean;\r\n highlightedIds: string[];\r\n scale: number;\r\n globeOffset: [number, number];\r\n polygonAltitude: number;\r\n centerLng: number;\r\n centerLat: number;\r\n}\r\n\r\nfunction Graph(props: Props) {\r\n const {\r\n width,\r\n autoRotate,\r\n data,\r\n enableZoom,\r\n categorical,\r\n colorDomain,\r\n colors,\r\n globeMaterial,\r\n height,\r\n polygonData,\r\n mapProperty,\r\n mapBorderColor,\r\n atmosphereColor,\r\n tooltip,\r\n styles,\r\n classNames,\r\n mapNoDataColor,\r\n centerPoint,\r\n colorLegendTitle,\r\n showColorScale,\r\n hoverStrokeColor,\r\n detailsOnClick,\r\n onSeriesMouseClick,\r\n onSeriesMouseOver,\r\n resetSelectionOnDoubleClick,\r\n highlightedIds,\r\n scale,\r\n globeOffset,\r\n polygonAltitude,\r\n centerLng,\r\n centerLat,\r\n } = props;\r\n const globeEl = useRef<GlobeMethods | undefined>(undefined);\r\n const [mouseClickData, setMouseClickData] = useState<any>(undefined);\r\n const [showLegend, setShowLegend] = useState(!(width < 680));\r\n const [mousePos, setMousePos] = useState({ x: 0, y: 0 });\r\n const [mouseOverData, setMouseOverData] = useState<ChoroplethMapDataType | undefined>(undefined);\r\n const colorScale = categorical\r\n ? scaleOrdinal<number | string, string>().domain(colorDomain).range(colors)\r\n : scaleThreshold<number, string>()\r\n .domain(colorDomain as number[])\r\n .range(colors);\r\n useEffect(() => {\r\n if (globeEl?.current) {\r\n globeEl.current.controls().autoRotate = autoRotate === 0 ? false : true;\r\n globeEl.current.controls().enableZoom = enableZoom;\r\n globeEl.current.controls().autoRotateSpeed = autoRotate;\r\n }\r\n }, [autoRotate, enableZoom]);\r\n useEffect(() => {\r\n if (globeEl.current) {\r\n if (mouseOverData) {\r\n globeEl.current.controls().autoRotate = false;\r\n } else {\r\n globeEl.current.controls().autoRotate = autoRotate === 0 ? false : true;\r\n }\r\n }\r\n }, [mouseOverData, autoRotate]);\r\n\r\n useEffect(() => {\r\n const canvas = globeEl.current?.renderer().domElement;\r\n if (!canvas) return;\r\n\r\n const handleMouseMove = (e: MouseEvent) => {\r\n setMousePos({ x: e.clientX, y: e.clientY });\r\n };\r\n\r\n canvas.addEventListener('mousemove', handleMouseMove);\r\n return () => canvas.removeEventListener('mousemove', handleMouseMove);\r\n }, []);\r\n\r\n useEffect(() => {\r\n if (globeEl.current) {\r\n globeEl.current.pointOfView({ lat: centerLat, lng: centerLng, altitude: scale }, 1000);\r\n }\r\n }, [scale, centerLng, centerLat]);\r\n const materials = new THREE.MeshLambertMaterial({\r\n color: '#fff',\r\n opacity: 1,\r\n transparent: false,\r\n ...(globeMaterial || {}),\r\n });\r\n return (\r\n <div className='relative'>\r\n <Globe\r\n ref={globeEl}\r\n width={width}\r\n height={height}\r\n globeOffset={globeOffset}\r\n lineHoverPrecision={0}\r\n polygonsData={polygonData}\r\n polygonAltitude={(polygon: any) =>\r\n highlightedIds.includes(polygon?.properties?.[mapProperty])\r\n ? 0.1\r\n : polygon?.properties?.[mapProperty] === mouseOverData?.id\r\n ? 0.01\r\n : polygonAltitude\r\n }\r\n polygonCapColor={(polygon: any) => {\r\n const id = polygon?.properties?.[mapProperty];\r\n const val = data.find(el => el.id === id)?.x;\r\n if (val !== undefined && val !== null) {\r\n return colorScale(val as any);\r\n }\r\n return mapNoDataColor;\r\n }}\r\n polygonSideColor={(polygon: any) => {\r\n const id = polygon?.properties?.[mapProperty];\r\n const val = data.find(el => el.id === id)?.x;\r\n const color = val !== undefined && val !== null ? colorScale(val as any) : mapNoDataColor;\r\n return highlightedIds.includes(polygon?.properties?.[mapProperty])\r\n ? color\r\n : 'rgba(100,100,100,0)';\r\n }}\r\n polygonStrokeColor={(polygon: any) =>\r\n polygon?.properties?.[mapProperty] === mouseOverData?.id\r\n ? hoverStrokeColor\r\n : mapBorderColor\r\n }\r\n onPolygonClick={(polygon: any) => {\r\n const clickedData = polygon?.properties?.[mapProperty]\r\n ? data.find(el => el.id === polygon?.properties?.[mapProperty])\r\n : undefined;\r\n if (onSeriesMouseClick || detailsOnClick) {\r\n if (\r\n isEqual(mouseClickData, clickedData) &&\r\n resetSelectionOnDoubleClick &&\r\n clickedData\r\n ) {\r\n setMouseClickData(undefined);\r\n onSeriesMouseClick?.(undefined);\r\n } else {\r\n setMouseClickData(clickedData);\r\n onSeriesMouseClick?.(clickedData);\r\n }\r\n }\r\n setMouseClickData(clickedData);\r\n onSeriesMouseClick?.(clickedData);\r\n }}\r\n onPolygonHover={(polygon: any) => {\r\n const hoverData = polygon?.properties?.[mapProperty]\r\n ? data.find(el => el.id === polygon?.properties?.[mapProperty])\r\n : undefined;\r\n setMouseOverData(hoverData);\r\n onSeriesMouseOver?.(hoverData);\r\n }}\r\n atmosphereColor={atmosphereColor}\r\n globeMaterial={materials}\r\n backgroundColor='rgba(0, 0, 0, 0)'\r\n polygonsTransitionDuration={100}\r\n onGlobeReady={() => {\r\n if (globeEl.current) {\r\n globeEl.current.pointOfView({\r\n lat: centerPoint[0],\r\n lng: centerPoint[1],\r\n });\r\n }\r\n }}\r\n />\r\n {showColorScale === false ? null : (\r\n <div className='absolute left-4 bottom-4'>\r\n {showLegend ? (\r\n <>\r\n <div\r\n style={{\r\n backgroundColor: 'rgba(240,240,240, 0.7)',\r\n border: '1px solid var(--gray-400)',\r\n borderRadius: '999px',\r\n width: '24px',\r\n height: '24px',\r\n padding: '3px',\r\n cursor: 'pointer',\r\n zIndex: 10,\r\n position: 'absolute',\r\n right: '-0.75rem',\r\n top: '-0.75rem',\r\n }}\r\n onClick={() => {\r\n setShowLegend(false);\r\n }}\r\n >\r\n <X />\r\n </div>\r\n <div\r\n className='p-2'\r\n style={{\r\n backgroundColor: 'rgba(240,240,240, 0.7)',\r\n width: categorical ? undefined : '340px',\r\n }}\r\n >\r\n {colorLegendTitle && colorLegendTitle !== '' ? (\r\n <P\r\n size='xs'\r\n marginBottom='xs'\r\n className='p-0 leading-normal overflow-hidden text-primary-gray-700 dark:text-primary-gray-300'\r\n style={{\r\n display: '-webkit-box',\r\n WebkitLineClamp: '1',\r\n WebkitBoxOrient: 'vertical',\r\n }}\r\n >\r\n {colorLegendTitle}\r\n </P>\r\n ) : null}\r\n {!categorical ? (\r\n <svg width='100%' viewBox='0 0 320 30' direction='ltr'>\r\n <g>\r\n {colorDomain.map((d, i) => (\r\n <g key={i} className='cursor-pointer'>\r\n <rect\r\n x={(i * 320) / colors.length + 1}\r\n y={1}\r\n width={320 / colors.length - 2}\r\n height={8}\r\n style={{\r\n fill: colors[i],\r\n stroke: colors[i],\r\n }}\r\n />\r\n <text\r\n x={((i + 1) * 320) / colors.length}\r\n y={25}\r\n className='fill-primary-gray-700 dark:fill-primary-gray-300 text-xs'\r\n style={{ textAnchor: 'middle' }}\r\n >\r\n {numberFormattingFunction(d as number, 'NA')}\r\n </text>\r\n </g>\r\n ))}\r\n <g>\r\n <rect\r\n x={(colorDomain.length * 320) / colors.length + 1}\r\n y={1}\r\n width={320 / colors.length - 2}\r\n height={8}\r\n style={{\r\n fill: colors[colorDomain.length],\r\n stroke: colors[colorDomain.length],\r\n }}\r\n />\r\n </g>\r\n </g>\r\n </svg>\r\n ) : (\r\n <div className='flex flex-col gap-3'>\r\n {colorDomain.map((d, i) => (\r\n <div key={i} className='flex gap-2 items-center'>\r\n <div\r\n className='w-2 h-2 rounded-full'\r\n style={{ backgroundColor: colors[i % colors.length] }}\r\n />\r\n <P size='sm' marginBottom='none' leading='none'>\r\n {d}\r\n </P>\r\n </div>\r\n ))}\r\n </div>\r\n )}\r\n </div>\r\n </>\r\n ) : (\r\n <button\r\n type='button'\r\n className='mb-0 border-0 bg-transparent p-0 self-start'\r\n onClick={() => {\r\n setShowLegend(true);\r\n }}\r\n >\r\n <div className='items-start text-sm font-medium cursor-pointer p-2 mb-0 flex text-primary-black dark:text-primary-gray-300 bg-primary-gray-300 dark:bg-primary-gray-550 border-primary-gray-400 dark:border-primary-gray-500'>\r\n Show Legend\r\n </div>\r\n </button>\r\n )}\r\n </div>\r\n )}\r\n {mouseOverData && tooltip ? (\r\n <Tooltip\r\n data={mouseOverData}\r\n body={tooltip}\r\n xPos={mousePos.x}\r\n yPos={mousePos.y}\r\n backgroundStyle={styles?.tooltip}\r\n className={classNames?.tooltip}\r\n />\r\n ) : null}\r\n {detailsOnClick && mouseClickData !== undefined ? (\r\n <Modal\r\n open={mouseClickData !== undefined}\r\n onClose={() => {\r\n setMouseClickData(undefined);\r\n }}\r\n >\r\n <div\r\n className='graph-modal-content m-0'\r\n dangerouslySetInnerHTML={\r\n typeof detailsOnClick === 'string'\r\n ? { __html: string2HTML(detailsOnClick, mouseClickData) }\r\n : undefined\r\n }\r\n >\r\n {typeof detailsOnClick === 'function' ? detailsOnClick(mouseClickData) : null}\r\n </div>\r\n </Modal>\r\n ) : null}\r\n </div>\r\n );\r\n}\r\n\r\nexport default Graph;\r\n","import React, { useEffect, useRef, useState } from 'react';\r\nimport { Spinner } from '@undp/design-system-react/Spinner';\r\nimport * as THREE from 'three';\r\nimport { cn } from '@undp/design-system-react/cn';\r\n\r\nimport Graph from './Graph';\r\n\r\nimport { GraphHeader } from '@/Components/Elements/GraphHeader';\r\nimport { GraphFooter } from '@/Components/Elements/GraphFooter';\r\nimport {\r\n ChoroplethMapDataType,\r\n ClassNameObject,\r\n Languages,\r\n ScaleDataType,\r\n SourcesDataType,\r\n StyleObject,\r\n} from '@/Types';\r\nimport { fetchAndParseJSON } from '@/Utils/fetchAndParseData';\r\nimport { Colors } from '@/Components/ColorPalette';\r\nimport { getUniqValue } from '@/Utils/getUniqValue';\r\nimport { getJenks } from '@/Utils/getJenks';\r\n\r\ninterface Props {\r\n // Data\r\n /** Array of data objects */\r\n data: ChoroplethMapDataType[];\r\n\r\n // Titles, Labels, and Sources\r\n /** Title of the graph */\r\n graphTitle?: string | React.ReactNode;\r\n /** Description of the graph */\r\n graphDescription?: string | React.ReactNode;\r\n /** Footnote for the graph */\r\n footNote?: string | React.ReactNode;\r\n /** Source data for the graph */\r\n sources?: SourcesDataType[];\r\n /** Accessibility label */\r\n ariaLabel?: string;\r\n\r\n // Colors and Styling\r\n /** Colors for the choropleth map */\r\n colors?: string[];\r\n /** Domain of colors for the graph */\r\n colorDomain?: number[] | string[];\r\n /** Title for the color legend */\r\n colorLegendTitle?: string;\r\n /** Color for the areas where data is no available */\r\n mapNoDataColor?: string;\r\n /** Background color of the graph */\r\n backgroundColor?: string | boolean;\r\n /** Custom styles for the graph. Each object should be a valid React CSS style object. */\r\n styles?: StyleObject;\r\n /** Custom class names */\r\n classNames?: ClassNameObject;\r\n\r\n // Size and Spacing\r\n /** Width of the graph */\r\n width?: number;\r\n /** Height of the graph */\r\n height?: number;\r\n /** Minimum height of the graph */\r\n minHeight?: number;\r\n /** Relative height scaling factor. This overwrites the height props */\r\n relativeHeight?: number;\r\n /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */\r\n padding?: string;\r\n\r\n // Graph Parameters\r\n /** Map data as an object in geoJson format or a url for geoJson */\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n mapData?: any;\r\n /** Stroke color of the regions in the map */\r\n mapBorderColor?: string;\r\n /** Center point of the map */\r\n centerPoint?: [number, number];\r\n /** Defines if the globe rotates automatically */\r\n autoRotate?: number | boolean;\r\n /** Defines the material property applied to the sphere of the globe */\r\n globeMaterial?: THREE.MeshPhongMaterialProperties;\r\n /** Defines the colo of the glow around the globe */\r\n atmosphereColor?: string;\r\n /** Defines if the globe can be zoomed when scrolled */\r\n enableZoom?: boolean;\r\n /** Position offset of the globe relative to the canvas center */\r\n globeOffset?: [number, number];\r\n /** Defines the camera distance from Earth. This helps in defining the default size of the globe. Smaller = closer camera therefore the globe is bigger) */\r\n scale?: number;\r\n /** Defines the spacing between the country shape polygon with the sphere */\r\n polygonAltitude?: number;\r\n /** Scale for the colors */\r\n scaleType?: Exclude<ScaleDataType, 'linear'>;\r\n /** Toggles if the color scaling is categorical or not */\r\n categorical?: boolean;\r\n /** Toggle visibility of color scale. */\r\n showColorScale?: boolean;\r\n /** Property in the property object in mapData geoJson object is used to match to the id in the data object */\r\n mapProperty?: string;\r\n /** Countries or regions to be highlighted */\r\n highlightedIds?: string[];\r\n /** Enable data download option as a csv */\r\n dataDownload?: boolean;\r\n /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */\r\n resetSelectionOnDoubleClick?: boolean;\r\n\r\n // Interactions and Callbacks\r\n /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n tooltip?: string | ((_d: any) => React.ReactNode);\r\n /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n detailsOnClick?: string | ((_d: any) => React.ReactNode);\r\n /** Callback for mouse over event */\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n onSeriesMouseOver?: (_d: any) => void;\r\n /** Callback for mouse click event */\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n onSeriesMouseClick?: (_d: any) => void;\r\n\r\n // Configuration and Options\r\n /** Language setting */\r\n language?: Languages;\r\n /** Color theme */\r\n theme?: 'light' | 'dark';\r\n /** Unique ID for the graph */\r\n graphID?: string;\r\n}\r\n\r\n/** For using these maps you will have to install [`three`](https://threejs.org/manual/) and [react-globe.gl](https://www.npmjs.com/package/react-globe.gl) package to your project */\r\nexport function ThreeDGlobe(props: Props) {\r\n const {\r\n data,\r\n mapData = 'https://raw.githubusercontent.com/UNDP-Data/dv-country-geojson/refs/heads/main/worldMap-simplified.json',\r\n graphTitle,\r\n colors,\r\n sources,\r\n graphDescription,\r\n height,\r\n width,\r\n footNote = 'The designations employed and the presentation of material on this map do not imply the expression of any opinion whatsoever on the part of the Secretariat of the United Nations or UNDP concerning the legal status of any country, territory, city or area or its authorities, or concerning the delimitation of its frontiers or boundaries.',\r\n colorDomain,\r\n colorLegendTitle,\r\n scaleType = 'threshold',\r\n padding,\r\n mapNoDataColor = Colors.light.graphNoData,\r\n backgroundColor = false,\r\n mapBorderColor = Colors.light.grays['gray-500'],\r\n relativeHeight,\r\n tooltip,\r\n graphID,\r\n mapProperty = 'ISO3',\r\n dataDownload = false,\r\n language = 'en',\r\n minHeight = 0,\r\n theme = 'light',\r\n ariaLabel,\r\n styles,\r\n classNames,\r\n autoRotate = true,\r\n enableZoom = true,\r\n globeMaterial,\r\n centerPoint = [0, 0],\r\n atmosphereColor = '#999',\r\n showColorScale = true,\r\n resetSelectionOnDoubleClick = true,\r\n detailsOnClick,\r\n onSeriesMouseOver,\r\n onSeriesMouseClick,\r\n highlightedIds = [],\r\n scale = 1,\r\n globeOffset = [0, 0],\r\n polygonAltitude = 0.01,\r\n } = props;\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n const [mapShape, setMapShape] = useState<any>(undefined);\r\n\r\n const [svgWidth, setSvgWidth] = useState(0);\r\n const [svgHeight, setSvgHeight] = useState(0);\r\n\r\n const graphDiv = useRef<HTMLDivElement>(null);\r\n\r\n useEffect(() => {\r\n const resizeObserver = new ResizeObserver(entries => {\r\n setSvgWidth(width || entries[0].target.clientWidth || 760);\r\n setSvgHeight(height || entries[0].target.clientHeight || 480);\r\n });\r\n if (graphDiv.current) {\r\n setSvgHeight(graphDiv.current.clientHeight || 480);\r\n setSvgWidth(graphDiv.current.clientWidth || 760);\r\n if (!width) resizeObserver.observe(graphDiv.current);\r\n }\r\n return () => resizeObserver.disconnect();\r\n }, [width, height]);\r\n useEffect(() => {\r\n if (typeof mapData === 'string') {\r\n const fetchData = fetchAndParseJSON(mapData);\r\n fetchData.then(d => {\r\n if (\r\n mapData ===\r\n 'https://raw.githubusercontent.com/UNDP-Data/dv-country-geojson/refs/heads/main/worldMap-simplified.json'\r\n ) {\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n const features = d.features.map((el: any) => {\r\n if (el.geometry.type === 'Polygon') {\r\n const reversed = [...el.geometry.coordinates[0]].reverse();\r\n const geometry = { ...el.geometry, coordinates: [reversed] };\r\n return { ...el, geometry };\r\n }\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n const coord: any = [];\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n el.geometry.coordinates.forEach((c: any) => {\r\n const reversed = [...c[0]].reverse();\r\n coord.push([reversed]);\r\n });\r\n const geometry = { ...el.geometry, coordinates: coord };\r\n return { ...el, geometry };\r\n });\r\n setMapShape(features);\r\n } else setMapShape(d.features);\r\n });\r\n } else {\r\n setMapShape(mapData.features);\r\n }\r\n }, [mapData]);\r\n\r\n const domain =\r\n colorDomain ||\r\n (scaleType === 'categorical'\r\n ? getUniqValue(data, 'x')\r\n : getJenks(\r\n data.map(d => d.x as number | null | undefined),\r\n colors?.length || 4,\r\n ));\r\n return (\r\n <div\r\n className={`${theme || 'light'} flex ${width ? 'w-fit grow-0' : 'w-full grow'}`}\r\n dir={language === 'he' || language === 'ar' ? 'rtl' : undefined}\r\n >\r\n <div\r\n className={cn(\r\n `${\r\n !backgroundColor\r\n ? 'bg-transparent '\r\n : backgroundColor === true\r\n ? 'bg-primary-gray-200 dark:bg-primary-gray-650 '\r\n : ''\r\n }ml-auto mr-auto flex flex-col grow h-inherit ${language || 'en'}`,\r\n classNames?.graphContainer,\r\n )}\r\n style={{\r\n ...(styles?.graphContainer || {}),\r\n ...(backgroundColor && backgroundColor !== true ? { backgroundColor } : {}),\r\n }}\r\n id={graphID}\r\n aria-label={\r\n ariaLabel ||\r\n `${\r\n graphTitle ? `The graph shows ${graphTitle}. ` : ''\r\n }This is a map.${graphDescription ? ` ${graphDescription}` : ''}`\r\n }\r\n >\r\n <div\r\n className='flex grow'\r\n style={{ padding: backgroundColor ? padding || '1rem' : padding || 0 }}\r\n >\r\n <div className='flex flex-col w-full gap-4 grow justify-between'>\r\n {graphTitle || graphDescription || dataDownload ? (\r\n <GraphHeader\r\n styles={{\r\n title: styles?.title,\r\n description: styles?.description,\r\n }}\r\n classNames={{\r\n title: classNames?.title,\r\n description: classNames?.description,\r\n }}\r\n graphTitle={graphTitle}\r\n graphDescription={graphDescription}\r\n width={width}\r\n graphDownload={undefined}\r\n dataDownload={\r\n dataDownload\r\n ? data.map(d => d.data).filter(d => d !== undefined).length > 0\r\n ? data.map(d => d.data).filter(d => d !== undefined)\r\n : data.filter(d => d !== undefined)\r\n : null\r\n }\r\n />\r\n ) : null}\r\n <div\r\n className='flex flex-col grow justify-center leading-0'\r\n ref={graphDiv}\r\n aria-label='Map area'\r\n >\r\n {(width || svgWidth) && (height || svgHeight) && mapShape ? (\r\n <Graph\r\n data={data}\r\n globeOffset={globeOffset}\r\n polygonData={mapShape}\r\n colorDomain={domain}\r\n width={width || svgWidth}\r\n height={Math.max(\r\n minHeight,\r\n height ||\r\n (relativeHeight\r\n ? minHeight\r\n ? (width || svgWidth) * relativeHeight > minHeight\r\n ? (width || svgWidth) * relativeHeight\r\n : minHeight\r\n : (width || svgWidth) * relativeHeight\r\n : svgHeight),\r\n )}\r\n colors={\r\n colors ||\r\n (scaleType === 'categorical'\r\n ? Colors[theme].sequentialColors[\r\n `neutralColorsx0${domain.length as 4 | 5 | 6 | 7 | 8 | 9}`\r\n ]\r\n : Colors[theme].sequentialColors[\r\n `neutralColorsx0${(domain.length + 1) as 4 | 5 | 6 | 7 | 8 | 9}`\r\n ])\r\n }\r\n mapNoDataColor={mapNoDataColor}\r\n categorical={scaleType === 'categorical'}\r\n mapBorderColor={mapBorderColor}\r\n tooltip={tooltip}\r\n mapProperty={mapProperty}\r\n styles={styles}\r\n classNames={classNames}\r\n autoRotate={autoRotate === true ? 1.5 : autoRotate === false ? 0 : autoRotate}\r\n enableZoom={enableZoom}\r\n globeMaterial={globeMaterial}\r\n atmosphereColor={atmosphereColor}\r\n centerPoint={centerPoint}\r\n colorLegendTitle={colorLegendTitle}\r\n showColorScale={showColorScale}\r\n hoverStrokeColor={\r\n theme === 'light'\r\n ? Colors.light.grays['gray-700']\r\n : Colors.light.grays['gray-300']\r\n }\r\n highlightedIds={highlightedIds}\r\n resetSelectionOnDoubleClick={resetSelectionOnDoubleClick}\r\n detailsOnClick={detailsOnClick}\r\n onSeriesMouseOver={onSeriesMouseOver}\r\n onSeriesMouseClick={onSeriesMouseClick}\r\n scale={scale}\r\n polygonAltitude={polygonAltitude}\r\n centerLat={centerPoint[0]}\r\n centerLng={centerPoint[1]}\r\n />\r\n ) : (\r\n <div\r\n style={{\r\n height: `${Math.max(\r\n minHeight,\r\n height ||\r\n (relativeHeight\r\n ? minHeight\r\n ? (width || svgWidth) * relativeHeight > minHeight\r\n ? (width || svgWidth) * relativeHeight\r\n : minHeight\r\n : (width || svgWidth) * relativeHeight\r\n : svgHeight),\r\n )}px`,\r\n }}\r\n className='flex items-center justify-center'\r\n >\r\n <Spinner aria-label='Loading graph' />\r\n </div>\r\n )}\r\n </div>\r\n {sources || footNote ? (\r\n <GraphFooter\r\n styles={{ footnote: styles?.footnote, source: styles?.source }}\r\n classNames={{\r\n footnote: classNames?.footnote,\r\n source: classNames?.source,\r\n }}\r\n sources={sources}\r\n footNote={footNote}\r\n width={width}\r\n />\r\n ) : null}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n"],"names":["Graph","props","width","autoRotate","data","enableZoom","categorical","colorDomain","colors","globeMaterial","height","polygonData","mapProperty","mapBorderColor","atmosphereColor","tooltip","styles","classNames","mapNoDataColor","centerPoint","colorLegendTitle","showColorScale","hoverStrokeColor","detailsOnClick","onSeriesMouseClick","onSeriesMouseOver","resetSelectionOnDoubleClick","highlightedIds","scale","globeOffset","polygonAltitude","centerLng","centerLat","globeEl","useRef","mouseClickData","setMouseClickData","useState","showLegend","setShowLegend","mousePos","setMousePos","mouseOverData","setMouseOverData","colorScale","scaleOrdinal","scaleThreshold","useEffect","canvas","handleMouseMove","e","materials","THREE","jsxs","jsx","Globe","polygon","id","val","el","color","clickedData","isEqual","hoverData","Fragment","X","P","d","i","numberFormattingFunction","Tooltip","Modal","string2HTML","ThreeDGlobe","mapData","graphTitle","sources","graphDescription","footNote","scaleType","padding","Colors","backgroundColor","relativeHeight","graphID","dataDownload","language","minHeight","theme","ariaLabel","mapShape","setMapShape","svgWidth","setSvgWidth","svgHeight","setSvgHeight","graphDiv","resizeObserver","entries","fetchAndParseJSON","features","reversed","geometry","coord","c","domain","getUniqValue","getJenks","cn","GraphHeader","Spinner","GraphFooter"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ThreeDGlobe.js","sources":["../src/Components/Graphs/Maps/ThreeDGlobe/Graph.tsx","../src/Components/Graphs/Maps/ThreeDGlobe/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\r\nimport Globe, { GlobeMethods } from 'react-globe.gl';\r\nimport isEqual from 'fast-deep-equal';\r\nimport { useEffect, useRef, useState } from 'react';\r\nimport { scaleOrdinal, scaleThreshold } from 'd3-scale';\r\nimport * as THREE from 'three';\r\nimport { Modal } from '@undp/design-system-react/Modal';\r\nimport { P } from '@undp/design-system-react/Typography';\r\n\r\nimport { ChoroplethMapDataType, ClassNameObject, StyleObject } from '@/Types';\r\nimport { Tooltip } from '@/Components/Elements/Tooltip';\r\nimport { numberFormattingFunction } from '@/Utils/numberFormattingFunction';\r\nimport { X } from '@/Components/Icons';\r\nimport { string2HTML } from '@/Utils/string2HTML';\r\n\r\ninterface Props {\r\n width: number;\r\n data: ChoroplethMapDataType[];\r\n autoRotate: number;\r\n enableZoom: boolean;\r\n categorical: boolean;\r\n colorDomain: number[] | string[];\r\n colors: string[];\r\n height: number;\r\n globeMaterial?: THREE.Material;\r\n polygonData: any;\r\n mapProperty: string;\r\n mapBorderColor: string;\r\n atmosphereColor: string;\r\n tooltip?: string | ((_d: any) => React.ReactNode);\r\n styles?: StyleObject;\r\n classNames?: ClassNameObject;\r\n onSeriesMouseOver?: (_d: any) => void;\r\n onSeriesMouseClick?: (_d: any) => void;\r\n mapNoDataColor: string;\r\n centerPoint: [number, number];\r\n colorLegendTitle?: string;\r\n showColorScale: boolean;\r\n hoverStrokeColor: string;\r\n detailsOnClick?: string | ((_d: any) => React.ReactNode);\r\n resetSelectionOnDoubleClick: boolean;\r\n highlightedIds: string[];\r\n scale: number;\r\n globeOffset: [number, number];\r\n polygonAltitude: number;\r\n centerLng: number;\r\n centerLat: number;\r\n atmosphereAltitude: number;\r\n globeCurvatureResolution: number;\r\n lightColor: string;\r\n}\r\n\r\nfunction Graph(props: Props) {\r\n const {\r\n width,\r\n autoRotate,\r\n data,\r\n enableZoom,\r\n categorical,\r\n colorDomain,\r\n colors,\r\n globeMaterial,\r\n height,\r\n polygonData,\r\n mapProperty,\r\n mapBorderColor,\r\n atmosphereColor,\r\n tooltip,\r\n styles,\r\n classNames,\r\n mapNoDataColor,\r\n centerPoint,\r\n colorLegendTitle,\r\n showColorScale,\r\n hoverStrokeColor,\r\n detailsOnClick,\r\n onSeriesMouseClick,\r\n onSeriesMouseOver,\r\n resetSelectionOnDoubleClick,\r\n highlightedIds,\r\n scale,\r\n globeOffset,\r\n polygonAltitude,\r\n centerLng,\r\n centerLat,\r\n atmosphereAltitude,\r\n globeCurvatureResolution,\r\n lightColor,\r\n } = props;\r\n const globeEl = useRef<GlobeMethods | undefined>(undefined);\r\n const [mouseClickData, setMouseClickData] = useState<any>(undefined);\r\n const [showLegend, setShowLegend] = useState(!(width < 680));\r\n const [mousePos, setMousePos] = useState({ x: 0, y: 0 });\r\n const [mouseOverData, setMouseOverData] = useState<ChoroplethMapDataType | undefined>(undefined);\r\n const colorScale = categorical\r\n ? scaleOrdinal<number | string, string>().domain(colorDomain).range(colors)\r\n : scaleThreshold<number, string>()\r\n .domain(colorDomain as number[])\r\n .range(colors);\r\n useEffect(() => {\r\n if (globeEl?.current) {\r\n globeEl.current.controls().autoRotate = autoRotate === 0 ? false : true;\r\n globeEl.current.controls().enableZoom = enableZoom;\r\n globeEl.current.controls().autoRotateSpeed = autoRotate;\r\n }\r\n }, [autoRotate, enableZoom]);\r\n useEffect(() => {\r\n if (globeEl.current) {\r\n if (mouseOverData) {\r\n globeEl.current.controls().autoRotate = false;\r\n } else {\r\n globeEl.current.controls().autoRotate = autoRotate === 0 ? false : true;\r\n }\r\n }\r\n }, [mouseOverData, autoRotate]);\r\n\r\n useEffect(() => {\r\n const canvas = globeEl.current?.renderer().domElement;\r\n if (!canvas) return;\r\n\r\n const handleMouseMove = (e: MouseEvent) => {\r\n setMousePos({ x: e.clientX, y: e.clientY });\r\n };\r\n\r\n canvas.addEventListener('mousemove', handleMouseMove);\r\n return () => canvas.removeEventListener('mousemove', handleMouseMove);\r\n }, []);\r\n\r\n useEffect(() => {\r\n if (globeEl.current) {\r\n globeEl.current.pointOfView({ lat: centerLat, lng: centerLng, altitude: scale }, 1000);\r\n }\r\n }, [scale, centerLng, centerLat]);\r\n const materials =\r\n globeMaterial ||\r\n new THREE.MeshPhysicalMaterial({\r\n color: '#FFF',\r\n roughness: 0.5,\r\n reflectivity: 1.2,\r\n });\r\n return (\r\n <div className='relative'>\r\n <Globe\r\n ref={globeEl}\r\n width={width}\r\n height={height}\r\n globeOffset={globeOffset}\r\n lineHoverPrecision={0}\r\n polygonsData={polygonData}\r\n polygonAltitude={(polygon: any) =>\r\n highlightedIds.includes(polygon?.properties?.[mapProperty])\r\n ? 0.1\r\n : polygon?.properties?.[mapProperty] === mouseOverData?.id\r\n ? 0.01\r\n : polygonAltitude\r\n }\r\n polygonCapColor={(polygon: any) => {\r\n const id = polygon?.properties?.[mapProperty];\r\n const val = data.find(el => el.id === id)?.x;\r\n if (val !== undefined && val !== null) {\r\n return colorScale(val as any);\r\n }\r\n return mapNoDataColor;\r\n }}\r\n polygonSideColor={(polygon: any) => {\r\n const id = polygon?.properties?.[mapProperty];\r\n const val = data.find(el => el.id === id)?.x;\r\n const color = val !== undefined && val !== null ? colorScale(val as any) : mapNoDataColor;\r\n return highlightedIds.includes(polygon?.properties?.[mapProperty])\r\n ? color\r\n : 'rgba(100,100,100,0)';\r\n }}\r\n polygonStrokeColor={(polygon: any) =>\r\n polygon?.properties?.[mapProperty] === mouseOverData?.id\r\n ? hoverStrokeColor\r\n : mapBorderColor\r\n }\r\n onPolygonClick={(polygon: any) => {\r\n const clickedData = polygon?.properties?.[mapProperty]\r\n ? data.find(el => el.id === polygon?.properties?.[mapProperty])\r\n : undefined;\r\n if (onSeriesMouseClick || detailsOnClick) {\r\n if (\r\n isEqual(mouseClickData, clickedData) &&\r\n resetSelectionOnDoubleClick &&\r\n clickedData\r\n ) {\r\n setMouseClickData(undefined);\r\n onSeriesMouseClick?.(undefined);\r\n } else {\r\n setMouseClickData(clickedData);\r\n onSeriesMouseClick?.(clickedData);\r\n }\r\n }\r\n setMouseClickData(clickedData);\r\n onSeriesMouseClick?.(clickedData);\r\n }}\r\n onPolygonHover={(polygon: any) => {\r\n const hoverData = polygon?.properties?.[mapProperty]\r\n ? data.find(el => el.id === polygon?.properties?.[mapProperty])\r\n : undefined;\r\n setMouseOverData(hoverData);\r\n onSeriesMouseOver?.(hoverData);\r\n }}\r\n atmosphereColor={atmosphereColor}\r\n atmosphereAltitude={atmosphereAltitude}\r\n globeCurvatureResolution={globeCurvatureResolution}\r\n globeMaterial={materials}\r\n backgroundColor='rgba(0, 0, 0, 0)'\r\n polygonsTransitionDuration={100}\r\n onGlobeReady={() => {\r\n if (globeEl.current) {\r\n globeEl.current.pointOfView({\r\n lat: centerPoint[0],\r\n lng: centerPoint[1],\r\n });\r\n const scene = globeEl.current.scene();\r\n setTimeout(() => {\r\n scene.children\r\n .filter(d => d.type === 'DirectionalLight')\r\n .map(d => {\r\n scene.remove(d);\r\n });\r\n const ambientLight = new THREE.AmbientLight(lightColor, 0.2);\r\n scene.add(ambientLight);\r\n\r\n const polygons = scene.children[3]?.children[0]?.children[4]?.children || [];\r\n polygons.forEach(d => {\r\n const line = d.children[1];\r\n line.renderOrder = 2;\r\n });\r\n }, 300);\r\n const light = new THREE.DirectionalLight(0xffffff, 0.1);\r\n const camera = globeEl.current.camera();\r\n light.position.set(0, 0, 1);\r\n camera.add(light);\r\n scene.add(camera);\r\n scene.fog = new THREE.Fog(lightColor, 150, 300);\r\n }\r\n }}\r\n />\r\n {showColorScale === false ? null : (\r\n <div className='absolute left-4 bottom-4'>\r\n {showLegend ? (\r\n <>\r\n <div\r\n style={{\r\n backgroundColor: 'rgba(240,240,240, 0.7)',\r\n border: '1px solid var(--gray-400)',\r\n borderRadius: '999px',\r\n width: '24px',\r\n height: '24px',\r\n padding: '3px',\r\n cursor: 'pointer',\r\n zIndex: 10,\r\n position: 'absolute',\r\n right: '-0.75rem',\r\n top: '-0.75rem',\r\n }}\r\n onClick={() => {\r\n setShowLegend(false);\r\n }}\r\n >\r\n <X />\r\n </div>\r\n <div\r\n className='p-2'\r\n style={{\r\n backgroundColor: 'rgba(240,240,240, 0.7)',\r\n width: categorical ? undefined : '340px',\r\n }}\r\n >\r\n {colorLegendTitle && colorLegendTitle !== '' ? (\r\n <P\r\n size='xs'\r\n marginBottom='xs'\r\n className='p-0 leading-normal overflow-hidden text-primary-gray-700 dark:text-primary-gray-300'\r\n style={{\r\n display: '-webkit-box',\r\n WebkitLineClamp: '1',\r\n WebkitBoxOrient: 'vertical',\r\n }}\r\n >\r\n {colorLegendTitle}\r\n </P>\r\n ) : null}\r\n {!categorical ? (\r\n <svg width='100%' viewBox='0 0 320 30' direction='ltr'>\r\n <g>\r\n {colorDomain.map((d, i) => (\r\n <g key={i} className='cursor-pointer'>\r\n <rect\r\n x={(i * 320) / colors.length + 1}\r\n y={1}\r\n width={320 / colors.length - 2}\r\n height={8}\r\n style={{\r\n fill: colors[i],\r\n stroke: colors[i],\r\n }}\r\n />\r\n <text\r\n x={((i + 1) * 320) / colors.length}\r\n y={25}\r\n className='fill-primary-gray-700 dark:fill-primary-gray-300 text-xs'\r\n style={{ textAnchor: 'middle' }}\r\n >\r\n {numberFormattingFunction(d as number, 'NA')}\r\n </text>\r\n </g>\r\n ))}\r\n <g>\r\n <rect\r\n x={(colorDomain.length * 320) / colors.length + 1}\r\n y={1}\r\n width={320 / colors.length - 2}\r\n height={8}\r\n style={{\r\n fill: colors[colorDomain.length],\r\n stroke: colors[colorDomain.length],\r\n }}\r\n />\r\n </g>\r\n </g>\r\n </svg>\r\n ) : (\r\n <div className='flex flex-col gap-3'>\r\n {colorDomain.map((d, i) => (\r\n <div key={i} className='flex gap-2 items-center'>\r\n <div\r\n className='w-2 h-2 rounded-full'\r\n style={{ backgroundColor: colors[i % colors.length] }}\r\n />\r\n <P size='sm' marginBottom='none' leading='none'>\r\n {d}\r\n </P>\r\n </div>\r\n ))}\r\n </div>\r\n )}\r\n </div>\r\n </>\r\n ) : (\r\n <button\r\n type='button'\r\n className='mb-0 border-0 bg-transparent p-0 self-start'\r\n onClick={() => {\r\n setShowLegend(true);\r\n }}\r\n >\r\n <div className='items-start text-sm font-medium cursor-pointer p-2 mb-0 flex text-primary-black dark:text-primary-gray-300 bg-primary-gray-300 dark:bg-primary-gray-550 border-primary-gray-400 dark:border-primary-gray-500'>\r\n Show Legend\r\n </div>\r\n </button>\r\n )}\r\n </div>\r\n )}\r\n {mouseOverData && tooltip ? (\r\n <Tooltip\r\n data={mouseOverData}\r\n body={tooltip}\r\n xPos={mousePos.x}\r\n yPos={mousePos.y}\r\n backgroundStyle={styles?.tooltip}\r\n className={classNames?.tooltip}\r\n />\r\n ) : null}\r\n {detailsOnClick && mouseClickData !== undefined ? (\r\n <Modal\r\n open={mouseClickData !== undefined}\r\n onClose={() => {\r\n setMouseClickData(undefined);\r\n }}\r\n >\r\n <div\r\n className='graph-modal-content m-0'\r\n dangerouslySetInnerHTML={\r\n typeof detailsOnClick === 'string'\r\n ? { __html: string2HTML(detailsOnClick, mouseClickData) }\r\n : undefined\r\n }\r\n >\r\n {typeof detailsOnClick === 'function' ? detailsOnClick(mouseClickData) : null}\r\n </div>\r\n </Modal>\r\n ) : null}\r\n </div>\r\n );\r\n}\r\n\r\nexport default Graph;\r\n","import React, { useEffect, useRef, useState } from 'react';\r\nimport { Spinner } from '@undp/design-system-react/Spinner';\r\nimport * as THREE from 'three';\r\nimport { cn } from '@undp/design-system-react/cn';\r\nimport Globe from 'react-globe.gl';\r\n\r\nimport Graph from './Graph';\r\n\r\nimport { GraphHeader } from '@/Components/Elements/GraphHeader';\r\nimport { GraphFooter } from '@/Components/Elements/GraphFooter';\r\nimport {\r\n ChoroplethMapDataType,\r\n ClassNameObject,\r\n Languages,\r\n ScaleDataType,\r\n SourcesDataType,\r\n StyleObject,\r\n} from '@/Types';\r\nimport { fetchAndParseJSON } from '@/Utils/fetchAndParseData';\r\nimport { Colors } from '@/Components/ColorPalette';\r\nimport { getUniqValue } from '@/Utils/getUniqValue';\r\nimport { getJenks } from '@/Utils/getJenks';\r\n\r\ntype GlobeProps = React.ComponentProps<typeof Globe>;\r\ninterface Props extends Partial<Omit<GlobeProps, 'backgroundColor'>> {\r\n // Data\r\n /** Array of data objects */\r\n data: ChoroplethMapDataType[];\r\n\r\n // Titles, Labels, and Sources\r\n /** Title of the graph */\r\n graphTitle?: string | React.ReactNode;\r\n /** Description of the graph */\r\n graphDescription?: string | React.ReactNode;\r\n /** Footnote for the graph */\r\n footNote?: string | React.ReactNode;\r\n /** Source data for the graph */\r\n sources?: SourcesDataType[];\r\n /** Accessibility label */\r\n ariaLabel?: string;\r\n\r\n // Colors and Styling\r\n /** Colors for the choropleth map */\r\n colors?: string[];\r\n /** Domain of colors for the graph */\r\n colorDomain?: number[] | string[];\r\n /** Title for the color legend */\r\n colorLegendTitle?: string;\r\n /** Color for the areas where data is no available */\r\n mapNoDataColor?: string;\r\n /** Background color of the graph */\r\n backgroundColor?: string | boolean;\r\n /** Custom styles for the graph. Each object should be a valid React CSS style object. */\r\n styles?: StyleObject;\r\n /** Custom class names */\r\n classNames?: ClassNameObject;\r\n\r\n // Size and Spacing\r\n /** Width of the graph */\r\n width?: number;\r\n /** Height of the graph */\r\n height?: number;\r\n /** Minimum height of the graph */\r\n minHeight?: number;\r\n /** Relative height scaling factor. This overwrites the height props */\r\n relativeHeight?: number;\r\n /** Padding around the graph. Defaults to 0 if no backgroundColor is mentioned else defaults to 1rem */\r\n padding?: string;\r\n\r\n // Graph Parameters\r\n /** Map data as an object in geoJson format or a url for geoJson */\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n mapData?: any;\r\n /** Stroke color of the regions in the map */\r\n mapBorderColor?: string;\r\n /** Center point of the map */\r\n centerPoint?: [number, number];\r\n /** Defines if the globe rotates automatically */\r\n autoRotate?: number | boolean;\r\n /** Defines the material property applied to the sphere of the globe */\r\n globeMaterial?: THREE.Material;\r\n /** Defines the colo of the glow around the globe */\r\n atmosphereColor?: string;\r\n /** Defines if the globe can be zoomed when scrolled */\r\n enableZoom?: boolean;\r\n /** Position offset of the globe relative to the canvas center */\r\n globeOffset?: [number, number];\r\n /** Defines the camera distance from Earth. This helps in defining the default size of the globe. Smaller = closer camera therefore the globe is bigger) */\r\n scale?: number;\r\n /** Defines the spacing between the country shape polygon with the sphere */\r\n polygonAltitude?: number;\r\n /** Scale for the colors */\r\n scaleType?: Exclude<ScaleDataType, 'linear'>;\r\n /** Toggles if the color scaling is categorical or not */\r\n categorical?: boolean;\r\n /** Toggle visibility of color scale. */\r\n showColorScale?: boolean;\r\n /** The max altitude of the atmosphere, in terms of globe radius units. */\r\n atmosphereAltitude?: number;\r\n /** Resolution in angular degrees of the sphere curvature. The finer the resolution, the more the globe is fragmented into smaller faces to approximate the spheric surface, at the cost of performance. */\r\n globeCurvatureResolution?: number;\r\n /** Defines the color of the light and atmosphere. */\r\n lightColor?: string;\r\n /** Property in the property object in mapData geoJson object is used to match to the id in the data object */\r\n mapProperty?: string;\r\n /** Countries or regions to be highlighted */\r\n highlightedIds?: string[];\r\n /** Enable data download option as a csv */\r\n dataDownload?: boolean;\r\n /** Reset selection on double-click. Only applicable when used in a dashboard context with filters. */\r\n resetSelectionOnDoubleClick?: boolean;\r\n\r\n // Interactions and Callbacks\r\n /** Tooltip content. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n tooltip?: string | ((_d: any) => React.ReactNode);\r\n /** Details displayed on the modal when user clicks of a data point. If the type is string then this uses the [handlebar](../?path=/docs/misc-handlebars-templates-and-custom-helpers--docs) template to display the data */\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n detailsOnClick?: string | ((_d: any) => React.ReactNode);\r\n /** Callback for mouse over event */\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n onSeriesMouseOver?: (_d: any) => void;\r\n /** Callback for mouse click event */\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n onSeriesMouseClick?: (_d: any) => void;\r\n\r\n // Configuration and Options\r\n /** Language setting */\r\n language?: Languages;\r\n /** Color theme */\r\n theme?: 'light' | 'dark';\r\n /** Unique ID for the graph */\r\n graphID?: string;\r\n}\r\n\r\n/** For using these maps you will have to install [`three`](https://threejs.org/manual/) and [react-globe.gl](https://www.npmjs.com/package/react-globe.gl) package to your project */\r\nexport function ThreeDGlobe(props: Props) {\r\n const {\r\n data,\r\n mapData = 'https://raw.githubusercontent.com/UNDP-Data/dv-country-geojson/refs/heads/main/worldMap-simplified.json',\r\n graphTitle,\r\n colors,\r\n sources,\r\n graphDescription,\r\n height,\r\n width,\r\n footNote = 'The designations employed and the presentation of material on this map do not imply the expression of any opinion whatsoever on the part of the Secretariat of the United Nations or UNDP concerning the legal status of any country, territory, city or area or its authorities, or concerning the delimitation of its frontiers or boundaries.',\r\n colorDomain,\r\n colorLegendTitle,\r\n scaleType = 'threshold',\r\n padding,\r\n mapNoDataColor = Colors.light.graphNoData,\r\n backgroundColor = false,\r\n mapBorderColor = Colors.light.grays['gray-500'],\r\n relativeHeight,\r\n tooltip,\r\n graphID,\r\n mapProperty = 'ISO3',\r\n dataDownload = false,\r\n language = 'en',\r\n minHeight = 0,\r\n theme = 'light',\r\n ariaLabel,\r\n styles,\r\n classNames,\r\n autoRotate = true,\r\n enableZoom = true,\r\n globeMaterial,\r\n centerPoint = [0, 0],\r\n atmosphereColor = '#999',\r\n showColorScale = true,\r\n resetSelectionOnDoubleClick = true,\r\n detailsOnClick,\r\n onSeriesMouseOver,\r\n onSeriesMouseClick,\r\n highlightedIds = [],\r\n scale = 1,\r\n globeOffset = [0, 0],\r\n polygonAltitude = 0.01,\r\n globeCurvatureResolution = 4,\r\n atmosphereAltitude = 0.15,\r\n lightColor = '#dce9fe',\r\n } = props;\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n const [mapShape, setMapShape] = useState<any>(undefined);\r\n\r\n const [svgWidth, setSvgWidth] = useState(0);\r\n const [svgHeight, setSvgHeight] = useState(0);\r\n\r\n const graphDiv = useRef<HTMLDivElement>(null);\r\n\r\n useEffect(() => {\r\n const resizeObserver = new ResizeObserver(entries => {\r\n setSvgWidth(width || entries[0].target.clientWidth || 760);\r\n setSvgHeight(height || entries[0].target.clientHeight || 480);\r\n });\r\n if (graphDiv.current) {\r\n setSvgHeight(graphDiv.current.clientHeight || 480);\r\n setSvgWidth(graphDiv.current.clientWidth || 760);\r\n if (!width) resizeObserver.observe(graphDiv.current);\r\n }\r\n return () => resizeObserver.disconnect();\r\n }, [width, height]);\r\n useEffect(() => {\r\n if (typeof mapData === 'string') {\r\n const fetchData = fetchAndParseJSON(mapData);\r\n fetchData.then(d => {\r\n if (\r\n mapData ===\r\n 'https://raw.githubusercontent.com/UNDP-Data/dv-country-geojson/refs/heads/main/worldMap-simplified.json'\r\n ) {\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n const features = d.features.map((el: any) => {\r\n if (el.geometry.type === 'Polygon') {\r\n const reversed = [...el.geometry.coordinates[0]].reverse();\r\n const geometry = { ...el.geometry, coordinates: [reversed] };\r\n return { ...el, geometry };\r\n }\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n const coord: any = [];\r\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n el.geometry.coordinates.forEach((c: any) => {\r\n const reversed = [...c[0]].reverse();\r\n coord.push([reversed]);\r\n });\r\n const geometry = { ...el.geometry, coordinates: coord };\r\n return { ...el, geometry };\r\n });\r\n setMapShape(features);\r\n } else setMapShape(d.features);\r\n });\r\n } else {\r\n setMapShape(mapData.features);\r\n }\r\n }, [mapData]);\r\n\r\n const domain =\r\n colorDomain ||\r\n (scaleType === 'categorical'\r\n ? getUniqValue(data, 'x')\r\n : getJenks(\r\n data.map(d => d.x as number | null | undefined),\r\n colors?.length || 4,\r\n ));\r\n return (\r\n <div\r\n className={`${theme || 'light'} flex ${width ? 'w-fit grow-0' : 'w-full grow'}`}\r\n dir={language === 'he' || language === 'ar' ? 'rtl' : undefined}\r\n >\r\n <div\r\n className={cn(\r\n `${\r\n !backgroundColor\r\n ? 'bg-transparent '\r\n : backgroundColor === true\r\n ? 'bg-primary-gray-200 dark:bg-primary-gray-650 '\r\n : ''\r\n }ml-auto mr-auto flex flex-col grow h-inherit ${language || 'en'}`,\r\n classNames?.graphContainer,\r\n )}\r\n style={{\r\n ...(styles?.graphContainer || {}),\r\n ...(backgroundColor && backgroundColor !== true ? { backgroundColor } : {}),\r\n }}\r\n id={graphID}\r\n aria-label={\r\n ariaLabel ||\r\n `${\r\n graphTitle ? `The graph shows ${graphTitle}. ` : ''\r\n }This is a map.${graphDescription ? ` ${graphDescription}` : ''}`\r\n }\r\n >\r\n <div\r\n className='flex grow'\r\n style={{ padding: backgroundColor ? padding || '1rem' : padding || 0 }}\r\n >\r\n <div className='flex flex-col w-full gap-4 grow justify-between'>\r\n {graphTitle || graphDescription || dataDownload ? (\r\n <GraphHeader\r\n styles={{\r\n title: styles?.title,\r\n description: styles?.description,\r\n }}\r\n classNames={{\r\n title: classNames?.title,\r\n description: classNames?.description,\r\n }}\r\n graphTitle={graphTitle}\r\n graphDescription={graphDescription}\r\n width={width}\r\n graphDownload={undefined}\r\n dataDownload={\r\n dataDownload\r\n ? data.map(d => d.data).filter(d => d !== undefined).length > 0\r\n ? data.map(d => d.data).filter(d => d !== undefined)\r\n : data.filter(d => d !== undefined)\r\n : null\r\n }\r\n />\r\n ) : null}\r\n <div\r\n className='flex flex-col grow justify-center leading-0'\r\n ref={graphDiv}\r\n aria-label='Map area'\r\n >\r\n {(width || svgWidth) && (height || svgHeight) && mapShape ? (\r\n <Graph\r\n data={data}\r\n globeOffset={globeOffset}\r\n polygonData={mapShape}\r\n colorDomain={domain}\r\n width={width || svgWidth}\r\n height={Math.max(\r\n minHeight,\r\n height ||\r\n (relativeHeight\r\n ? minHeight\r\n ? (width || svgWidth) * relativeHeight > minHeight\r\n ? (width || svgWidth) * relativeHeight\r\n : minHeight\r\n : (width || svgWidth) * relativeHeight\r\n : svgHeight),\r\n )}\r\n colors={\r\n colors ||\r\n (scaleType === 'categorical'\r\n ? Colors[theme].sequentialColors[\r\n `neutralColorsx0${domain.length as 4 | 5 | 6 | 7 | 8 | 9}`\r\n ]\r\n : Colors[theme].sequentialColors[\r\n `neutralColorsx0${(domain.length + 1) as 4 | 5 | 6 | 7 | 8 | 9}`\r\n ])\r\n }\r\n mapNoDataColor={mapNoDataColor}\r\n categorical={scaleType === 'categorical'}\r\n mapBorderColor={mapBorderColor}\r\n tooltip={tooltip}\r\n mapProperty={mapProperty}\r\n styles={styles}\r\n classNames={classNames}\r\n autoRotate={autoRotate === true ? 1.5 : autoRotate === false ? 0 : autoRotate}\r\n enableZoom={enableZoom}\r\n globeMaterial={globeMaterial}\r\n atmosphereColor={atmosphereColor}\r\n centerPoint={centerPoint}\r\n colorLegendTitle={colorLegendTitle}\r\n showColorScale={showColorScale}\r\n hoverStrokeColor={\r\n theme === 'light'\r\n ? Colors.light.grays['gray-700']\r\n : Colors.light.grays['gray-300']\r\n }\r\n highlightedIds={highlightedIds}\r\n resetSelectionOnDoubleClick={resetSelectionOnDoubleClick}\r\n detailsOnClick={detailsOnClick}\r\n onSeriesMouseOver={onSeriesMouseOver}\r\n onSeriesMouseClick={onSeriesMouseClick}\r\n scale={scale}\r\n polygonAltitude={polygonAltitude}\r\n centerLat={centerPoint[0]}\r\n centerLng={centerPoint[1]}\r\n atmosphereAltitude={atmosphereAltitude}\r\n globeCurvatureResolution={globeCurvatureResolution}\r\n lightColor={lightColor}\r\n />\r\n ) : (\r\n <div\r\n style={{\r\n height: `${Math.max(\r\n minHeight,\r\n height ||\r\n (relativeHeight\r\n ? minHeight\r\n ? (width || svgWidth) * relativeHeight > minHeight\r\n ? (width || svgWidth) * relativeHeight\r\n : minHeight\r\n : (width || svgWidth) * relativeHeight\r\n : svgHeight),\r\n )}px`,\r\n }}\r\n className='flex items-center justify-center'\r\n >\r\n <Spinner aria-label='Loading graph' />\r\n </div>\r\n )}\r\n </div>\r\n {sources || footNote ? (\r\n <GraphFooter\r\n styles={{ footnote: styles?.footnote, source: styles?.source }}\r\n classNames={{\r\n footnote: classNames?.footnote,\r\n source: classNames?.source,\r\n }}\r\n sources={sources}\r\n footNote={footNote}\r\n width={width}\r\n />\r\n ) : null}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n"],"names":["Graph","props","width","autoRotate","data","enableZoom","categorical","colorDomain","colors","globeMaterial","height","polygonData","mapProperty","mapBorderColor","atmosphereColor","tooltip","styles","classNames","mapNoDataColor","centerPoint","colorLegendTitle","showColorScale","hoverStrokeColor","detailsOnClick","onSeriesMouseClick","onSeriesMouseOver","resetSelectionOnDoubleClick","highlightedIds","scale","globeOffset","polygonAltitude","centerLng","centerLat","atmosphereAltitude","globeCurvatureResolution","lightColor","globeEl","useRef","mouseClickData","setMouseClickData","useState","showLegend","setShowLegend","mousePos","setMousePos","mouseOverData","setMouseOverData","colorScale","scaleOrdinal","scaleThreshold","useEffect","canvas","handleMouseMove","e","materials","THREE","jsxs","jsx","Globe","polygon","id","val","el","color","clickedData","isEqual","hoverData","scene","d","ambientLight","line","light","camera","Fragment","X","P","i","numberFormattingFunction","Tooltip","Modal","string2HTML","ThreeDGlobe","mapData","graphTitle","sources","graphDescription","footNote","scaleType","padding","Colors","backgroundColor","relativeHeight","graphID","dataDownload","language","minHeight","theme","ariaLabel","mapShape","setMapShape","svgWidth","setSvgWidth","svgHeight","setSvgHeight","graphDiv","resizeObserver","entries","fetchAndParseJSON","features","reversed","geometry","coord","c","domain","getUniqValue","getJenks","cn","GraphHeader","Spinner","GraphFooter"],"mappings":"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"}
|
package/dist/Types.d.ts
CHANGED
|
@@ -619,7 +619,7 @@ export declare interface GraphSettingsDataType {
|
|
|
619
619
|
labelsToBeHidden?: (string | number)[];
|
|
620
620
|
autoRotate?: boolean;
|
|
621
621
|
enableZoom?: boolean;
|
|
622
|
-
globeMaterial?:
|
|
622
|
+
globeMaterial?: any;
|
|
623
623
|
categorical?: boolean;
|
|
624
624
|
atmosphereColor?: string;
|
|
625
625
|
lineAxisTitle?: string;
|
|
@@ -627,6 +627,9 @@ export declare interface GraphSettingsDataType {
|
|
|
627
627
|
naLabel?: string;
|
|
628
628
|
globeOffset?: [number, number];
|
|
629
629
|
polygonAltitude?: number;
|
|
630
|
+
atmosphereAltitude?: number;
|
|
631
|
+
globeCurvatureResolution?: number;
|
|
632
|
+
lightColor?: string;
|
|
630
633
|
}
|
|
631
634
|
|
|
632
635
|
export declare type GraphType = GraphTypeForGriddedGraph;
|
|
@@ -711,12 +714,6 @@ export declare interface MarginDataType {
|
|
|
711
714
|
right: number;
|
|
712
715
|
}
|
|
713
716
|
|
|
714
|
-
export declare interface MaterialDataType {
|
|
715
|
-
color: string;
|
|
716
|
-
opacity: number;
|
|
717
|
-
transparent: boolean;
|
|
718
|
-
}
|
|
719
|
-
|
|
720
717
|
export declare interface MultiLineAltChartDataType {
|
|
721
718
|
label: number | string;
|
|
722
719
|
y: number | null;
|
package/dist/index.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { default as default_2 } from 'react';
|
|
2
|
+
import { default as default_3 } from 'react-globe.gl';
|
|
2
3
|
import { JSX } from 'react/jsx-runtime';
|
|
3
4
|
import { JSX as JSX_2 } from 'react';
|
|
4
5
|
import * as THREE from 'three';
|
|
@@ -4017,6 +4018,8 @@ export declare const getTextColorBasedOnBgColor: (bgColor: string) => "#000" | "
|
|
|
4017
4018
|
*/
|
|
4018
4019
|
export declare function getUniqValue(csvData: any, column: string): any[];
|
|
4019
4020
|
|
|
4021
|
+
declare type GlobeProps = default_2.ComponentProps<typeof default_3>;
|
|
4022
|
+
|
|
4020
4023
|
declare interface GraphConfigurationDataType {
|
|
4021
4024
|
columnId: string | string[];
|
|
4022
4025
|
chartConfigId: string;
|
|
@@ -4269,7 +4272,7 @@ declare interface GraphSettingsDataType {
|
|
|
4269
4272
|
labelsToBeHidden?: (string | number)[];
|
|
4270
4273
|
autoRotate?: boolean;
|
|
4271
4274
|
enableZoom?: boolean;
|
|
4272
|
-
globeMaterial?:
|
|
4275
|
+
globeMaterial?: any;
|
|
4273
4276
|
categorical?: boolean;
|
|
4274
4277
|
atmosphereColor?: string;
|
|
4275
4278
|
lineAxisTitle?: string;
|
|
@@ -4277,6 +4280,9 @@ declare interface GraphSettingsDataType {
|
|
|
4277
4280
|
naLabel?: string;
|
|
4278
4281
|
globeOffset?: [number, number];
|
|
4279
4282
|
polygonAltitude?: number;
|
|
4283
|
+
atmosphereAltitude?: number;
|
|
4284
|
+
globeCurvatureResolution?: number;
|
|
4285
|
+
lightColor?: string;
|
|
4280
4286
|
}
|
|
4281
4287
|
|
|
4282
4288
|
export declare function GraphTitle(props: Props_66): JSX.Element | null;
|
|
@@ -4503,12 +4509,6 @@ declare interface MapLegendDataType {
|
|
|
4503
4509
|
|
|
4504
4510
|
declare type MapProjectionTypes = 'mercator' | 'equalEarth' | 'naturalEarth' | 'orthographic' | 'albersUSA';
|
|
4505
4511
|
|
|
4506
|
-
declare interface MaterialDataType {
|
|
4507
|
-
color: string;
|
|
4508
|
-
opacity: number;
|
|
4509
|
-
transparent: boolean;
|
|
4510
|
-
}
|
|
4511
|
-
|
|
4512
4512
|
export declare function MultiGraphDashboard(props: Props_37): JSX.Element;
|
|
4513
4513
|
|
|
4514
4514
|
export declare function MultiGraphDashboardFromConfig(props: Props_46): JSX.Element;
|
|
@@ -5302,7 +5302,7 @@ declare interface Props_15 {
|
|
|
5302
5302
|
graphID?: string;
|
|
5303
5303
|
}
|
|
5304
5304
|
|
|
5305
|
-
declare interface Props_16 {
|
|
5305
|
+
declare interface Props_16 extends Partial<Omit<GlobeProps, 'backgroundColor'>> {
|
|
5306
5306
|
/** Array of data objects */
|
|
5307
5307
|
data: ChoroplethMapDataType[];
|
|
5308
5308
|
/** Title of the graph */
|
|
@@ -5348,7 +5348,7 @@ declare interface Props_16 {
|
|
|
5348
5348
|
/** Defines if the globe rotates automatically */
|
|
5349
5349
|
autoRotate?: number | boolean;
|
|
5350
5350
|
/** Defines the material property applied to the sphere of the globe */
|
|
5351
|
-
globeMaterial?: THREE.
|
|
5351
|
+
globeMaterial?: THREE.Material;
|
|
5352
5352
|
/** Defines the colo of the glow around the globe */
|
|
5353
5353
|
atmosphereColor?: string;
|
|
5354
5354
|
/** Defines if the globe can be zoomed when scrolled */
|
|
@@ -5365,6 +5365,12 @@ declare interface Props_16 {
|
|
|
5365
5365
|
categorical?: boolean;
|
|
5366
5366
|
/** Toggle visibility of color scale. */
|
|
5367
5367
|
showColorScale?: boolean;
|
|
5368
|
+
/** The max altitude of the atmosphere, in terms of globe radius units. */
|
|
5369
|
+
atmosphereAltitude?: number;
|
|
5370
|
+
/** Resolution in angular degrees of the sphere curvature. The finer the resolution, the more the globe is fragmented into smaller faces to approximate the spheric surface, at the cost of performance. */
|
|
5371
|
+
globeCurvatureResolution?: number;
|
|
5372
|
+
/** Defines the color of the light and atmosphere. */
|
|
5373
|
+
lightColor?: string;
|
|
5368
5374
|
/** Property in the property object in mapData geoJson object is used to match to the id in the data object */
|
|
5369
5375
|
mapProperty?: string;
|
|
5370
5376
|
/** Countries or regions to be highlighted */
|