├── .gitignore ├── .prettierrc ├── .storybook ├── preview.js └── main.js ├── src ├── stories │ ├── glb.d.ts │ ├── cylinder-smooth.glb │ ├── tile-game-room6.glb │ ├── viewport.css │ ├── orbitControls.d.ts │ ├── potpack.d.ts │ ├── DebugControls.tsx │ ├── Spinner.tsx │ ├── polyUV.stories.tsx │ ├── simple.stories.tsx │ ├── text.stories.tsx │ ├── DebugOverlayScene.tsx │ ├── smooth.stories.tsx │ ├── gltf.stories.tsx │ └── helvetiker.json ├── core │ ├── Lightmap.tsx │ ├── IrradianceSceneManager.tsx │ ├── IrradianceScene.tsx │ ├── WorkManager.tsx │ ├── IrradianceCompositor.tsx │ ├── IrradianceAtlasMapper.tsx │ ├── AutoUV2.tsx │ ├── IrradianceLightProbe.tsx │ └── IrradianceRenderer.tsx └── index.tsx ├── .editorconfig ├── tsconfig.json ├── package.json └── README.md /.gitignore: -------------------------------------------------------------------------------- 1 | /node_modules 2 | 3 | npm-debug.log* 4 | yarn-debug.log* 5 | yarn-error.log* 6 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 80, 3 | "singleQuote": true, 4 | "trailingComma": "none" 5 | } 6 | -------------------------------------------------------------------------------- /.storybook/preview.js: -------------------------------------------------------------------------------- 1 | export const parameters = { 2 | actions: { argTypesRegex: '^on[A-Z].*' } 3 | }; 4 | -------------------------------------------------------------------------------- /src/stories/glb.d.ts: -------------------------------------------------------------------------------- 1 | declare module '*.glb' { 2 | const url: string; 3 | export default url; 4 | } 5 | -------------------------------------------------------------------------------- /src/stories/cylinder-smooth.glb: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/unframework/threejs-lightmap-baker/HEAD/src/stories/cylinder-smooth.glb -------------------------------------------------------------------------------- /src/stories/tile-game-room6.glb: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/unframework/threejs-lightmap-baker/HEAD/src/stories/tile-game-room6.glb -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | [*] 2 | end_of_line = lf 3 | insert_final_newline = true 4 | indent_style = space 5 | indent_size = 2 6 | trim_trailing_whitespace = true 7 | -------------------------------------------------------------------------------- /src/stories/viewport.css: -------------------------------------------------------------------------------- 1 | html { 2 | height: 100%; 3 | } 4 | 5 | body { 6 | box-sizing: border-box; 7 | height: 100%; 8 | margin: 0; 9 | } 10 | 11 | #root { 12 | height: 100%; 13 | } 14 | -------------------------------------------------------------------------------- /src/stories/orbitControls.d.ts: -------------------------------------------------------------------------------- 1 | declare namespace JSX { 2 | import { ReactThreeFiber } from 'react-three-fiber'; 3 | 4 | interface IntrinsicElements { 5 | orbitControls: ReactThreeFiber.Object3DNode< 6 | OrbitControls, 7 | typeof OrbitControls 8 | >; 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /.storybook/main.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | stories: ['../src/**/*.stories.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'], 3 | addons: ['@storybook/addon-links', '@storybook/addon-essentials'], 4 | 5 | webpackFinal: async (config) => { 6 | config.module.rules.push({ 7 | test: /\.glb$/, 8 | use: ['file-loader'] 9 | }); 10 | 11 | return config; 12 | } 13 | }; 14 | -------------------------------------------------------------------------------- /src/stories/potpack.d.ts: -------------------------------------------------------------------------------- 1 | declare module 'potpack' { 2 | export interface PotPackItem { 3 | w: number; 4 | h: number; 5 | x: number; 6 | y: number; 7 | } 8 | 9 | export interface PotPackResult { 10 | w: number; 11 | h: number; 12 | fill: number; 13 | } 14 | 15 | function potpack(boxes: PotPackItem[]): PotPackResult; 16 | 17 | export default potpack; 18 | } 19 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "es6", 4 | "lib": ["dom", "dom.iterable", "esnext"], 5 | "allowJs": true, 6 | "skipLibCheck": true, 7 | "esModuleInterop": true, 8 | "allowSyntheticDefaultImports": true, 9 | "strict": true, 10 | "forceConsistentCasingInFileNames": true, 11 | "module": "esnext", 12 | "moduleResolution": "node", 13 | "resolveJsonModule": true, 14 | "isolatedModules": true, 15 | "noEmit": true, 16 | "jsx": "react" 17 | }, 18 | "include": ["src"] 19 | } 20 | -------------------------------------------------------------------------------- /src/stories/DebugControls.tsx: -------------------------------------------------------------------------------- 1 | import React, { useRef } from 'react'; 2 | import { useFrame, useThree, extend } from 'react-three-fiber'; 3 | import * as THREE from 'three'; 4 | import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls'; 5 | 6 | extend({ OrbitControls }); 7 | 8 | const DebugControls: React.FC = () => { 9 | const { camera, gl } = useThree(); 10 | const orbitControlsRef = useRef(); 11 | 12 | useFrame(() => { 13 | if (!orbitControlsRef.current) { 14 | return; 15 | } 16 | orbitControlsRef.current.update(); 17 | }); 18 | 19 | return ( 20 | 28 | ); 29 | }; 30 | 31 | export default DebugControls; 32 | -------------------------------------------------------------------------------- /src/stories/Spinner.tsx: -------------------------------------------------------------------------------- 1 | import React, { useState, useMemo } from 'react'; 2 | import { useResource, useFrame } from 'react-three-fiber'; 3 | import * as THREE from 'three'; 4 | 5 | const Spinner: React.FC = () => { 6 | const meshRef = useResource(); 7 | 8 | useFrame(({ clock }) => { 9 | // @todo meshRef.current can be undefined on unmount, fix upstream 10 | if (meshRef.current && meshRef.current.rotation.isEuler) { 11 | meshRef.current.rotation.x = Math.sin(clock.elapsedTime * 0.2); 12 | meshRef.current.rotation.y = Math.sin(clock.elapsedTime * 0.5); 13 | meshRef.current.rotation.z = Math.sin(clock.elapsedTime); 14 | 15 | const initialZoom = Math.sin(Math.min(clock.elapsedTime, Math.PI / 2)); 16 | meshRef.current.scale.x = meshRef.current.scale.y = meshRef.current.scale.z = 17 | (1 + 0.2 * Math.sin(clock.elapsedTime * 1.5)) * initialZoom; 18 | } 19 | }); 20 | 21 | return ( 22 | <> 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | ); 31 | }; 32 | 33 | export default Spinner; 34 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "threejs-lightmap-baker", 3 | "description": "Experimental lightmap baker built on ThreeJS and react-three-fiber (r3f)", 4 | "version": "0.1.0", 5 | "private": true, 6 | "dependencies": { 7 | "@types/react": "^16.9.0", 8 | "@types/react-dom": "^16.9.0", 9 | "potpack": "^1.0.1", 10 | "react": "^17.0.0", 11 | "react-dom": "^17.0.0", 12 | "react-render-prop": "^0.0.1", 13 | "react-three-fiber": "^5.3.1", 14 | "three": "^0.121.0", 15 | "typescript": "^3.9.0" 16 | }, 17 | "scripts": { 18 | "storybook": "start-storybook -p 6006 -s public --no-dll", 19 | "build-storybook": "build-storybook -s public --no-dll" 20 | }, 21 | "eslintConfig": { 22 | "extends": "react-app" 23 | }, 24 | "browserslist": { 25 | "production": [ 26 | ">0.2%", 27 | "not dead", 28 | "not op_mini all" 29 | ], 30 | "development": [ 31 | "last 1 chrome version", 32 | "last 1 firefox version", 33 | "last 1 safari version" 34 | ] 35 | }, 36 | "devDependencies": { 37 | "@babel/core": "^7.12.3", 38 | "@storybook/addon-actions": "^6.0.28", 39 | "@storybook/addon-essentials": "^6.0.28", 40 | "@storybook/addon-links": "^6.0.28", 41 | "@storybook/react": "^6.0.28", 42 | "babel-loader": "^8.2.1", 43 | "prettier": "^2.0.5", 44 | "react-is": "^16.8.0" 45 | } 46 | } 47 | -------------------------------------------------------------------------------- /src/stories/polyUV.stories.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { Story, Meta } from '@storybook/react'; 3 | import { Canvas } from 'react-three-fiber'; 4 | import * as THREE from 'three'; 5 | 6 | import { AutoUV2Provider, AutoUV2 } from '../core/AutoUV2'; 7 | import Lightmap from '../core/Lightmap'; 8 | import Spinner from './Spinner'; 9 | import DebugControls from './DebugControls'; 10 | import { DebugOverlayRenderer, DebugOverlayWidgets } from './DebugOverlayScene'; 11 | 12 | import './viewport.css'; 13 | 14 | export default { 15 | title: 'Cylinder scene (polygon UV)' 16 | } as Meta; 17 | 18 | export const Main: Story = () => ( 19 | { 24 | gl.toneMapping = THREE.ACESFilmicToneMapping; 25 | gl.toneMappingExposure = 0.9; 26 | 27 | gl.outputEncoding = THREE.sRGBEncoding; 28 | }} 29 | > 30 | 31 | }> 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | ); 60 | -------------------------------------------------------------------------------- /src/core/Lightmap.tsx: -------------------------------------------------------------------------------- 1 | /* 2 | * Copyright (c) 2021-now Nick Matantsev 3 | * Licensed under the MIT license 4 | */ 5 | 6 | import React, { useState, useMemo } from 'react'; 7 | import * as THREE from 'three'; 8 | 9 | import IrradianceSceneManager from './IrradianceSceneManager'; 10 | import WorkManager from './WorkManager'; 11 | import IrradianceRenderer from './IrradianceRenderer'; 12 | import IrradianceCompositor from './IrradianceCompositor'; 13 | import IrradianceScene from './IrradianceScene'; 14 | 15 | export interface LightmapProps { 16 | lightMapWidth: number; 17 | lightMapHeight: number; 18 | textureFilter?: THREE.TextureFilter; 19 | } 20 | 21 | const LocalSuspender: React.FC = () => { 22 | // always suspend 23 | const completionPromise = useMemo(() => new Promise(() => undefined), []); 24 | throw completionPromise; 25 | }; 26 | 27 | const Lightmap = React.forwardRef< 28 | THREE.Scene, 29 | React.PropsWithChildren 30 | >(({ lightMapWidth, lightMapHeight, textureFilter, children }, sceneRef) => { 31 | const [isComplete, setIsComplete] = useState(false); 32 | 33 | return ( 34 | 39 | 40 | {(workbench, startWorkbench) => ( 41 | <> 42 | 43 | {workbench && !isComplete && ( 44 | { 47 | setIsComplete(true); 48 | }} 49 | /> 50 | )} 51 | 52 | 53 | 54 | {children} 55 | 56 | 57 | )} 58 | 59 | 60 | {!isComplete && } 61 | 62 | ); 63 | }); 64 | 65 | export default Lightmap; 66 | -------------------------------------------------------------------------------- /src/index.tsx: -------------------------------------------------------------------------------- 1 | /** 2 | * 3 | * Hi! This file can run inside CodeSandbox or a similar live-editing environment. 4 | * For local development, try the storybook files under src/stories. 5 | * 6 | */ 7 | 8 | import React from 'react'; 9 | import ReactDOM from 'react-dom'; 10 | import { Canvas } from 'react-three-fiber'; 11 | import * as THREE from 'three'; 12 | 13 | import { AutoUV2Provider, AutoUV2 } from './core/AutoUV2'; 14 | import Lightmap from './core/Lightmap'; 15 | import Spinner from './stories/Spinner'; 16 | import DebugControls from './stories/DebugControls'; 17 | 18 | import './stories/viewport.css'; 19 | 20 | import helvetikerFontData from './stories/helvetiker.json'; 21 | const helvetikerFont = new THREE.Font(helvetikerFontData); 22 | 23 | /** 24 | * Try changing this! 25 | */ 26 | const DISPLAY_TEXT = 'Light!'; 27 | 28 | ReactDOM.render( 29 | { 34 | gl.toneMapping = THREE.ACESFilmicToneMapping; 35 | gl.toneMappingExposure = 0.9; 36 | 37 | gl.outputEncoding = THREE.sRGBEncoding; 38 | }} 39 | > 40 | }> 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | , 73 | document.getElementById('root') 74 | ); 75 | -------------------------------------------------------------------------------- /src/stories/simple.stories.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { Story, Meta } from '@storybook/react'; 3 | import { Canvas } from 'react-three-fiber'; 4 | import * as THREE from 'three'; 5 | 6 | import { AutoUV2Provider, AutoUV2 } from '../core/AutoUV2'; 7 | import Lightmap from '../core/Lightmap'; 8 | import Spinner from './Spinner'; 9 | import DebugControls from './DebugControls'; 10 | import { DebugOverlayRenderer, DebugOverlayWidgets } from './DebugOverlayScene'; 11 | 12 | import './viewport.css'; 13 | 14 | export default { 15 | title: 'Simple scene' 16 | } as Meta; 17 | 18 | export const Main: Story = () => ( 19 | { 24 | gl.toneMapping = THREE.ACESFilmicToneMapping; 25 | gl.toneMappingExposure = 0.9; 26 | 27 | gl.outputEncoding = THREE.sRGBEncoding; 28 | }} 29 | > 30 | 31 | }> 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | ); 78 | -------------------------------------------------------------------------------- /src/stories/text.stories.tsx: -------------------------------------------------------------------------------- 1 | import React, { useEffect } from 'react'; 2 | import { Story, Meta } from '@storybook/react'; 3 | import { Canvas } from 'react-three-fiber'; 4 | import * as THREE from 'three'; 5 | 6 | import { AutoUV2Provider, AutoUV2 } from '../core/AutoUV2'; 7 | import Lightmap from '../core/Lightmap'; 8 | import Spinner from './Spinner'; 9 | import DebugControls from './DebugControls'; 10 | import { DebugOverlayRenderer, DebugOverlayWidgets } from './DebugOverlayScene'; 11 | 12 | import './viewport.css'; 13 | 14 | import helvetikerFontData from './helvetiker.json'; 15 | const helvetikerFont = new THREE.Font(helvetikerFontData); 16 | 17 | export default { 18 | title: 'Text mesh scene' 19 | } as Meta; 20 | 21 | const FontLoader: React.FC = () => { 22 | useEffect(() => {}, []); 23 | 24 | return null; 25 | }; 26 | 27 | export const Main: Story = () => ( 28 | { 33 | gl.toneMapping = THREE.ACESFilmicToneMapping; 34 | gl.toneMappingExposure = 0.9; 35 | 36 | gl.outputEncoding = THREE.sRGBEncoding; 37 | }} 38 | > 39 | 40 | 41 | 42 | }> 43 | 44 | 45 | 46 | 51 | 52 | 53 | 54 | 55 | 67 | 68 | 69 | 70 | 71 | 72 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | ); 89 | -------------------------------------------------------------------------------- /src/core/IrradianceSceneManager.tsx: -------------------------------------------------------------------------------- 1 | /* 2 | * Copyright (c) 2020-now Nick Matantsev 3 | * Licensed under the MIT license 4 | */ 5 | 6 | import React, { 7 | useState, 8 | useEffect, 9 | useMemo, 10 | useCallback, 11 | useContext, 12 | useRef 13 | } from 'react'; 14 | import * as THREE from 'three'; 15 | 16 | import { 17 | useIrradianceTexture, 18 | useIrradianceMapSize 19 | } from './IrradianceCompositor'; 20 | import IrradianceAtlasMapper, { 21 | Workbench, 22 | AtlasMap 23 | } from './IrradianceAtlasMapper'; 24 | 25 | export const IrradianceDebugContext = React.createContext<{ 26 | atlasTexture: THREE.Texture; 27 | } | null>(null); 28 | 29 | const IrradianceSceneManager: React.FC<{ 30 | children: ( 31 | workbench: Workbench | null, 32 | startWorkbench: (scene: THREE.Scene) => void 33 | ) => React.ReactNode; 34 | }> = ({ children }) => { 35 | const lightMap = useIrradianceTexture(); 36 | const [lightMapWidth, lightMapHeight] = useIrradianceMapSize(); 37 | 38 | // read once 39 | const lightMapWidthRef = useRef(lightMapWidth); 40 | const lightMapHeightRef = useRef(lightMapHeight); 41 | 42 | // basic snapshot triggered by start handler 43 | const [workbenchBasics, setWorkbenchBasics] = useState<{ 44 | id: number; // for refresh 45 | scene: THREE.Scene; 46 | } | null>(null); 47 | 48 | const startHandler = useCallback((scene: THREE.Scene) => { 49 | // save a snapshot copy of staging data 50 | setWorkbenchBasics((prev) => ({ 51 | id: prev ? prev.id + 1 : 1, 52 | scene 53 | })); 54 | }, []); 55 | 56 | // full workbench with atlas map 57 | const [workbench, setWorkbench] = useState(null); 58 | 59 | const atlasMapHandler = useCallback( 60 | (atlasMap: AtlasMap) => { 61 | if (!workbenchBasics) { 62 | throw new Error('unexpected early call'); 63 | } 64 | 65 | // save final copy of workbench 66 | setWorkbench({ 67 | id: workbenchBasics.id, 68 | lightScene: workbenchBasics.scene, 69 | atlasMap 70 | }); 71 | }, 72 | [workbenchBasics] 73 | ); 74 | 75 | const debugInfo = useMemo( 76 | () => (workbench ? { atlasTexture: workbench.atlasMap.texture } : null), 77 | [workbench] 78 | ); 79 | 80 | return ( 81 | 82 | {children(workbench, startHandler)} 83 | 84 | {workbenchBasics && ( 85 | 93 | )} 94 | 95 | ); 96 | }; 97 | 98 | export default IrradianceSceneManager; 99 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ## THIS REPO HAS MOVED 2 | 3 | > All development has moved to https://github.com/pmndrs/react-three-lightmap. Please see that package (published as [@react-three/lightmap](https://www.npmjs.com/package/@react-three/lightmap)) for newer code and documentation. 4 | 5 | # Experimental Lightmap Baker for ThreeJS + react-three-fiber 6 | 7 | ![test screenshot of lightmap generator](https://unframework.files.wordpress.com/2020/06/ao-bake-test-scene2wide.png?w=1140&h=555) 8 | 9 | Quick and cheap global illumination lightmap baking in ThreeJS + react-three-fiber. 10 | 11 | [Live editable sandbox](https://codesandbox.io/s/github/unframework/threejs-lightmap-baker). 12 | 13 | See screenshots and a brief description here: https://unframework.com/portfolio/simple-global-illumination-lightmap-baker-for-threejs/. 14 | 15 | To try the experimental lightmap display locally, do this: 16 | 17 | ```sh 18 | git clone git@github.com:unframework/threejs-lightmap-baker.git 19 | cd threejs-lightmap-baker 20 | yarn 21 | yarn storybook 22 | ``` 23 | 24 | ## Internal Pipeline Overview 25 | 26 | The developer defines a scene the same way they normally would, but adds IrradianceSurface and IrradianceLight markers under the meshes and lights that should be participating in the lighting process. The lightmap that is produced by the baker can then simply be attached to scene materials via the `lightMap` prop, as usual. 27 | 28 | The following is a brief overview of the renderer architecture. 29 | 30 | The data flows as follows: 31 | 32 | ``` 33 | mesh/light definition in scene (with surface marker) 34 | -> surface manager 35 | -> atlas mapper 36 | -> lightmap renderer 37 | -> lightmap compositor (dummy passthrough for now) 38 | -> final lightmap 39 | -> mesh material in scene 40 | ``` 41 | 42 | The surface manager has awareness of all the meshes/lights that affect the lightmap. Before baking can begin, there is an extra step: the atlas mapper has to produce a lookup texture that links every future lightmap texel with the 3D position on a mesh triangle that it corresponds to (based on `uv2` information from meshes). 43 | 44 | Once that lookup texture is built, baking (lightmap rendering) works in passes. It exposes the result texture at all times, so it is possible to see the lightmap being filled in, texel by texel. 45 | 46 | ~~Because there might be more than one lightmap factors (e.g. dynamic light intensity arrangements), there is a final compositor step that combines the output of multiple bakers (one per factor) into the final lightmap.~~ The lightmap is passed down to the scene via React context so that it can be easily accessed inside sub-components, etc. 47 | 48 | Baking is an intensive process and there could be multiple lightmaps being baked at once, which may overload the GPU. There is a top-level "work manager" that queues up and schedules work snippets from one or more lightmap bakers - a little bit of work is done per each frame, so that the overall app remains responsive and can render intermediate results. 49 | -------------------------------------------------------------------------------- /src/core/IrradianceScene.tsx: -------------------------------------------------------------------------------- 1 | /* 2 | * Copyright (c) 2020-now Nick Matantsev 3 | * Licensed under the MIT license 4 | */ 5 | 6 | import React, { useRef, useMemo, useCallback, useEffect } from 'react'; 7 | import { useResource } from 'react-three-fiber'; 8 | import * as THREE from 'three'; 9 | 10 | const FallbackListener: React.FC<{ 11 | onStarted: () => void; 12 | onFinished: () => void; 13 | }> = ({ onStarted, onFinished }) => { 14 | const onStartedRef = useRef(onStarted); 15 | onStartedRef.current = onStarted; 16 | const onFinishedRef = useRef(onFinished); 17 | onFinishedRef.current = onFinished; 18 | 19 | useEffect(() => { 20 | onStartedRef.current(); 21 | 22 | return () => { 23 | onFinishedRef.current(); 24 | }; 25 | }, []); 26 | 27 | // re-throw our own suspense promise 28 | // (no need to ever resolve it because this gets unmounted anyway) 29 | // NOTE: throwing directly from inside this component prevents useEffect from working, 30 | // hence the nested suspender stub 31 | const LocalSuspender = useMemo(() => { 32 | const promise = new Promise(() => undefined); 33 | 34 | return () => { 35 | throw promise; 36 | }; 37 | }, []); 38 | return ; 39 | }; 40 | 41 | const IrradianceScene = React.forwardRef< 42 | THREE.Scene | null, 43 | React.PropsWithChildren<{ onReady: (scene: THREE.Scene) => void }> 44 | >(({ onReady, children }, sceneRef) => { 45 | // local ref merge 46 | const localSceneRef = useRef(); 47 | const mergedRefHandler = useCallback((instance: THREE.Scene | null) => { 48 | localSceneRef.current = instance || undefined; 49 | 50 | if (typeof sceneRef === 'function') { 51 | sceneRef(instance); 52 | } else if (sceneRef) { 53 | sceneRef.current = instance; 54 | } 55 | }, []); 56 | 57 | // by default, set up kick-off for next tick 58 | // (but this is prevented if suspense is thrown from children) 59 | const initialTimeoutId = useMemo( 60 | () => 61 | setTimeout(() => { 62 | if (localSceneRef.current) { 63 | onReady(localSceneRef.current); 64 | } 65 | }, 0), 66 | [] 67 | ); 68 | 69 | // wrap scene in an extra group object 70 | // so that when this is hidden during suspension only the wrapper has visible=false 71 | return ( 72 | { 76 | // prevent default starter logic 77 | clearTimeout(initialTimeoutId); 78 | }} 79 | onFinished={() => { 80 | // issue kick-off once suspense is resolved 81 | if (localSceneRef.current) { 82 | onReady(localSceneRef.current); 83 | } 84 | }} 85 | /> 86 | } 87 | > 88 | 89 | 90 | {children} 91 | 92 | 93 | 94 | ); 95 | }); 96 | 97 | export default IrradianceScene; 98 | -------------------------------------------------------------------------------- /src/stories/DebugOverlayScene.tsx: -------------------------------------------------------------------------------- 1 | import React, { useMemo, useContext } from 'react'; 2 | import { 3 | useResource, 4 | useFrame, 5 | useThree, 6 | createPortal 7 | } from 'react-three-fiber'; 8 | import * as THREE from 'three'; 9 | 10 | import { useIrradianceTexture } from '../core/IrradianceCompositor'; 11 | import { IrradianceDebugContext } from '../core/IrradianceSceneManager'; 12 | import { PROBE_BATCH_COUNT } from '../core/IrradianceLightProbe'; 13 | 14 | const DebugOverlayContext = React.createContext(null); 15 | 16 | // set up a special render loop with a debug overlay for various widgets (see below) 17 | export const DebugOverlayRenderer: React.FC = ({ children }) => { 18 | const mainSceneRef = useResource(); 19 | const debugSceneRef = useResource(); 20 | 21 | const { size } = useThree(); 22 | const debugCamera = useMemo(() => { 23 | // top-left corner is (0, 100), top-right is (100, 100) 24 | const aspect = size.height / size.width; 25 | return new THREE.OrthographicCamera(0, 100, 100, 100 * (1 - aspect), -1, 1); 26 | }, [size]); 27 | 28 | useFrame(({ gl, camera }) => { 29 | gl.render(mainSceneRef.current, camera); 30 | }, 20); 31 | 32 | useFrame(({ gl }) => { 33 | gl.autoClear = false; 34 | gl.clearDepth(); 35 | gl.render(debugSceneRef.current, debugCamera); 36 | gl.autoClear = true; 37 | }, 30); 38 | 39 | return ( 40 | <> 41 | 42 | 43 | {children} 44 | 45 | 46 | 47 | {/* portal container for debug widgets */} 48 | 49 | 50 | ); 51 | }; 52 | 53 | // show provided textures as widgets on debug overlay (via createPortal) 54 | export const DebugOverlayWidgets: React.FC = React.memo(() => { 55 | const debugScene = useContext(DebugOverlayContext); 56 | const debugInfo = useContext(IrradianceDebugContext); 57 | 58 | const outputTexture = useIrradianceTexture(); 59 | 60 | if (!debugScene || !debugInfo) { 61 | return null; 62 | } 63 | 64 | const { atlasTexture } = debugInfo; 65 | 66 | return ( 67 | <> 68 | {createPortal( 69 | <> 70 | {outputTexture && ( 71 | 72 | 73 | 78 | 79 | )} 80 | 81 | {atlasTexture && ( 82 | 83 | 84 | 89 | 90 | )} 91 | , 92 | debugScene 93 | )} 94 | 95 | ); 96 | }); 97 | -------------------------------------------------------------------------------- /src/stories/smooth.stories.tsx: -------------------------------------------------------------------------------- 1 | import React, { useState, useMemo, useEffect, useRef } from 'react'; 2 | import { Story, Meta } from '@storybook/react'; 3 | import { useLoader, Canvas } from 'react-three-fiber'; 4 | import * as THREE from 'three'; 5 | import { GLTFLoader, GLTF } from 'three/examples/jsm/loaders/GLTFLoader'; 6 | 7 | import Lightmap from '../core/Lightmap'; 8 | import Spinner from './Spinner'; 9 | import DebugControls from './DebugControls'; 10 | import { DebugOverlayRenderer, DebugOverlayWidgets } from './DebugOverlayScene'; 11 | 12 | import './viewport.css'; 13 | import sceneUrl from './cylinder-smooth.glb'; 14 | 15 | export default { 16 | title: 'Smooth normals scene' 17 | } as Meta; 18 | 19 | const MainSceneContents: React.FC = () => { 20 | const loadedData = useLoader(GLTFLoader, sceneUrl); 21 | 22 | const loadedMeshList = useMemo(() => { 23 | const meshes: THREE.Mesh[] = []; 24 | 25 | loadedData.scene.traverse((object) => { 26 | if (!(object instanceof THREE.Mesh)) { 27 | return; 28 | } 29 | 30 | // convert glTF's standard material into Lambert 31 | if (object.material) { 32 | const stdMat = object.material as THREE.MeshStandardMaterial; 33 | 34 | if (stdMat.map) { 35 | stdMat.map.magFilter = THREE.NearestFilter; 36 | } 37 | 38 | if (stdMat.emissiveMap) { 39 | stdMat.emissiveMap.magFilter = THREE.NearestFilter; 40 | } 41 | 42 | object.material = new THREE.MeshLambertMaterial({ 43 | color: stdMat.color, 44 | map: stdMat.map, 45 | emissive: stdMat.emissive, 46 | emissiveMap: stdMat.emissiveMap, 47 | emissiveIntensity: stdMat.emissiveIntensity 48 | }); 49 | 50 | // always cast shadow, but only albedo materials receive it 51 | object.castShadow = true; 52 | object.receiveShadow = true; 53 | } 54 | 55 | meshes.push(object); 56 | }); 57 | 58 | return meshes; 59 | }, [loadedData]); 60 | 61 | return ( 62 | <> 63 | 64 | 65 | 70 | 71 | 72 | {loadedMeshList.map((mesh) => ( 73 | 74 | ))} 75 | 76 | ); 77 | }; 78 | 79 | export const Main: Story = () => ( 80 | { 85 | gl.toneMapping = THREE.ACESFilmicToneMapping; 86 | gl.toneMappingExposure = 0.9; 87 | 88 | gl.outputEncoding = THREE.sRGBEncoding; 89 | }} 90 | > 91 | 92 | }> 93 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | ); 108 | -------------------------------------------------------------------------------- /src/core/WorkManager.tsx: -------------------------------------------------------------------------------- 1 | /* 2 | * Copyright (c) 2020-now Nick Matantsev 3 | * Licensed under the MIT license 4 | */ 5 | 6 | import React, { 7 | useEffect, 8 | useState, 9 | useMemo, 10 | useCallback, 11 | useRef 12 | } from 'react'; 13 | import { useFrame } from 'react-three-fiber'; 14 | 15 | const WORK_PER_FRAME = 2; 16 | 17 | type WorkCallback = (gl: THREE.WebGLRenderer) => void; 18 | type WorkManagerHook = (callback: WorkCallback | null) => void; 19 | export const WorkManagerContext = React.createContext( 20 | null 21 | ); 22 | 23 | interface RendererJobInfo { 24 | id: number; 25 | callbackRef: React.MutableRefObject; 26 | } 27 | 28 | // this runs inside the renderer hook instance 29 | function useJobInstance( 30 | jobCountRef: React.MutableRefObject, 31 | setJobs: React.Dispatch>, 32 | callback: WorkCallback | null 33 | ) { 34 | // unique job ID 35 | const jobId = useMemo(() => { 36 | // generate new job ID on mount 37 | jobCountRef.current += 1; 38 | return jobCountRef.current; 39 | }, [jobCountRef]); 40 | 41 | // wrap latest callback in stable ref 42 | const callbackRef = useRef(callback); 43 | callbackRef.current = callback; 44 | 45 | // add or update job object (preserving the order) 46 | useEffect(() => { 47 | const jobInfo = { 48 | id: jobId, 49 | callbackRef 50 | }; 51 | 52 | setJobs((prev) => { 53 | const newJobs = [...prev]; 54 | 55 | const jobIndex = prev.findIndex((job) => job.id === jobId); 56 | if (jobIndex === -1) { 57 | newJobs.push(jobInfo); 58 | } else { 59 | newJobs[jobIndex] = jobInfo; 60 | } 61 | 62 | return newJobs; 63 | }); 64 | }, [jobId, setJobs]); 65 | 66 | // clean up on unmount 67 | useEffect(() => { 68 | return () => { 69 | // keep all jobs that do not have our ID 70 | setJobs((prev) => prev.filter((info) => info.id !== jobId)); 71 | }; 72 | }, [jobId, setJobs]); 73 | } 74 | 75 | // this simply acts as a central spot to schedule per-frame work 76 | // (allowing eventual possibility of e.g. multiple unrelated renderers co-existing within a single central work manager) 77 | const WorkManager: React.FC = ({ children }) => { 78 | const jobCountRef = useRef(0); 79 | const [jobs, setJobs] = useState([]); 80 | 81 | const hook = useCallback((callback) => { 82 | useJobInstance(jobCountRef, setJobs, callback); // eslint-disable-line react-hooks/rules-of-hooks 83 | }, []); 84 | 85 | // actual per-frame work invocation 86 | useFrame(({ gl }) => { 87 | // get active job, if any 88 | const activeJob = jobs.find((job) => !!job.callbackRef.current); 89 | 90 | // check if there is nothing to do 91 | if (!activeJob) { 92 | return; 93 | } 94 | 95 | // invoke work callback 96 | for (let i = 0; i < WORK_PER_FRAME; i += 1) { 97 | // check if callback is still around (might go away mid-batch) 98 | const callback = activeJob.callbackRef.current; 99 | 100 | if (!callback) { 101 | return; 102 | } 103 | 104 | callback(gl); 105 | } 106 | }); 107 | 108 | return ( 109 | <> 110 | 111 | {children} 112 | 113 | 114 | ); 115 | }; 116 | 117 | export default WorkManager; 118 | -------------------------------------------------------------------------------- /src/stories/gltf.stories.tsx: -------------------------------------------------------------------------------- 1 | import React, { useState, useMemo, useEffect, useRef } from 'react'; 2 | import { Story, Meta } from '@storybook/react'; 3 | import { useLoader, Canvas } from 'react-three-fiber'; 4 | import * as THREE from 'three'; 5 | import { GLTFLoader, GLTF } from 'three/examples/jsm/loaders/GLTFLoader'; 6 | 7 | import Lightmap from '../core/Lightmap'; 8 | import Spinner from './Spinner'; 9 | import DebugControls from './DebugControls'; 10 | import { DebugOverlayRenderer, DebugOverlayWidgets } from './DebugOverlayScene'; 11 | 12 | import './viewport.css'; 13 | import sceneUrl from './tile-game-room6.glb'; 14 | 15 | export default { 16 | title: 'glTF scene' 17 | } as Meta; 18 | 19 | const MainSceneContents: React.FC = () => { 20 | // data loading 21 | const loadedData = useLoader(GLTFLoader, sceneUrl); 22 | 23 | const { loadedMeshList, loadedLightList } = useMemo(() => { 24 | const meshes: THREE.Mesh[] = []; 25 | const lights: THREE.DirectionalLight[] = []; 26 | 27 | if (loadedData) { 28 | loadedData.scene.traverse((object) => { 29 | // glTF import is still not great with lights, so we improvise 30 | if (object.name.includes('Light')) { 31 | const light = new THREE.DirectionalLight(); 32 | light.intensity = object.scale.z; 33 | 34 | light.castShadow = true; 35 | light.shadow.camera.left = -object.scale.x; 36 | light.shadow.camera.right = object.scale.x; 37 | light.shadow.camera.top = object.scale.y; 38 | light.shadow.camera.bottom = -object.scale.y; 39 | 40 | light.position.copy(object.position); 41 | 42 | const target = new THREE.Object3D(); 43 | target.position.set(0, 0, -1); 44 | target.position.applyEuler(object.rotation); 45 | target.position.add(light.position); 46 | 47 | light.target = target; 48 | 49 | lights.push(light); 50 | return; 51 | } 52 | 53 | if (!(object instanceof THREE.Mesh)) { 54 | return; 55 | } 56 | 57 | // convert glTF's standard material into Lambert 58 | if (object.material) { 59 | const stdMat = object.material as THREE.MeshStandardMaterial; 60 | 61 | if (stdMat.map) { 62 | stdMat.map.magFilter = THREE.NearestFilter; 63 | } 64 | 65 | if (stdMat.emissiveMap) { 66 | stdMat.emissiveMap.magFilter = THREE.NearestFilter; 67 | } 68 | 69 | object.material = new THREE.MeshPhongMaterial({ 70 | color: stdMat.color, 71 | map: stdMat.map, 72 | emissive: stdMat.emissive, 73 | emissiveMap: stdMat.emissiveMap, 74 | emissiveIntensity: stdMat.emissiveIntensity 75 | }); 76 | 77 | // always cast shadow, but only albedo materials receive it 78 | object.castShadow = true; 79 | 80 | if (stdMat.map) { 81 | object.receiveShadow = true; 82 | } 83 | 84 | // special case for outer sunlight cover 85 | if (object.name === 'Cover') { 86 | object.material.depthWrite = false; 87 | object.material.colorWrite = false; 88 | } 89 | } 90 | 91 | meshes.push(object); 92 | }); 93 | } 94 | 95 | return { 96 | loadedMeshList: meshes, 97 | loadedLightList: lights 98 | }; 99 | }, [loadedData]); 100 | 101 | const baseMesh = loadedMeshList.find((item) => item.name === 'Base'); 102 | const coverMesh = loadedMeshList.find((item) => item.name === 'Cover'); 103 | 104 | return ( 105 | <> 106 | 107 | 108 | 109 | 110 | 111 | {loadedLightList.map((light) => ( 112 | 113 | 114 | 115 | 116 | ))} 117 | 118 | {baseMesh && } 119 | 120 | {coverMesh && } 121 | 122 | 129 | 130 | ); 131 | }; 132 | 133 | export const Main: Story = () => ( 134 | { 139 | gl.toneMapping = THREE.ACESFilmicToneMapping; 140 | gl.toneMappingExposure = 0.9; 141 | 142 | gl.outputEncoding = THREE.sRGBEncoding; 143 | }} 144 | > 145 | 146 | }> 147 | 152 | 153 | 154 | 155 | 156 | 157 | 158 | 159 | 160 | 161 | ); 162 | -------------------------------------------------------------------------------- /src/core/IrradianceCompositor.tsx: -------------------------------------------------------------------------------- 1 | /* 2 | * Copyright (c) 2020-now Nick Matantsev 3 | * Licensed under the MIT license 4 | */ 5 | 6 | import React, { useState, useMemo, useEffect, useContext, useRef } from 'react'; 7 | import { useFrame } from 'react-three-fiber'; 8 | import * as THREE from 'three'; 9 | 10 | const IrradianceRendererContext = React.createContext<{ 11 | width: number; 12 | height: number; 13 | 14 | baseTexture: THREE.Texture; 15 | baseArray: Float32Array; 16 | } | null>(null); 17 | 18 | export function useIrradianceMapSize(): [number, number] { 19 | const ctx = useContext(IrradianceRendererContext); 20 | if (!ctx) { 21 | throw new Error('must be placed under irradiance texture compositor'); 22 | } 23 | 24 | return [ctx.width, ctx.height]; 25 | } 26 | 27 | export function useIrradianceRendererData(): [THREE.Texture, Float32Array] { 28 | const ctx = useContext(IrradianceRendererContext); 29 | if (!ctx) { 30 | throw new Error('must be placed under irradiance texture compositor'); 31 | } 32 | 33 | const result = useMemo<[THREE.Texture, Float32Array]>(() => { 34 | return [ctx.baseTexture, ctx.baseArray]; 35 | }, [ctx]); 36 | 37 | return result; 38 | } 39 | 40 | const IrradianceTextureContext = React.createContext( 41 | null 42 | ); 43 | 44 | export function useIrradianceTexture(): THREE.Texture { 45 | const texture = useContext(IrradianceTextureContext); 46 | 47 | if (!texture) { 48 | throw new Error('must be placed under irradiance texture compositor'); 49 | } 50 | 51 | return texture; 52 | } 53 | 54 | const LIGHTMAP_BG_COLOR = new THREE.Color('#000000'); // blank must be all zeroes (as one would expect) 55 | 56 | const tmpPrevClearColor = new THREE.Color(); 57 | 58 | function createRendererTexture( 59 | atlasWidth: number, 60 | atlasHeight: number, 61 | textureFilter: THREE.TextureFilter 62 | ): [THREE.Texture, Float32Array] { 63 | const atlasSize = atlasWidth * atlasHeight; 64 | const data = new Float32Array(4 * atlasSize); 65 | 66 | // not filling texture with test pattern because this goes right into light probe computation 67 | const texture = new THREE.DataTexture( 68 | data, 69 | atlasWidth, 70 | atlasHeight, 71 | THREE.RGBAFormat, 72 | THREE.FloatType 73 | ); 74 | 75 | // set desired texture filter (no mipmaps supported due to the nature of lightmaps) 76 | texture.magFilter = textureFilter; 77 | texture.minFilter = textureFilter; 78 | texture.generateMipmaps = false; 79 | 80 | return [texture, data]; 81 | } 82 | 83 | const CompositorLayerMaterial: React.FC<{ 84 | map: THREE.Texture; 85 | materialRef: React.MutableRefObject; 86 | }> = ({ map, materialRef }) => { 87 | const material = useMemo( 88 | () => 89 | new THREE.ShaderMaterial({ 90 | uniforms: { 91 | map: { value: null }, 92 | multiplier: { value: 0 } 93 | }, 94 | 95 | vertexShader: ` 96 | varying vec2 vUV; 97 | 98 | void main() { 99 | vUV = uv; 100 | 101 | vec4 worldPosition = modelMatrix * vec4( position, 1.0 ); 102 | gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); 103 | } 104 | `, 105 | fragmentShader: ` 106 | uniform sampler2D map; 107 | uniform float multiplier; 108 | varying vec2 vUV; 109 | 110 | void main() { 111 | gl_FragColor = vec4(texture2D(map, vUV).rgb * multiplier, 1.0); 112 | } 113 | `, 114 | 115 | blending: THREE.AdditiveBlending 116 | }), 117 | [] 118 | ); 119 | 120 | // disposable managed object 121 | return ( 122 | 128 | ); 129 | }; 130 | 131 | export type LightMapConsumerChild = ( 132 | outputLightMap: THREE.Texture 133 | ) => React.ReactNode; 134 | 135 | // this is called a "compositor" but for now it is a simple "provider" 136 | // (there used to be support for mixing several several lightmaps together dynamically, 137 | // taken out temporarily as an esoteric feature) 138 | export default function IrradianceCompositor({ 139 | lightMapWidth, 140 | lightMapHeight, 141 | textureFilter, 142 | children 143 | }: React.PropsWithChildren<{ 144 | lightMapWidth: number; 145 | lightMapHeight: number; 146 | textureFilter?: THREE.TextureFilter; 147 | children: LightMapConsumerChild | React.ReactNode; 148 | }>): React.ReactElement { 149 | // read value only on first render 150 | const widthRef = useRef(lightMapWidth); 151 | const heightRef = useRef(lightMapHeight); 152 | const textureFilterRef = useRef(textureFilter); 153 | 154 | const orthoSceneRef = useRef(); 155 | 156 | // incoming base rendered texture (filled elsewhere) 157 | const [baseTexture, baseArray] = useMemo( 158 | () => 159 | createRendererTexture( 160 | widthRef.current, 161 | heightRef.current, 162 | textureFilterRef.current || THREE.LinearFilter 163 | ), 164 | [] 165 | ); 166 | useEffect( 167 | () => () => { 168 | baseTexture.dispose(); 169 | }, 170 | [baseTexture] 171 | ); 172 | 173 | // info for renderer instances 174 | const rendererDataCtx = useMemo( 175 | () => ({ 176 | width: widthRef.current, 177 | height: heightRef.current, 178 | baseTexture, 179 | baseArray 180 | }), 181 | [baseTexture, baseArray] 182 | ); 183 | 184 | return ( 185 | 186 | 187 | {typeof children === 'function' 188 | ? (children as LightMapConsumerChild)(baseTexture) // @todo this is unused 189 | : children} 190 | 191 | 192 | ); 193 | } 194 | -------------------------------------------------------------------------------- /src/core/IrradianceAtlasMapper.tsx: -------------------------------------------------------------------------------- 1 | /* 2 | * Copyright (c) 2020-now Nick Matantsev 3 | * Licensed under the MIT license 4 | */ 5 | 6 | import React, { useState, useMemo, useEffect, useRef } from 'react'; 7 | import { useUpdate, useThree } from 'react-three-fiber'; 8 | import * as THREE from 'three'; 9 | 10 | export interface AtlasMapItem { 11 | faceCount: number; 12 | originalMesh: THREE.Mesh; 13 | originalBuffer: THREE.BufferGeometry; 14 | } 15 | 16 | interface AtlasMapInternalItem extends AtlasMapItem { 17 | perFaceBuffer: THREE.BufferGeometry; 18 | } 19 | 20 | export interface AtlasMap { 21 | width: number; 22 | height: number; 23 | items: AtlasMapItem[]; 24 | data: Float32Array; 25 | texture: THREE.Texture; 26 | } 27 | 28 | export interface Workbench { 29 | id: number; // for refresh 30 | lightScene: THREE.Scene; 31 | atlasMap: AtlasMap; 32 | } 33 | 34 | export const MAX_ITEM_FACES = 1000; // used for encoding item+face index in texture 35 | 36 | // can be arbitrary colour (empty pixels are ignored due to zero alpha) 37 | const ATLAS_BG_COLOR = new THREE.Color('#000000'); 38 | 39 | // temp objects for computation 40 | const tmpNormal = new THREE.Vector3(); 41 | const tmpU = new THREE.Vector3(); 42 | const tmpV = new THREE.Vector3(); 43 | 44 | const VERTEX_SHADER = ` 45 | attribute vec2 uv2; 46 | 47 | varying vec3 vFacePos; 48 | uniform vec2 uvOffset; 49 | 50 | void main() { 51 | vFacePos = position; 52 | 53 | gl_Position = projectionMatrix * vec4( 54 | uv2 + uvOffset, // UV2 is the actual position on map 55 | 0, 56 | 1.0 57 | ); 58 | } 59 | `; 60 | 61 | const FRAGMENT_SHADER = ` 62 | varying vec3 vFacePos; 63 | 64 | void main() { 65 | // encode the face information in map 66 | gl_FragColor = vec4(vFacePos.xyz, 1.0); 67 | } 68 | `; 69 | 70 | // write out original face geometry info into the atlas map 71 | // each texel corresponds to: (quadX, quadY, quadIndex) 72 | // where quadX and quadY are 0..1 representing a spot in the original quad 73 | // and quadIndex is 1-based to distinguish from blank space 74 | // which allows to find original 3D position/normal/etc for that texel 75 | // (quad index is int stored as float, but precision should be good enough) 76 | // NOTE: each atlas texture sample corresponds to the position of 77 | // the physical midpoint of the corresponding rendered texel 78 | // (e.g. if lightmap was shown pixelated); this works well 79 | // with either bilinear or nearest filtering 80 | // @todo consider stencil buffer, or just 8bit texture 81 | const IrradianceAtlasMapper: React.FC<{ 82 | width: number; 83 | height: number; 84 | lightMap: THREE.Texture; 85 | lightScene: THREE.Scene; 86 | onComplete: (atlasMap: AtlasMap) => void; 87 | }> = ({ width, height, lightMap, lightScene, onComplete }) => { 88 | // read value only on first render 89 | const widthRef = useRef(width); 90 | const heightRef = useRef(height); 91 | const lightSceneRef = useRef(lightScene); 92 | 93 | // wait until next render to queue up data to render into atlas texture 94 | const [inputItems, setInputItems] = useState( 95 | null 96 | ); 97 | const [isComplete, setIsComplete] = useState(false); 98 | 99 | useEffect(() => { 100 | const items = [] as AtlasMapInternalItem[]; 101 | 102 | lightSceneRef.current.traverse((mesh) => { 103 | if (!(mesh instanceof THREE.Mesh)) { 104 | return; 105 | } 106 | 107 | // ignore anything that is not a buffer geometry with defined UV2 coordinates 108 | // @todo warn on legacy geometry objects if they seem to have UV2? 109 | const buffer = mesh.geometry; 110 | if (!(buffer instanceof THREE.BufferGeometry)) { 111 | return; 112 | } 113 | 114 | const uv2Attr = buffer.attributes.uv2; 115 | if (!uv2Attr) { 116 | return; 117 | } 118 | 119 | // gather other necessary attributes and ensure compatible data 120 | // @todo support non-indexed meshes 121 | // @todo support interleaved attributes 122 | const indexAttr = buffer.index; 123 | if (!indexAttr) { 124 | throw new Error('expected face index array'); 125 | } 126 | 127 | const faceVertexCount = indexAttr.array.length; 128 | const normalAttr = buffer.attributes.normal; 129 | 130 | if (!normalAttr || !(normalAttr instanceof THREE.BufferAttribute)) { 131 | throw new Error('expected normal attribute'); 132 | } 133 | 134 | if (!(uv2Attr instanceof THREE.BufferAttribute)) { 135 | throw new Error('expected uv2 attribute'); 136 | } 137 | 138 | // index of this item once it will be added to list 139 | const itemIndex = items.length; 140 | 141 | const atlasUVAttr = new THREE.Float32BufferAttribute( 142 | faceVertexCount * 2, 143 | 2 144 | ); 145 | const atlasNormalAttr = new THREE.Float32BufferAttribute( 146 | faceVertexCount * 3, 147 | 3 148 | ); 149 | const atlasFacePosAttr = new THREE.Float32BufferAttribute( 150 | faceVertexCount * 3, 151 | 3 152 | ); 153 | 154 | // unroll indexed mesh data into non-indexed buffer so that we can encode per-face data 155 | // (otherwise vertices may be shared, and hence cannot have face-specific info in vertex attribute) 156 | const indexData = indexAttr.array; 157 | for ( 158 | let faceVertexIndex = 0; 159 | faceVertexIndex < faceVertexCount; 160 | faceVertexIndex += 1 161 | ) { 162 | const faceMod = faceVertexIndex % 3; 163 | 164 | atlasUVAttr.copyAt( 165 | faceVertexIndex, 166 | uv2Attr, 167 | indexData[faceVertexIndex] 168 | ); 169 | 170 | atlasNormalAttr.copyAt( 171 | faceVertexIndex, 172 | normalAttr, 173 | indexData[faceVertexIndex] 174 | ); 175 | 176 | // position of vertex in face: (0,0), (0,1) or (1,0) 177 | const facePosX = faceMod & 1; 178 | const facePosY = (faceMod & 2) >> 1; 179 | 180 | // mesh index + face index combined into one 181 | const faceIndex = (faceVertexIndex - faceMod) / 3; 182 | 183 | atlasFacePosAttr.setXYZ( 184 | faceVertexIndex, 185 | facePosX, 186 | facePosY, 187 | itemIndex * MAX_ITEM_FACES + faceIndex + 1 // encode face info in texel 188 | ); 189 | } 190 | 191 | // this buffer is disposed of when atlas scene is unmounted 192 | const atlasBuffer = new THREE.BufferGeometry(); 193 | atlasBuffer.setAttribute('position', atlasFacePosAttr); 194 | atlasBuffer.setAttribute('uv2', atlasUVAttr); 195 | atlasBuffer.setAttribute('normal', atlasNormalAttr); 196 | 197 | items.push({ 198 | faceCount: faceVertexCount / 3, 199 | perFaceBuffer: atlasBuffer, 200 | originalMesh: mesh, 201 | originalBuffer: buffer 202 | }); 203 | 204 | // finally, auto-attach the lightmap 205 | // (checking against accidentally overriding some unrelated lightmap) 206 | const material = mesh.material; 207 | if ( 208 | !material || 209 | Array.isArray(material) || 210 | (!(material instanceof THREE.MeshLambertMaterial) && 211 | !(material instanceof THREE.MeshPhongMaterial) && 212 | !(material instanceof THREE.MeshStandardMaterial)) 213 | ) { 214 | // @todo check for any other applicable types, maybe anything with a lightMap property? 215 | throw new Error( 216 | 'only single Lambert/Phong/standard materials are supported' 217 | ); 218 | } 219 | 220 | if (material.lightMap && material.lightMap !== lightMap) { 221 | throw new Error( 222 | 'do not set your own light map manually on baked scene meshes' 223 | ); 224 | } 225 | 226 | material.lightMap = lightMap; 227 | }); 228 | 229 | // disposed during scene unmount 230 | setInputItems(items); 231 | }, []); 232 | 233 | const orthoTarget = useMemo(() => { 234 | // set up simple rasterization for pure data consumption 235 | return new THREE.WebGLRenderTarget(widthRef.current, heightRef.current, { 236 | type: THREE.FloatType, 237 | magFilter: THREE.NearestFilter, 238 | minFilter: THREE.NearestFilter, 239 | depthBuffer: false, 240 | generateMipmaps: false 241 | }); 242 | }, []); 243 | 244 | useEffect( 245 | () => () => { 246 | // clean up on unmount 247 | orthoTarget.dispose(); 248 | }, 249 | [orthoTarget] 250 | ); 251 | 252 | const orthoCamera = useMemo(() => { 253 | return new THREE.OrthographicCamera(0, 1, 1, 0, 0, 1); 254 | }, []); 255 | 256 | const orthoData = useMemo(() => { 257 | return new Float32Array(widthRef.current * heightRef.current * 4); 258 | }, []); 259 | 260 | // render the output as needed 261 | const { gl } = useThree(); 262 | const orthoSceneRef = useUpdate( 263 | (orthoScene) => { 264 | // nothing to do 265 | if (!inputItems || isComplete) { 266 | return; 267 | } 268 | 269 | // save existing renderer state 270 | const prevClearColor = new THREE.Color(); 271 | prevClearColor.copy(gl.getClearColor()); 272 | const prevClearAlpha = gl.getClearAlpha(); 273 | const prevAutoClear = gl.autoClear; 274 | 275 | // produce the output 276 | gl.setRenderTarget(orthoTarget); 277 | 278 | gl.setClearColor(ATLAS_BG_COLOR, 0); // alpha must be zero 279 | gl.autoClear = true; 280 | 281 | gl.render(orthoScene, orthoCamera); 282 | 283 | // restore previous renderer state 284 | gl.setRenderTarget(null); 285 | gl.setClearColor(prevClearColor, prevClearAlpha); 286 | gl.autoClear = prevAutoClear; 287 | 288 | gl.readRenderTargetPixels( 289 | orthoTarget, 290 | 0, 291 | 0, 292 | widthRef.current, 293 | heightRef.current, 294 | orthoData 295 | ); 296 | 297 | setIsComplete(true); 298 | setInputItems(null); // release references to atlas-specific geometry clones 299 | 300 | onComplete({ 301 | width: widthRef.current, 302 | height: heightRef.current, 303 | texture: orthoTarget.texture, 304 | data: orthoData, 305 | 306 | // no need to expose references to atlas-specific geometry clones 307 | items: inputItems.map( 308 | ({ faceCount, originalMesh, originalBuffer }) => ({ 309 | faceCount, 310 | originalMesh, 311 | originalBuffer 312 | }) 313 | ) 314 | }); 315 | }, 316 | [inputItems] 317 | ); 318 | 319 | return ( 320 | <> 321 | {inputItems && !isComplete && ( 322 | // wrap scene in an extra group object 323 | // so that when this is hidden during suspension only the wrapper has visible=false 324 | 325 | 326 | {inputItems.map((geom, geomIndex) => { 327 | return ( 328 | 333 | 334 | 335 | 341 | 342 | ); 343 | })} 344 | 345 | 346 | )} 347 | 348 | ); 349 | }; 350 | 351 | export default IrradianceAtlasMapper; 352 | -------------------------------------------------------------------------------- /src/core/AutoUV2.tsx: -------------------------------------------------------------------------------- 1 | /* 2 | * Copyright (c) 2020-now Nick Matantsev 3 | * Licensed under the MIT license 4 | */ 5 | 6 | import React, { useRef, useMemo, useEffect, useContext } from 'react'; 7 | import { useResource } from 'react-three-fiber'; 8 | import * as THREE from 'three'; 9 | 10 | /// 11 | import potpack, { PotPackItem } from 'potpack'; 12 | 13 | import { useIrradianceMapSize } from './IrradianceCompositor'; 14 | 15 | const tmpOrigin = new THREE.Vector3(); 16 | const tmpU = new THREE.Vector3(); 17 | const tmpV = new THREE.Vector3(); 18 | const tmpW = new THREE.Vector3(); 19 | 20 | const tmpNormal = new THREE.Vector3(); 21 | const tmpUAxis = new THREE.Vector3(); 22 | const tmpVAxis = new THREE.Vector3(); 23 | 24 | const tmpWLocal = new THREE.Vector2(); 25 | 26 | const tmpMinLocal = new THREE.Vector2(); 27 | const tmpMaxLocal = new THREE.Vector2(); 28 | 29 | // used for auto-indexing 30 | const tmpVert = new THREE.Vector3(); 31 | const tmpVert2 = new THREE.Vector3(); 32 | const tmpNormal2 = new THREE.Vector3(); 33 | 34 | function findVertex( 35 | posArray: ArrayLike, 36 | normalArray: ArrayLike, 37 | vertexIndex: number 38 | ): number { 39 | tmpVert.fromArray(posArray, vertexIndex * 3); 40 | tmpNormal.fromArray(normalArray, vertexIndex * 3); 41 | 42 | // finish search before current vertex (since latter is the fallback return) 43 | for (let vStart = 0; vStart < vertexIndex; vStart += 1) { 44 | tmpVert2.fromArray(posArray, vStart * 3); 45 | tmpNormal2.fromArray(normalArray, vStart * 3); 46 | 47 | if (tmpVert2.equals(tmpVert) && tmpNormal2.equals(tmpNormal)) { 48 | return vStart; 49 | } 50 | } 51 | 52 | return vertexIndex; 53 | } 54 | 55 | function convertGeometryToIndexed(buffer: THREE.BufferGeometry) { 56 | const posArray = buffer.attributes.position.array; 57 | const posVertexCount = Math.floor(posArray.length / 3); 58 | const faceCount = Math.floor(posVertexCount / 3); 59 | 60 | const normalArray = buffer.attributes.normal.array; 61 | 62 | const indexAttr = new THREE.Uint16BufferAttribute(faceCount * 3, 3); 63 | indexAttr.count = faceCount * 3; // @todo without this the mesh does not show all faces 64 | 65 | for (let faceIndex = 0; faceIndex < faceCount; faceIndex += 1) { 66 | const vStart = faceIndex * 3; 67 | const a = findVertex(posArray, normalArray, vStart); 68 | const b = findVertex(posArray, normalArray, vStart + 1); 69 | const c = findVertex(posArray, normalArray, vStart + 2); 70 | 71 | indexAttr.setXYZ(faceIndex, a, b, c); 72 | } 73 | 74 | buffer.setIndex(indexAttr); 75 | } 76 | 77 | function guessOrthogonalOrigin( 78 | indexArray: ArrayLike, 79 | vStart: number, 80 | posArray: ArrayLike 81 | ): number { 82 | let minAbsDot = 1; 83 | let minI = 0; 84 | 85 | for (let i = 0; i < 3; i += 1) { 86 | // for this ortho origin choice, compute defining edges 87 | tmpOrigin.fromArray(posArray, indexArray[vStart + i] * 3); 88 | tmpU.fromArray(posArray, indexArray[vStart + ((i + 2) % 3)] * 3); 89 | tmpV.fromArray(posArray, indexArray[vStart + ((i + 1) % 3)] * 3); 90 | 91 | tmpU.sub(tmpOrigin); 92 | tmpV.sub(tmpOrigin); 93 | 94 | // normalize and compute cross (cosine of angle) 95 | tmpU.normalize(); 96 | tmpV.normalize(); 97 | 98 | const absDot = Math.abs(tmpU.dot(tmpV)); 99 | 100 | // compare with current minimum 101 | if (minAbsDot > absDot) { 102 | minAbsDot = absDot; 103 | minI = i; 104 | } 105 | } 106 | 107 | return minI; 108 | } 109 | 110 | interface AutoUVBox extends PotPackItem { 111 | uv2Attr: THREE.Float32BufferAttribute; 112 | 113 | uAxis: THREE.Vector3; 114 | vAxis: THREE.Vector3; 115 | 116 | posArray: ArrayLike; 117 | posIndices: number[]; 118 | posLocalX: number[]; 119 | posLocalY: number[]; 120 | } 121 | 122 | export interface AutoUV2Settings { 123 | texelSize: number; 124 | } 125 | 126 | function computeAutoUV2Layout( 127 | width: number, 128 | height: number, 129 | meshList: THREE.Mesh[], 130 | { texelSize }: AutoUV2Settings 131 | ) { 132 | const layoutBoxes: AutoUVBox[] = []; 133 | 134 | for (const mesh of meshList) { 135 | const buffer = mesh.geometry; 136 | 137 | if (!(buffer instanceof THREE.BufferGeometry)) { 138 | throw new Error('expecting buffer geometry'); 139 | } 140 | 141 | // automatically convert to indexed 142 | if (!buffer.index) { 143 | convertGeometryToIndexed(buffer); 144 | } 145 | 146 | const indexAttr = buffer.index; 147 | if (!indexAttr) { 148 | throw new Error('unexpected missing geometry index attr'); 149 | } 150 | 151 | const indexArray = indexAttr.array; 152 | const faceCount = Math.floor(indexArray.length / 3); 153 | 154 | const posArray = buffer.attributes.position.array; 155 | const normalArray = buffer.attributes.normal.array; 156 | 157 | const vertexBoxMap: (AutoUVBox | undefined)[] = new Array( 158 | posArray.length / 3 159 | ); 160 | 161 | if (buffer.attributes.uv2) { 162 | throw new Error('uv2 attribute already exists'); 163 | } 164 | 165 | // pre-create uv2 attribute 166 | const uv2Attr = new THREE.Float32BufferAttribute( 167 | (2 * posArray.length) / 3, 168 | 2 169 | ); 170 | buffer.setAttribute('uv2', uv2Attr); 171 | 172 | for (let vStart = 0; vStart < faceCount * 3; vStart += 3) { 173 | // see if this face shares a vertex with an existing layout box 174 | let existingBox: AutoUVBox | undefined; 175 | 176 | for (let i = 0; i < 3; i += 1) { 177 | const possibleBox = vertexBoxMap[indexArray[vStart + i]]; 178 | 179 | if (!possibleBox) { 180 | continue; 181 | } 182 | 183 | if (existingBox && existingBox !== possibleBox) { 184 | // absorb layout box into the other 185 | // (this may happen if same polygon's faces are defined non-consecutively) 186 | existingBox.posIndices.push(...possibleBox.posIndices); 187 | existingBox.posLocalX.push(...possibleBox.posLocalX); 188 | existingBox.posLocalY.push(...possibleBox.posLocalY); 189 | 190 | // re-assign by-vertex lookup 191 | for (const index of possibleBox.posIndices) { 192 | vertexBoxMap[index] = existingBox; 193 | } 194 | 195 | // remove from main list 196 | const removedBoxIndex = layoutBoxes.indexOf(possibleBox); 197 | if (removedBoxIndex === -1) { 198 | throw new Error('unexpected orphaned layout box'); 199 | } 200 | layoutBoxes.splice(removedBoxIndex, 1); 201 | } else { 202 | existingBox = possibleBox; 203 | } 204 | } 205 | 206 | // set up new layout box if needed 207 | if (!existingBox) { 208 | // @todo guess axis choice based on angle? 209 | const originFI = guessOrthogonalOrigin(indexArray, vStart, posArray); 210 | 211 | const vOrigin = vStart + originFI; 212 | const vU = vStart + ((originFI + 2) % 3); // prev in face 213 | const vV = vStart + ((originFI + 1) % 3); // next in face 214 | 215 | // get the plane-defining edge vectors 216 | tmpOrigin.fromArray(posArray, indexArray[vOrigin] * 3); 217 | tmpU.fromArray(posArray, indexArray[vU] * 3); 218 | tmpV.fromArray(posArray, indexArray[vV] * 3); 219 | 220 | tmpU.sub(tmpOrigin); 221 | tmpV.sub(tmpOrigin); 222 | 223 | // compute orthogonal coordinate system for face plane 224 | tmpNormal.fromArray(normalArray, indexArray[vOrigin] * 3); 225 | tmpUAxis.crossVectors(tmpV, tmpNormal); 226 | tmpVAxis.crossVectors(tmpNormal, tmpUAxis); 227 | tmpUAxis.normalize(); 228 | tmpVAxis.normalize(); 229 | 230 | existingBox = { 231 | x: 0, // filled later 232 | y: 0, // filled later 233 | w: 0, // filled later 234 | h: 0, // filled later 235 | 236 | uv2Attr, 237 | 238 | uAxis: tmpUAxis.clone(), 239 | vAxis: tmpVAxis.clone(), 240 | 241 | posArray, 242 | posIndices: [], 243 | posLocalX: [], 244 | posLocalY: [] 245 | }; 246 | 247 | layoutBoxes.push(existingBox); 248 | } 249 | 250 | // add this face's vertices to the layout box local point set 251 | // @todo warn if normals deviate too much 252 | for (let i = 0; i < 3; i += 1) { 253 | const index = indexArray[vStart + i]; 254 | 255 | if (vertexBoxMap[index]) { 256 | continue; 257 | } 258 | 259 | vertexBoxMap[index] = existingBox; 260 | existingBox.posIndices.push(index); 261 | existingBox.posLocalX.push(0); // filled later 262 | existingBox.posLocalY.push(0); // filled later 263 | } 264 | } 265 | } 266 | 267 | // fill in local coords and compute dimensions for layout boxes based on polygon point sets inside them 268 | for (const layoutBox of layoutBoxes) { 269 | const { 270 | uAxis, 271 | vAxis, 272 | posArray, 273 | posIndices, 274 | posLocalX, 275 | posLocalY 276 | } = layoutBox; 277 | 278 | // compute min and max extents of all coords 279 | tmpMinLocal.set(Number.POSITIVE_INFINITY, Number.POSITIVE_INFINITY); 280 | tmpMaxLocal.set(Number.NEGATIVE_INFINITY, Number.NEGATIVE_INFINITY); 281 | 282 | for (let i = 0; i < posIndices.length; i += 1) { 283 | const index = posIndices[i]; 284 | 285 | tmpW.fromArray(posArray, index * 3); 286 | tmpWLocal.set(tmpW.dot(uAxis), tmpW.dot(vAxis)); 287 | 288 | tmpMinLocal.min(tmpWLocal); 289 | tmpMaxLocal.max(tmpWLocal); 290 | 291 | posLocalX[i] = tmpWLocal.x; 292 | posLocalY[i] = tmpWLocal.y; 293 | } 294 | 295 | const realWidth = tmpMaxLocal.x - tmpMinLocal.x; 296 | const realHeight = tmpMaxLocal.y - tmpMinLocal.y; 297 | 298 | if (realWidth < 0 || realHeight < 0) { 299 | throw new Error('zero-point polygon?'); 300 | } 301 | 302 | // texel box is aligned to texel grid 303 | const boxWidthInTexels = Math.ceil(realWidth / texelSize); 304 | const boxHeightInTexels = Math.ceil(realHeight / texelSize); 305 | 306 | // layout box positioning is in texels 307 | layoutBox.w = boxWidthInTexels + 2; // plus margins 308 | layoutBox.h = boxHeightInTexels + 2; // plus margins 309 | 310 | // make vertex local coords expressed as 0..1 inside texel box 311 | for (let i = 0; i < posIndices.length; i += 1) { 312 | posLocalX[i] = (posLocalX[i] - tmpMinLocal.x) / realWidth; 313 | posLocalY[i] = (posLocalY[i] - tmpMinLocal.y) / realHeight; 314 | } 315 | } 316 | 317 | // main layout magic 318 | const { w: layoutWidth, h: layoutHeight } = potpack(layoutBoxes); 319 | 320 | if (layoutWidth > width || layoutHeight > height) { 321 | throw new Error( 322 | `auto-UV needs lightmap sized ${layoutWidth}x${layoutHeight}` 323 | ); 324 | } 325 | 326 | // based on layout box positions, fill in UV2 attribute data 327 | for (const layoutBox of layoutBoxes) { 328 | const { x, y, w, h, uv2Attr, posIndices, posLocalX, posLocalY } = layoutBox; 329 | 330 | // inner texel box without margins 331 | const ix = x + 1; 332 | const iy = y + 1; 333 | const iw = w - 2; 334 | const ih = h - 2; 335 | 336 | // convert texel box placement into atlas UV coordinates 337 | for (let i = 0; i < posIndices.length; i += 1) { 338 | uv2Attr.setXY( 339 | posIndices[i], 340 | (ix + posLocalX[i] * iw) / width, 341 | (iy + posLocalY[i] * ih) / height 342 | ); 343 | } 344 | } 345 | } 346 | 347 | interface AutoUV2Info { 348 | completionPromise: Promise | null; 349 | register: Record; 350 | } 351 | const AutoUV2Context = React.createContext(null); 352 | 353 | export const AutoUV2Provider: React.FC = ({ 354 | texelSize, 355 | children 356 | }) => { 357 | const [lightMapWidth, lightMapHeight] = useIrradianceMapSize(); 358 | const texelSizeRef = useRef(texelSize); // read only once 359 | 360 | const resolverRef = useRef<(() => void) | null>(null); 361 | 362 | const contextValue = useMemo(() => { 363 | return { 364 | completionPromise: new Promise((resolve) => { 365 | // stash resolver callback for later 366 | resolverRef.current = resolve; 367 | }), 368 | register: {} 369 | }; 370 | }, []); 371 | 372 | useEffect(() => { 373 | // perform layout in next tick 374 | const timeoutId = setTimeout(() => { 375 | computeAutoUV2Layout( 376 | lightMapWidth, 377 | lightMapHeight, 378 | Object.values(contextValue.register), 379 | { texelSize: texelSizeRef.current } 380 | ); 381 | 382 | // clear waiting status in context object (so that suspenders return normally) 383 | contextValue.completionPromise = null; 384 | 385 | // notify everyone waiting (i.e. children) 386 | if (!resolverRef.current) { 387 | throw new Error('unexpected missing promise resolver'); 388 | } 389 | resolverRef.current(); 390 | }, 0); 391 | 392 | // always clean up timeout 393 | return () => clearTimeout(timeoutId); 394 | }, [lightMapWidth, lightMapHeight, contextValue]); 395 | 396 | return ( 397 | 398 | {children} 399 | 400 | ); 401 | }; 402 | 403 | const Suspender: React.FC = () => { 404 | const ctx = useContext(AutoUV2Context); 405 | if (!ctx) { 406 | throw new Error('no auto-UV context'); 407 | } 408 | 409 | if (ctx.completionPromise) { 410 | throw ctx.completionPromise; 411 | } 412 | 413 | return null; 414 | }; 415 | 416 | export const AutoUV2: React.FC = () => { 417 | const groupRef = useResource(); 418 | const mesh = groupRef.current && groupRef.current.parent; 419 | 420 | // extra error checks 421 | if (mesh) { 422 | if (!(mesh instanceof THREE.Mesh)) { 423 | throw new Error('light scene element should be a mesh'); 424 | } 425 | } 426 | 427 | const ctx = useContext(AutoUV2Context); 428 | if (!ctx) { 429 | throw new Error('no auto-UV context'); 430 | } 431 | 432 | useEffect(() => { 433 | if (!mesh) { 434 | return; 435 | } 436 | 437 | const uuid = mesh.uuid; // freeze local reference 438 | 439 | // register display item 440 | ctx.register[uuid] = mesh; 441 | 442 | // on unmount, clean up 443 | return () => { 444 | delete ctx.register[uuid]; 445 | }; 446 | }, [mesh]); 447 | 448 | // placeholder to attach under the target mesh 449 | // (suspension happens inside, so that this can be still rendered at all times) 450 | return ( 451 | 452 | 453 | 454 | ); 455 | }; 456 | -------------------------------------------------------------------------------- /src/core/IrradianceLightProbe.tsx: -------------------------------------------------------------------------------- 1 | /* 2 | * Copyright (c) 2020-now Nick Matantsev 3 | * Licensed under the MIT license 4 | */ 5 | 6 | import { useEffect, useMemo } from 'react'; 7 | import * as THREE from 'three'; 8 | 9 | import { AtlasMapItem } from './IrradianceAtlasMapper'; 10 | 11 | const tmpOrigin = new THREE.Vector3(); 12 | const tmpU = new THREE.Vector3(); 13 | const tmpV = new THREE.Vector3(); 14 | 15 | const tmpNormal = new THREE.Vector3(); 16 | const tmpLookAt = new THREE.Vector3(); 17 | 18 | const tmpProbeBox = new THREE.Vector4(); 19 | const tmpPrevClearColor = new THREE.Color(); 20 | 21 | // used inside blending function 22 | const tmpNormalOther = new THREE.Vector3(); 23 | 24 | const PROBE_BG_COLOR = new THREE.Color('#000000'); 25 | 26 | export const PROBE_BATCH_COUNT = 8; 27 | 28 | export type ProbeDataHandler = ( 29 | rgbaData: Float32Array, 30 | rowPixelStride: number, 31 | probeBox: THREE.Vector4, 32 | originX: number, // device coordinates of lower-left corner of the viewbox 33 | originY: number 34 | ) => void; 35 | 36 | export type ProbeBatchRenderer = ( 37 | texelIndex: number, 38 | atlasMapItem: AtlasMapItem, 39 | faceIndex: number, 40 | pU: number, 41 | pV: number 42 | ) => void; 43 | 44 | export type ProbeBatchReader = (handleProbeData: ProbeDataHandler) => void; 45 | 46 | export type ProbeBatcher = ( 47 | gl: THREE.WebGLRenderer, 48 | lightScene: THREE.Scene, 49 | batchItemCallback: (renderer: ProbeBatchRenderer) => void, 50 | batchResultCallback: (batchIndex: number, reader: ProbeBatchReader) => void 51 | ) => void; 52 | 53 | // "raw" means that output is not normalized (not necessary for now) 54 | function setBlendedNormalRaw( 55 | out: THREE.Vector3, 56 | origNormalArray: ArrayLike, 57 | origIndexArray: ArrayLike, 58 | faceVertexBase: number, 59 | pU: number, 60 | pV: number 61 | ) { 62 | out.fromArray(origNormalArray, origIndexArray[faceVertexBase] * 3); 63 | 64 | tmpNormalOther.fromArray( 65 | origNormalArray, 66 | origIndexArray[faceVertexBase + 1] * 3 67 | ); 68 | out.lerp(tmpNormalOther, pU); 69 | 70 | tmpNormalOther.fromArray( 71 | origNormalArray, 72 | origIndexArray[faceVertexBase + 2] * 3 73 | ); 74 | out.lerp(tmpNormalOther, pV); 75 | } 76 | 77 | function setUpProbeUp( 78 | probeCam: THREE.Camera, 79 | mesh: THREE.Mesh, 80 | origin: THREE.Vector3, 81 | normal: THREE.Vector3, 82 | uDir: THREE.Vector3 83 | ) { 84 | probeCam.position.copy(origin); 85 | 86 | probeCam.up.copy(uDir); 87 | 88 | // add normal to accumulator and look at it 89 | tmpLookAt.copy(normal); 90 | tmpLookAt.add(origin); 91 | 92 | probeCam.lookAt(tmpLookAt); 93 | probeCam.scale.set(1, 1, 1); 94 | 95 | // then, transform camera into world space 96 | probeCam.applyMatrix4(mesh.matrixWorld); 97 | } 98 | 99 | function setUpProbeSide( 100 | probeCam: THREE.Camera, 101 | mesh: THREE.Mesh, 102 | origin: THREE.Vector3, 103 | normal: THREE.Vector3, 104 | direction: THREE.Vector3, 105 | directionSign: number 106 | ) { 107 | probeCam.position.copy(origin); 108 | 109 | // up is the normal 110 | probeCam.up.copy(normal); 111 | 112 | // add normal to accumulator and look at it 113 | tmpLookAt.copy(origin); 114 | tmpLookAt.addScaledVector(direction, directionSign); 115 | 116 | probeCam.lookAt(tmpLookAt); 117 | probeCam.scale.set(1, 1, 1); 118 | 119 | // then, transform camera into world space 120 | probeCam.applyMatrix4(mesh.matrixWorld); 121 | } 122 | 123 | export function useLightProbe( 124 | probeTargetSize: number 125 | ): { 126 | renderLightProbeBatch: ProbeBatcher; 127 | probePixelAreaLookup: number[]; 128 | debugLightProbeTexture: THREE.Texture; 129 | } { 130 | const probePixelCount = probeTargetSize * probeTargetSize; 131 | const halfSize = probeTargetSize / 2; 132 | 133 | const targetWidth = probeTargetSize * 4; // 4 tiles across 134 | const targetHeight = probeTargetSize * 2 * PROBE_BATCH_COUNT; // 2 tiles x batch count 135 | 136 | const probeTarget = useMemo(() => { 137 | // set up simple rasterization for pure data consumption 138 | return new THREE.WebGLRenderTarget(targetWidth, targetHeight, { 139 | type: THREE.FloatType, 140 | magFilter: THREE.NearestFilter, 141 | minFilter: THREE.NearestFilter, 142 | generateMipmaps: false 143 | }); 144 | }, [targetWidth, targetHeight]); 145 | 146 | // for each pixel in the individual probe viewport, compute contribution to final tally 147 | // (edges are weaker because each pixel covers less of a view angle) 148 | const probePixelAreaLookup = useMemo(() => { 149 | const lookup = new Array(probePixelCount); 150 | 151 | const probePixelBias = 0.5 / probeTargetSize; 152 | 153 | for (let py = 0; py < probeTargetSize; py += 1) { 154 | // compute offset from center (with a bias for target pixel size) 155 | const dy = py / probeTargetSize - 0.5 + probePixelBias; 156 | 157 | for (let px = 0; px < probeTargetSize; px += 1) { 158 | // compute offset from center (with a bias for target pixel size) 159 | const dx = px / probeTargetSize - 0.5 + probePixelBias; 160 | 161 | // compute multiplier as affected by inclination of corresponding ray 162 | const span = Math.hypot(dx * 2, dy * 2); 163 | const hypo = Math.hypot(span, 1); 164 | const area = 1 / hypo; 165 | 166 | lookup[py * probeTargetSize + px] = area; 167 | } 168 | } 169 | 170 | return lookup; 171 | }, [probePixelCount, probeTargetSize]); 172 | 173 | useEffect( 174 | () => () => { 175 | // clean up on unmount 176 | probeTarget.dispose(); 177 | }, 178 | [probeTarget] 179 | ); 180 | 181 | const probeCam = useMemo(() => { 182 | const rtFov = 90; // view cone must be quarter of the hemisphere 183 | const rtAspect = 1; // square render target 184 | const rtNear = 0.05; 185 | const rtFar = 50; 186 | return new THREE.PerspectiveCamera(rtFov, rtAspect, rtNear, rtFar); 187 | }, []); 188 | 189 | const probeData = useMemo(() => { 190 | return new Float32Array(targetWidth * targetHeight * 4); 191 | }, [targetWidth, targetHeight]); 192 | 193 | const batchTexels = new Array(PROBE_BATCH_COUNT) as (number | undefined)[]; 194 | 195 | // @todo ensure there is biasing to be in middle of texel physical square 196 | const renderLightProbeBatch: ProbeBatcher = function renderLightProbeBatch( 197 | gl, 198 | lightScene, 199 | batchItemCallback, 200 | batchResultCallback 201 | ) { 202 | // save existing renderer state 203 | tmpPrevClearColor.copy(gl.getClearColor()); 204 | const prevClearAlpha = gl.getClearAlpha(); 205 | const prevAutoClear = gl.autoClear; 206 | const prevToneMapping = gl.toneMapping; 207 | 208 | // reset tone mapping output to linear because we are aggregating unprocessed luminance output 209 | gl.toneMapping = THREE.LinearToneMapping; 210 | 211 | // set up render target for overall clearing 212 | // (bypassing setViewport means that the renderer conveniently preserves previous state) 213 | probeTarget.scissorTest = true; 214 | probeTarget.scissor.set(0, 0, targetWidth, targetHeight); 215 | probeTarget.viewport.set(0, 0, targetWidth, targetHeight); 216 | gl.setRenderTarget(probeTarget); 217 | gl.autoClear = false; 218 | 219 | // clear entire area 220 | gl.setClearColor(PROBE_BG_COLOR, 1); 221 | gl.clear(true, true, false); 222 | 223 | for (let batchItem = 0; batchItem < PROBE_BATCH_COUNT; batchItem += 1) { 224 | batchTexels[batchItem] = undefined; 225 | 226 | batchItemCallback((texelIndex, atlasMapItem, faceIndex, pU, pV) => { 227 | // each batch is 2 tiles high 228 | const batchOffsetY = batchItem * probeTargetSize * 2; 229 | 230 | // save which texel is being rendered for later reporting 231 | batchTexels[batchItem] = texelIndex; 232 | 233 | const { originalMesh, originalBuffer } = atlasMapItem; 234 | 235 | if (!originalBuffer.index) { 236 | throw new Error('expected indexed mesh'); 237 | } 238 | 239 | // read vertex position for this face and interpolate along U and V axes 240 | const origIndexArray = originalBuffer.index.array; 241 | const origPosArray = originalBuffer.attributes.position.array; 242 | const origNormalArray = originalBuffer.attributes.normal.array; 243 | 244 | // get face vertex positions 245 | const faceVertexBase = faceIndex * 3; 246 | tmpOrigin.fromArray(origPosArray, origIndexArray[faceVertexBase] * 3); 247 | tmpU.fromArray(origPosArray, origIndexArray[faceVertexBase + 1] * 3); 248 | tmpV.fromArray(origPosArray, origIndexArray[faceVertexBase + 2] * 3); 249 | 250 | // compute face dimensions 251 | tmpU.sub(tmpOrigin); 252 | tmpV.sub(tmpOrigin); 253 | 254 | // set camera to match texel, first in mesh-local space 255 | tmpOrigin.addScaledVector(tmpU, pU); 256 | tmpOrigin.addScaledVector(tmpV, pV); 257 | 258 | // compute normal and cardinal directions 259 | // (done per texel for linear interpolation of normals) 260 | setBlendedNormalRaw( 261 | tmpNormal, 262 | origNormalArray, 263 | origIndexArray, 264 | faceVertexBase, 265 | pU, 266 | pV 267 | ); 268 | 269 | // use consistent "left" and "up" directions based on just the normal 270 | if (tmpNormal.x === 0 && tmpNormal.y === 0) { 271 | tmpU.set(1, 0, 0); 272 | } else { 273 | tmpU.set(0, 0, 1); 274 | } 275 | 276 | tmpV.crossVectors(tmpNormal, tmpU); 277 | tmpV.normalize(); 278 | 279 | tmpU.crossVectors(tmpNormal, tmpV); 280 | tmpU.normalize(); 281 | 282 | // proceed with the renders 283 | setUpProbeUp(probeCam, originalMesh, tmpOrigin, tmpNormal, tmpU); 284 | probeTarget.viewport.set( 285 | 0, 286 | batchOffsetY + probeTargetSize, 287 | probeTargetSize, 288 | probeTargetSize 289 | ); 290 | probeTarget.scissor.set( 291 | 0, 292 | batchOffsetY + probeTargetSize, 293 | probeTargetSize, 294 | probeTargetSize 295 | ); 296 | gl.setRenderTarget(probeTarget); // propagate latest target params 297 | gl.render(lightScene, probeCam); 298 | 299 | // sides only need the upper half of rendered view, so we set scissor accordingly 300 | setUpProbeSide(probeCam, originalMesh, tmpOrigin, tmpNormal, tmpU, 1); 301 | probeTarget.viewport.set( 302 | 0, 303 | batchOffsetY, 304 | probeTargetSize, 305 | probeTargetSize 306 | ); 307 | probeTarget.scissor.set( 308 | 0, 309 | batchOffsetY + halfSize, 310 | probeTargetSize, 311 | halfSize 312 | ); 313 | gl.setRenderTarget(probeTarget); // propagate latest target params 314 | gl.render(lightScene, probeCam); 315 | 316 | setUpProbeSide(probeCam, originalMesh, tmpOrigin, tmpNormal, tmpU, -1); 317 | probeTarget.viewport.set( 318 | probeTargetSize, 319 | batchOffsetY, 320 | probeTargetSize, 321 | probeTargetSize 322 | ); 323 | probeTarget.scissor.set( 324 | probeTargetSize, 325 | batchOffsetY + halfSize, 326 | probeTargetSize, 327 | halfSize 328 | ); 329 | gl.setRenderTarget(probeTarget); // propagate latest target params 330 | gl.render(lightScene, probeCam); 331 | 332 | setUpProbeSide(probeCam, originalMesh, tmpOrigin, tmpNormal, tmpV, 1); 333 | probeTarget.viewport.set( 334 | probeTargetSize * 2, 335 | batchOffsetY, 336 | probeTargetSize, 337 | probeTargetSize 338 | ); 339 | probeTarget.scissor.set( 340 | probeTargetSize * 2, 341 | batchOffsetY + halfSize, 342 | probeTargetSize, 343 | halfSize 344 | ); 345 | gl.setRenderTarget(probeTarget); // propagate latest target params 346 | gl.render(lightScene, probeCam); 347 | 348 | setUpProbeSide(probeCam, originalMesh, tmpOrigin, tmpNormal, tmpV, -1); 349 | probeTarget.viewport.set( 350 | probeTargetSize * 3, 351 | batchOffsetY, 352 | probeTargetSize, 353 | probeTargetSize 354 | ); 355 | probeTarget.scissor.set( 356 | probeTargetSize * 3, 357 | batchOffsetY + halfSize, 358 | probeTargetSize, 359 | halfSize 360 | ); 361 | gl.setRenderTarget(probeTarget); // propagate latest target params 362 | gl.render(lightScene, probeCam); 363 | }); 364 | 365 | // if nothing was rendered there is no need to finish the batch 366 | if (batchTexels[batchItem] === undefined) { 367 | break; 368 | } 369 | } 370 | 371 | // fetch rendered data in one go (this is very slow) 372 | gl.readRenderTargetPixels( 373 | probeTarget, 374 | 0, 375 | 0, 376 | targetWidth, 377 | targetHeight, 378 | probeData 379 | ); 380 | 381 | // restore renderer state 382 | gl.setRenderTarget(null); // this restores original scissor/viewport 383 | gl.setClearColor(tmpPrevClearColor, prevClearAlpha); 384 | gl.autoClear = prevAutoClear; 385 | gl.toneMapping = prevToneMapping; 386 | 387 | // if something was rendered, send off the data for consumption 388 | for (let batchItem = 0; batchItem < PROBE_BATCH_COUNT; batchItem += 1) { 389 | const renderedTexelIndex = batchTexels[batchItem]; 390 | 391 | // see if the batch ended early 392 | if (renderedTexelIndex === undefined) { 393 | break; 394 | } 395 | 396 | batchResultCallback(renderedTexelIndex, (handleProbeData) => { 397 | // each batch is 2 tiles high 398 | const batchOffsetY = batchItem * probeTargetSize * 2; 399 | const rowPixelStride = probeTargetSize * 4; 400 | 401 | tmpProbeBox.set( 402 | 0, 403 | batchOffsetY + probeTargetSize, 404 | probeTargetSize, 405 | probeTargetSize 406 | ); 407 | handleProbeData(probeData, rowPixelStride, tmpProbeBox, 0, 0); 408 | 409 | tmpProbeBox.set(0, batchOffsetY + halfSize, probeTargetSize, halfSize); 410 | handleProbeData(probeData, rowPixelStride, tmpProbeBox, 0, halfSize); 411 | 412 | tmpProbeBox.set( 413 | probeTargetSize, 414 | batchOffsetY + halfSize, 415 | probeTargetSize, 416 | halfSize 417 | ); 418 | handleProbeData(probeData, rowPixelStride, tmpProbeBox, 0, halfSize); 419 | 420 | tmpProbeBox.set( 421 | probeTargetSize * 2, 422 | batchOffsetY + halfSize, 423 | probeTargetSize, 424 | halfSize 425 | ); 426 | handleProbeData(probeData, rowPixelStride, tmpProbeBox, 0, halfSize); 427 | 428 | tmpProbeBox.set( 429 | probeTargetSize * 3, 430 | batchOffsetY + halfSize, 431 | probeTargetSize, 432 | halfSize 433 | ); 434 | handleProbeData(probeData, rowPixelStride, tmpProbeBox, 0, halfSize); 435 | }); 436 | } 437 | }; 438 | 439 | return { 440 | renderLightProbeBatch, 441 | probePixelAreaLookup, 442 | debugLightProbeTexture: probeTarget.texture 443 | }; 444 | } 445 | -------------------------------------------------------------------------------- /src/core/IrradianceRenderer.tsx: -------------------------------------------------------------------------------- 1 | /* 2 | * Copyright (c) 2020-now Nick Matantsev 3 | * Licensed under the MIT license 4 | */ 5 | 6 | import React, { useEffect, useState, useMemo, useContext, useRef } from 'react'; 7 | import { useFrame } from 'react-three-fiber'; 8 | import * as THREE from 'three'; 9 | 10 | import { WorkManagerContext } from './WorkManager'; 11 | import { useIrradianceRendererData } from './IrradianceCompositor'; 12 | import { Workbench, MAX_ITEM_FACES, AtlasMap } from './IrradianceAtlasMapper'; 13 | import { 14 | ProbeBatchRenderer, 15 | ProbeBatchReader, 16 | useLightProbe 17 | } from './IrradianceLightProbe'; 18 | 19 | const MAX_PASSES = 2; 20 | 21 | // global conversion of display -> physical emissiveness 22 | // @todo this originally was 32 because emissive textures did not reflect enough scene light, 23 | // but making emissiveIntensity > 1 washed out the visible non-light-scene display colours 24 | const EMISSIVE_MULTIPLIER = 1; 25 | 26 | const tmpRgba = new THREE.Vector4(); 27 | 28 | // applied inside the light probe scene 29 | function createTemporaryLightMapTexture( 30 | atlasWidth: number, 31 | atlasHeight: number 32 | ): [THREE.Texture, Float32Array] { 33 | const atlasSize = atlasWidth * atlasHeight; 34 | const data = new Float32Array(4 * atlasSize); 35 | 36 | const texture = new THREE.DataTexture( 37 | data, 38 | atlasWidth, 39 | atlasHeight, 40 | THREE.RGBAFormat, 41 | THREE.FloatType 42 | ); 43 | 44 | // use nearest filter inside the light probe scene for performance 45 | // @todo allow tweaking? 46 | texture.magFilter = THREE.NearestFilter; 47 | texture.minFilter = THREE.NearestFilter; 48 | texture.generateMipmaps = false; 49 | 50 | return [texture, data]; 51 | } 52 | 53 | function queueTexel( 54 | atlasMap: AtlasMap, 55 | texelIndex: number, 56 | renderLightProbe: ProbeBatchRenderer 57 | ): boolean { 58 | // get current atlas face we are filling up 59 | const texelInfoBase = texelIndex * 4; 60 | const texelPosU = atlasMap.data[texelInfoBase]; 61 | const texelPosV = atlasMap.data[texelInfoBase + 1]; 62 | const texelFaceEnc = atlasMap.data[texelInfoBase + 2]; 63 | 64 | // skip computation if this texel is empty 65 | if (texelFaceEnc === 0) { 66 | return false; 67 | } 68 | 69 | // otherwise, proceed with computation and exit 70 | const texelFaceIndexCombo = Math.round(texelFaceEnc - 1); 71 | const texelFaceIndex = texelFaceIndexCombo % MAX_ITEM_FACES; 72 | const texelItemIndex = 73 | (texelFaceIndexCombo - texelFaceIndex) / MAX_ITEM_FACES; 74 | 75 | if (texelItemIndex < 0 || texelItemIndex >= atlasMap.items.length) { 76 | throw new Error( 77 | `incorrect atlas map item data: ${texelPosU}, ${texelPosV}, ${texelFaceEnc}` 78 | ); 79 | } 80 | 81 | const atlasItem = atlasMap.items[texelItemIndex]; 82 | 83 | if (texelFaceIndex < 0 || texelFaceIndex >= atlasItem.faceCount) { 84 | throw new Error( 85 | `incorrect atlas map face data: ${texelPosU}, ${texelPosV}, ${texelFaceEnc}` 86 | ); 87 | } 88 | 89 | // render the probe viewports (will read the data later) 90 | renderLightProbe(texelIndex, atlasItem, texelFaceIndex, texelPosU, texelPosV); 91 | 92 | // signal that computation happened 93 | return true; 94 | } 95 | 96 | // collect and combine pixel aggregate from rendered probe viewports 97 | // (this ignores the alpha channel from viewports) 98 | function readTexel( 99 | rgba: THREE.Vector4, 100 | readLightProbe: ProbeBatchReader, 101 | probePixelAreaLookup: number[] 102 | ) { 103 | let r = 0, 104 | g = 0, 105 | b = 0, 106 | totalDivider = 0; 107 | 108 | readLightProbe((probeData, rowPixelStride, box, originX, originY) => { 109 | const probeTargetSize = box.z; // assuming width is always full 110 | 111 | const rowStride = rowPixelStride * 4; 112 | let rowStart = box.y * rowStride + box.x * 4; 113 | const totalMax = (box.y + box.w) * rowStride; 114 | let py = originY; 115 | 116 | while (rowStart < totalMax) { 117 | const rowMax = rowStart + box.z * 4; 118 | let px = originX; 119 | 120 | for (let i = rowStart; i < rowMax; i += 4) { 121 | // compute multiplier as affected by inclination of corresponding ray 122 | const area = probePixelAreaLookup[py * probeTargetSize + px]; 123 | 124 | r += area * probeData[i]; 125 | g += area * probeData[i + 1]; 126 | b += area * probeData[i + 2]; 127 | 128 | totalDivider += area; 129 | 130 | px += 1; 131 | } 132 | 133 | rowStart += rowStride; 134 | py += 1; 135 | } 136 | }); 137 | 138 | // alpha is set later 139 | rgba.x = r / totalDivider; 140 | rgba.y = g / totalDivider; 141 | rgba.z = b / totalDivider; 142 | } 143 | 144 | // offsets for 3x3 brush 145 | const offDirX = [1, 1, 0, -1, -1, -1, 0, 1]; 146 | const offDirY = [0, 1, 1, 1, 0, -1, -1, -1]; 147 | 148 | function storeLightMapValue( 149 | atlasData: Float32Array, 150 | atlasWidth: number, 151 | totalTexelCount: number, 152 | texelIndex: number, 153 | passOutputData: Float32Array 154 | ) { 155 | // read existing texel value (if adding) 156 | const mainOffTexelBase = texelIndex * 4; 157 | 158 | tmpRgba.w = 1; // reset alpha to 1 to indicate filled pixel 159 | 160 | // main texel write 161 | tmpRgba.toArray(passOutputData, mainOffTexelBase); 162 | 163 | // propagate combined value to 3x3 brush area 164 | const texelX = texelIndex % atlasWidth; 165 | const texelRowStart = texelIndex - texelX; 166 | 167 | for (let offDir = 0; offDir < 8; offDir += 1) { 168 | const offX = offDirX[offDir]; 169 | const offY = offDirY[offDir]; 170 | 171 | const offRowX = (atlasWidth + texelX + offX) % atlasWidth; 172 | const offRowStart = 173 | (totalTexelCount + texelRowStart + offY * atlasWidth) % totalTexelCount; 174 | const offTexelBase = (offRowStart + offRowX) * 4; 175 | 176 | // fill texel if it will not/did not receive real computed data otherwise; 177 | // also ensure strong neighbour values (not diagonal) take precedence 178 | // (using layer output data to check for past writes since it is re-initialized per pass) 179 | const offTexelFaceEnc = atlasData[offTexelBase + 2]; 180 | const isStrongNeighbour = offX === 0 || offY === 0; 181 | const isUnfilled = passOutputData[offTexelBase + 3] === 0; 182 | 183 | if (offTexelFaceEnc === 0 && (isStrongNeighbour || isUnfilled)) { 184 | // no need to separately read existing value for brush-propagated texels 185 | tmpRgba.toArray(passOutputData, offTexelBase); 186 | } 187 | } 188 | } 189 | 190 | // individual renderer worker lifecycle instance 191 | // (in parent, key to workbench.id to restart on changes) 192 | // @todo report completed flag 193 | const IrradianceRenderer: React.FC<{ 194 | workbench: Workbench; 195 | onComplete: () => void; 196 | onDebugLightProbe?: (debugLightProbeTexture: THREE.Texture) => void; 197 | }> = (props) => { 198 | // get the work manager hook 199 | const useWorkManager = useContext(WorkManagerContext); 200 | if (useWorkManager === null) { 201 | throw new Error('expected work manager'); 202 | } 203 | 204 | // read once 205 | const workbenchRef = useRef(props.workbench); 206 | 207 | // wrap params in ref to avoid unintended re-triggering 208 | const onCompleteRef = useRef(props.onComplete); 209 | onCompleteRef.current = props.onComplete; 210 | const onDebugLightProbeRef = useRef(props.onDebugLightProbe); 211 | onDebugLightProbeRef.current = props.onDebugLightProbe; 212 | 213 | // main lightmap data accumulator 214 | const [irradiance, irradianceData] = useIrradianceRendererData(); 215 | 216 | // texel indexes for randomized processing (literally just a randomly shuffled index array) 217 | // @todo is this relevant anymore? 218 | const texelPickMap = useMemo(() => { 219 | const { atlasMap } = workbenchRef.current; 220 | const { width: atlasWidth, height: atlasHeight } = atlasMap; 221 | const totalTexelCount = atlasWidth * atlasHeight; 222 | 223 | const result = new Array(totalTexelCount); 224 | 225 | // perform main fill in separate tick for responsiveness 226 | setTimeout(() => { 227 | const originalSequence = new Array(totalTexelCount); 228 | 229 | // nested loop to avoid tripping sandbox infinite loop detection 230 | for (let i = 0; i < atlasHeight; i += 1) { 231 | for (let j = 0; j < atlasWidth; j += 1) { 232 | const index = i * atlasWidth + j; 233 | originalSequence[index] = index; 234 | } 235 | } 236 | 237 | // nested loop to avoid tripping sandbox infinite loop detection 238 | for (let i = 0; i < atlasHeight; i += 1) { 239 | for (let j = 0; j < atlasWidth; j += 1) { 240 | const index = i * atlasWidth + j; 241 | const randomIndex = Math.random() * originalSequence.length; 242 | const sequenceElement = originalSequence.splice(randomIndex, 1)[0]; 243 | result[index] = sequenceElement; 244 | } 245 | } 246 | }, 0); 247 | 248 | return result; 249 | }, []); 250 | 251 | const [processingState, setProcessingState] = useState(() => { 252 | return { 253 | passOutput: undefined as THREE.Texture | undefined, // current pass's output 254 | passOutputData: undefined as Float32Array | undefined, // current pass's output data 255 | passTexelCounter: [0], // directly changed in place to avoid re-renders 256 | passComplete: true, // this triggers new pass on next render 257 | passesRemaining: MAX_PASSES 258 | }; 259 | }); 260 | 261 | // kick off new pass when current one is complete 262 | useEffect(() => { 263 | const { atlasMap } = workbenchRef.current; 264 | const { passComplete, passesRemaining } = processingState; 265 | 266 | // check if there is anything to do 267 | if (!passComplete) { 268 | return; 269 | } 270 | 271 | // store and discard the active layer output texture 272 | if (processingState.passOutput && processingState.passOutputData) { 273 | irradianceData.set(processingState.passOutputData); 274 | irradiance.needsUpdate = true; 275 | processingState.passOutput.dispose(); 276 | } 277 | 278 | // check if a new pass has to be set up 279 | if (passesRemaining === 0) { 280 | // if done, dereference large data objects to help free up memory 281 | setProcessingState((prev) => { 282 | if (!prev.passOutputData) { 283 | return prev; 284 | } 285 | return { ...prev, passOutputData: undefined }; 286 | }); 287 | 288 | // notify parent 289 | onCompleteRef.current(); 290 | 291 | return; 292 | } 293 | 294 | // set up a new output texture for new pass 295 | // @todo this might not even need to be a texture? but could be useful for live debug display 296 | const [passOutput, passOutputData] = createTemporaryLightMapTexture( 297 | workbenchRef.current.atlasMap.width, 298 | workbenchRef.current.atlasMap.height 299 | ); 300 | 301 | setProcessingState((prev) => { 302 | return { 303 | passOutput, 304 | passOutputData, 305 | passTexelCounter: [0], 306 | passComplete: false, 307 | passesRemaining: prev.passesRemaining - 1 308 | }; 309 | }); 310 | }, [processingState, irradiance, irradianceData]); 311 | 312 | const probeTargetSize = 16; 313 | const { renderLightProbeBatch, probePixelAreaLookup } = useLightProbe( 314 | probeTargetSize 315 | ); 316 | 317 | const outputIsComplete = 318 | processingState.passesRemaining === 0 && processingState.passComplete; 319 | 320 | useWorkManager( 321 | outputIsComplete 322 | ? null 323 | : (gl) => { 324 | const { 325 | passTexelCounter, 326 | passOutput, 327 | passOutputData 328 | } = processingState; 329 | 330 | const { atlasMap } = workbenchRef.current; 331 | const { width: atlasWidth, height: atlasHeight } = atlasMap; 332 | const totalTexelCount = atlasWidth * atlasHeight; 333 | 334 | // wait for lookup map to be built up 335 | if (texelPickMap.length !== totalTexelCount) { 336 | return; 337 | } 338 | 339 | if (!passOutputData || !passOutput) { 340 | throw new Error('unexpected missing output'); 341 | } 342 | 343 | renderLightProbeBatch( 344 | gl, 345 | workbenchRef.current.lightScene, 346 | (renderBatchItem) => { 347 | // allow for skipping a certain amount of empty texels 348 | const maxCounter = Math.min( 349 | totalTexelCount, 350 | passTexelCounter[0] + 100 351 | ); 352 | 353 | // keep trying texels until non-empty one is found 354 | while (passTexelCounter[0] < maxCounter) { 355 | const currentCounter = passTexelCounter[0]; 356 | 357 | // always update texel count 358 | passTexelCounter[0] += 1; 359 | 360 | if ( 361 | !queueTexel( 362 | atlasMap, 363 | texelPickMap[currentCounter], 364 | renderBatchItem 365 | ) 366 | ) { 367 | continue; 368 | } 369 | 370 | // if something was queued, stop the loop 371 | break; 372 | } 373 | }, 374 | (texelIndex, readLightProbe) => { 375 | readTexel(tmpRgba, readLightProbe, probePixelAreaLookup); 376 | 377 | // store resulting total illumination 378 | storeLightMapValue( 379 | atlasMap.data, 380 | atlasWidth, 381 | totalTexelCount, 382 | texelIndex, 383 | passOutputData 384 | ); 385 | passOutput.needsUpdate = true; 386 | } 387 | ); 388 | 389 | // mark state as completed once all texels are done 390 | if (passTexelCounter[0] >= totalTexelCount) { 391 | setProcessingState((prev) => { 392 | return { 393 | ...prev, 394 | passComplete: true 395 | }; 396 | }); 397 | } 398 | } 399 | ); 400 | 401 | // debug probe 402 | const { 403 | renderLightProbeBatch: debugProbeBatch, 404 | debugLightProbeTexture 405 | } = useLightProbe(probeTargetSize); 406 | const debugProbeRef = useRef(false); 407 | useFrame(({ gl }) => { 408 | // run only once 409 | if (debugProbeRef.current) { 410 | return; 411 | } 412 | debugProbeRef.current = true; 413 | 414 | const { atlasMap } = workbenchRef.current; 415 | 416 | let batchCount = 0; 417 | 418 | debugProbeBatch( 419 | gl, 420 | workbenchRef.current.lightScene, 421 | (renderBatchItem) => { 422 | queueTexel( 423 | atlasMap, 424 | atlasMap.width * 1 + 1 + batchCount, 425 | renderBatchItem 426 | ); 427 | batchCount += 1; 428 | }, 429 | () => { 430 | // no-op (not consuming the data) 431 | } 432 | ); 433 | }); 434 | 435 | // report debug texture 436 | useEffect(() => { 437 | if (onDebugLightProbeRef.current) { 438 | onDebugLightProbeRef.current(debugLightProbeTexture); 439 | } 440 | }, [debugLightProbeTexture]); 441 | 442 | return null; 443 | }; 444 | 445 | export default IrradianceRenderer; 446 | -------------------------------------------------------------------------------- /src/stories/helvetiker.json: -------------------------------------------------------------------------------- 1 | {"glyphs":{"ο":{"x_min":0,"x_max":712,"ha":815,"o":"m 356 -25 q 96 88 192 -25 q 0 368 0 201 q 92 642 0 533 q 356 761 192 761 q 617 644 517 761 q 712 368 712 533 q 619 91 712 201 q 356 -25 520 -25 m 356 85 q 527 175 465 85 q 583 369 583 255 q 528 562 583 484 q 356 651 466 651 q 189 560 250 651 q 135 369 135 481 q 187 177 135 257 q 356 85 250 85 "},"S":{"x_min":0,"x_max":788,"ha":890,"o":"m 788 291 q 662 54 788 144 q 397 -26 550 -26 q 116 68 226 -26 q 0 337 0 168 l 131 337 q 200 152 131 220 q 384 85 269 85 q 557 129 479 85 q 650 270 650 183 q 490 429 650 379 q 194 513 341 470 q 33 739 33 584 q 142 964 33 881 q 388 1041 242 1041 q 644 957 543 1041 q 756 716 756 867 l 625 716 q 561 874 625 816 q 395 933 497 933 q 243 891 309 933 q 164 759 164 841 q 325 609 164 656 q 625 526 475 568 q 788 291 788 454 "},"¦":{"x_min":343,"x_max":449,"ha":792,"o":"m 449 462 l 343 462 l 343 986 l 449 986 l 449 462 m 449 -242 l 343 -242 l 343 280 l 449 280 l 449 -242 "},"/":{"x_min":183.25,"x_max":608.328125,"ha":792,"o":"m 608 1041 l 266 -129 l 183 -129 l 520 1041 l 608 1041 "},"Τ":{"x_min":-0.4375,"x_max":777.453125,"ha":839,"o":"m 777 893 l 458 893 l 458 0 l 319 0 l 319 892 l 0 892 l 0 1013 l 777 1013 l 777 893 "},"y":{"x_min":0,"x_max":684.78125,"ha":771,"o":"m 684 738 l 388 -83 q 311 -216 356 -167 q 173 -279 252 -279 q 97 -266 133 -279 l 97 -149 q 132 -155 109 -151 q 168 -160 155 -160 q 240 -114 213 -160 q 274 -26 248 -98 l 0 738 l 137 737 l 341 139 l 548 737 l 684 738 "},"Π":{"x_min":0,"x_max":803,"ha":917,"o":"m 803 0 l 667 0 l 667 886 l 140 886 l 140 0 l 0 0 l 0 1012 l 803 1012 l 803 0 "},"ΐ":{"x_min":-111,"x_max":339,"ha":361,"o":"m 339 800 l 229 800 l 229 925 l 339 925 l 339 800 m -1 800 l -111 800 l -111 925 l -1 925 l -1 800 m 284 3 q 233 -10 258 -5 q 182 -15 207 -15 q 85 26 119 -15 q 42 200 42 79 l 42 737 l 167 737 l 168 215 q 172 141 168 157 q 226 101 183 101 q 248 103 239 101 q 284 112 257 104 l 284 3 m 302 1040 l 113 819 l 30 819 l 165 1040 l 302 1040 "},"g":{"x_min":0,"x_max":686,"ha":838,"o":"m 686 34 q 586 -213 686 -121 q 331 -306 487 -306 q 131 -252 216 -306 q 31 -84 31 -190 l 155 -84 q 228 -174 166 -138 q 345 -207 284 -207 q 514 -109 454 -207 q 564 89 564 -27 q 461 6 521 36 q 335 -23 401 -23 q 88 100 184 -23 q 0 370 0 215 q 87 634 0 522 q 330 758 183 758 q 457 728 398 758 q 564 644 515 699 l 564 737 l 686 737 l 686 34 m 582 367 q 529 560 582 481 q 358 652 468 652 q 189 561 250 652 q 135 369 135 482 q 189 176 135 255 q 361 85 251 85 q 529 176 468 85 q 582 367 582 255 "},"²":{"x_min":0,"x_max":442,"ha":539,"o":"m 442 383 l 0 383 q 91 566 0 492 q 260 668 176 617 q 354 798 354 727 q 315 875 354 845 q 227 905 277 905 q 136 869 173 905 q 99 761 99 833 l 14 761 q 82 922 14 864 q 232 974 141 974 q 379 926 316 974 q 442 797 442 878 q 351 635 442 704 q 183 539 321 611 q 92 455 92 491 l 442 455 l 442 383 "},"–":{"x_min":0,"x_max":705.5625,"ha":803,"o":"m 705 334 l 0 334 l 0 410 l 705 410 l 705 334 "},"Κ":{"x_min":0,"x_max":819.5625,"ha":893,"o":"m 819 0 l 650 0 l 294 509 l 139 356 l 139 0 l 0 0 l 0 1013 l 139 1013 l 139 526 l 626 1013 l 809 1013 l 395 600 l 819 0 "},"ƒ":{"x_min":-46.265625,"x_max":392,"ha":513,"o":"m 392 651 l 259 651 l 79 -279 l -46 -278 l 134 651 l 14 651 l 14 751 l 135 751 q 151 948 135 900 q 304 1041 185 1041 q 334 1040 319 1041 q 392 1034 348 1039 l 392 922 q 337 931 360 931 q 271 883 287 931 q 260 793 260 853 l 260 751 l 392 751 l 392 651 "},"e":{"x_min":0,"x_max":714,"ha":813,"o":"m 714 326 l 140 326 q 200 157 140 227 q 359 87 260 87 q 488 130 431 87 q 561 245 545 174 l 697 245 q 577 48 670 123 q 358 -26 484 -26 q 97 85 195 -26 q 0 363 0 197 q 94 642 0 529 q 358 765 195 765 q 626 627 529 765 q 714 326 714 503 m 576 429 q 507 583 564 522 q 355 650 445 650 q 206 583 266 650 q 140 429 152 522 l 576 429 "},"ό":{"x_min":0,"x_max":712,"ha":815,"o":"m 356 -25 q 94 91 194 -25 q 0 368 0 202 q 92 642 0 533 q 356 761 192 761 q 617 644 517 761 q 712 368 712 533 q 619 91 712 201 q 356 -25 520 -25 m 356 85 q 527 175 465 85 q 583 369 583 255 q 528 562 583 484 q 356 651 466 651 q 189 560 250 651 q 135 369 135 481 q 187 177 135 257 q 356 85 250 85 m 576 1040 l 387 819 l 303 819 l 438 1040 l 576 1040 "},"J":{"x_min":0,"x_max":588,"ha":699,"o":"m 588 279 q 287 -26 588 -26 q 58 73 126 -26 q 0 327 0 158 l 133 327 q 160 172 133 227 q 288 96 198 96 q 426 171 391 96 q 449 336 449 219 l 449 1013 l 588 1013 l 588 279 "},"»":{"x_min":-1,"x_max":503,"ha":601,"o":"m 503 302 l 280 136 l 281 256 l 429 373 l 281 486 l 280 608 l 503 440 l 503 302 m 221 302 l 0 136 l 0 255 l 145 372 l 0 486 l -1 608 l 221 440 l 221 302 "},"©":{"x_min":-3,"x_max":1008,"ha":1106,"o":"m 502 -7 q 123 151 263 -7 q -3 501 -3 294 q 123 851 -3 706 q 502 1011 263 1011 q 881 851 739 1011 q 1008 501 1008 708 q 883 151 1008 292 q 502 -7 744 -7 m 502 60 q 830 197 709 60 q 940 501 940 322 q 831 805 940 681 q 502 944 709 944 q 174 805 296 944 q 65 501 65 680 q 173 197 65 320 q 502 60 294 60 m 741 394 q 661 246 731 302 q 496 190 591 190 q 294 285 369 190 q 228 497 228 370 q 295 714 228 625 q 499 813 370 813 q 656 762 588 813 q 733 625 724 711 l 634 625 q 589 704 629 673 q 498 735 550 735 q 377 666 421 735 q 334 504 334 597 q 374 340 334 408 q 490 272 415 272 q 589 304 549 272 q 638 394 628 337 l 741 394 "},"ώ":{"x_min":0,"x_max":922,"ha":1030,"o":"m 687 1040 l 498 819 l 415 819 l 549 1040 l 687 1040 m 922 339 q 856 97 922 203 q 650 -26 780 -26 q 538 9 587 -26 q 461 103 489 44 q 387 12 436 46 q 277 -22 339 -22 q 69 97 147 -22 q 0 338 0 202 q 45 551 0 444 q 161 737 84 643 l 302 737 q 175 552 219 647 q 124 336 124 446 q 155 179 124 248 q 275 88 197 88 q 375 163 341 88 q 400 294 400 219 l 400 572 l 524 572 l 524 294 q 561 135 524 192 q 643 88 591 88 q 762 182 719 88 q 797 341 797 257 q 745 555 797 450 q 619 737 705 637 l 760 737 q 874 551 835 640 q 922 339 922 444 "},"^":{"x_min":193.0625,"x_max":598.609375,"ha":792,"o":"m 598 772 l 515 772 l 395 931 l 277 772 l 193 772 l 326 1013 l 462 1013 l 598 772 "},"«":{"x_min":0,"x_max":507.203125,"ha":604,"o":"m 506 136 l 284 302 l 284 440 l 506 608 l 507 485 l 360 371 l 506 255 l 506 136 m 222 136 l 0 302 l 0 440 l 222 608 l 221 486 l 73 373 l 222 256 l 222 136 "},"D":{"x_min":0,"x_max":828,"ha":935,"o":"m 389 1013 q 714 867 593 1013 q 828 521 828 729 q 712 161 828 309 q 382 0 587 0 l 0 0 l 0 1013 l 389 1013 m 376 124 q 607 247 523 124 q 681 510 681 355 q 607 771 681 662 q 376 896 522 896 l 139 896 l 139 124 l 376 124 "},"∙":{"x_min":0,"x_max":142,"ha":239,"o":"m 142 585 l 0 585 l 0 738 l 142 738 l 142 585 "},"ÿ":{"x_min":0,"x_max":47,"ha":125,"o":"m 47 3 q 37 -7 47 -7 q 28 0 30 -7 q 39 -4 32 -4 q 45 3 45 -1 l 37 0 q 28 9 28 0 q 39 19 28 19 l 47 16 l 47 19 l 47 3 m 37 1 q 44 8 44 1 q 37 16 44 16 q 30 8 30 16 q 37 1 30 1 m 26 1 l 23 22 l 14 0 l 3 22 l 3 3 l 0 25 l 13 1 l 22 25 l 26 1 "},"w":{"x_min":0,"x_max":1009.71875,"ha":1100,"o":"m 1009 738 l 783 0 l 658 0 l 501 567 l 345 0 l 222 0 l 0 738 l 130 738 l 284 174 l 432 737 l 576 738 l 721 173 l 881 737 l 1009 738 "},"$":{"x_min":0,"x_max":700,"ha":793,"o":"m 664 717 l 542 717 q 490 825 531 785 q 381 872 450 865 l 381 551 q 620 446 540 522 q 700 241 700 370 q 618 45 700 116 q 381 -25 536 -25 l 381 -152 l 307 -152 l 307 -25 q 81 62 162 -25 q 0 297 0 149 l 124 297 q 169 146 124 204 q 307 81 215 89 l 307 441 q 80 536 148 469 q 13 725 13 603 q 96 910 13 839 q 307 982 180 982 l 307 1077 l 381 1077 l 381 982 q 574 917 494 982 q 664 717 664 845 m 307 565 l 307 872 q 187 831 233 872 q 142 724 142 791 q 180 618 142 656 q 307 565 218 580 m 381 76 q 562 237 562 96 q 517 361 562 313 q 381 423 472 409 l 381 76 "},"\\":{"x_min":-0.015625,"x_max":425.0625,"ha":522,"o":"m 425 -129 l 337 -129 l 0 1041 l 83 1041 l 425 -129 "},"µ":{"x_min":0,"x_max":697.21875,"ha":747,"o":"m 697 -4 q 629 -14 658 -14 q 498 97 513 -14 q 422 9 470 41 q 313 -23 374 -23 q 207 4 258 -23 q 119 81 156 32 l 119 -278 l 0 -278 l 0 738 l 124 738 l 124 343 q 165 173 124 246 q 308 83 216 83 q 452 178 402 83 q 493 359 493 255 l 493 738 l 617 738 l 617 214 q 623 136 617 160 q 673 92 637 92 q 697 96 684 92 l 697 -4 "},"Ι":{"x_min":42,"x_max":181,"ha":297,"o":"m 181 0 l 42 0 l 42 1013 l 181 1013 l 181 0 "},"Ύ":{"x_min":0,"x_max":1144.5,"ha":1214,"o":"m 1144 1012 l 807 416 l 807 0 l 667 0 l 667 416 l 325 1012 l 465 1012 l 736 533 l 1004 1012 l 1144 1012 m 277 1040 l 83 799 l 0 799 l 140 1040 l 277 1040 "},"’":{"x_min":0,"x_max":139,"ha":236,"o":"m 139 851 q 102 737 139 784 q 0 669 65 690 l 0 734 q 59 787 42 741 q 72 873 72 821 l 0 873 l 0 1013 l 139 1013 l 139 851 "},"Ν":{"x_min":0,"x_max":801,"ha":915,"o":"m 801 0 l 651 0 l 131 822 l 131 0 l 0 0 l 0 1013 l 151 1013 l 670 191 l 670 1013 l 801 1013 l 801 0 "},"-":{"x_min":8.71875,"x_max":350.390625,"ha":478,"o":"m 350 317 l 8 317 l 8 428 l 350 428 l 350 317 "},"Q":{"x_min":0,"x_max":968,"ha":1072,"o":"m 954 5 l 887 -79 l 744 35 q 622 -11 687 2 q 483 -26 556 -26 q 127 130 262 -26 q 0 504 0 279 q 127 880 0 728 q 484 1041 262 1041 q 841 884 708 1041 q 968 507 968 735 q 933 293 968 398 q 832 104 899 188 l 954 5 m 723 191 q 802 330 777 248 q 828 499 828 412 q 744 790 828 673 q 483 922 650 922 q 228 791 322 922 q 142 505 142 673 q 227 221 142 337 q 487 91 323 91 q 632 123 566 91 l 520 215 l 587 301 l 723 191 "},"ς":{"x_min":1,"x_max":676.28125,"ha":740,"o":"m 676 460 l 551 460 q 498 595 542 546 q 365 651 448 651 q 199 578 263 651 q 136 401 136 505 q 266 178 136 241 q 508 106 387 142 q 640 -50 640 62 q 625 -158 640 -105 q 583 -278 611 -211 l 465 -278 q 498 -182 490 -211 q 515 -80 515 -126 q 381 12 515 -15 q 134 91 197 51 q 1 388 1 179 q 100 651 1 542 q 354 761 199 761 q 587 680 498 761 q 676 460 676 599 "},"M":{"x_min":0,"x_max":954,"ha":1067,"o":"m 954 0 l 819 0 l 819 869 l 537 0 l 405 0 l 128 866 l 128 0 l 0 0 l 0 1013 l 200 1013 l 472 160 l 757 1013 l 954 1013 l 954 0 "},"Ψ":{"x_min":0,"x_max":1006,"ha":1094,"o":"m 1006 678 q 914 319 1006 429 q 571 200 814 200 l 571 0 l 433 0 l 433 200 q 92 319 194 200 q 0 678 0 429 l 0 1013 l 139 1013 l 139 679 q 191 417 139 492 q 433 326 255 326 l 433 1013 l 571 1013 l 571 326 l 580 326 q 813 423 747 326 q 868 679 868 502 l 868 1013 l 1006 1013 l 1006 678 "},"C":{"x_min":0,"x_max":886,"ha":944,"o":"m 886 379 q 760 87 886 201 q 455 -26 634 -26 q 112 136 236 -26 q 0 509 0 283 q 118 882 0 737 q 469 1041 245 1041 q 748 955 630 1041 q 879 708 879 859 l 745 708 q 649 862 724 805 q 473 920 573 920 q 219 791 312 920 q 136 509 136 675 q 217 229 136 344 q 470 99 311 99 q 672 179 591 99 q 753 379 753 259 l 886 379 "},"!":{"x_min":0,"x_max":138,"ha":236,"o":"m 138 684 q 116 409 138 629 q 105 244 105 299 l 33 244 q 16 465 33 313 q 0 684 0 616 l 0 1013 l 138 1013 l 138 684 m 138 0 l 0 0 l 0 151 l 138 151 l 138 0 "},"{":{"x_min":0,"x_max":480.5625,"ha":578,"o":"m 480 -286 q 237 -213 303 -286 q 187 -45 187 -159 q 194 48 187 -15 q 201 141 201 112 q 164 264 201 225 q 0 314 118 314 l 0 417 q 164 471 119 417 q 201 605 201 514 q 199 665 201 644 q 193 772 193 769 q 241 941 193 887 q 480 1015 308 1015 l 480 915 q 336 866 375 915 q 306 742 306 828 q 310 662 306 717 q 314 577 314 606 q 288 452 314 500 q 176 365 256 391 q 289 275 257 337 q 314 143 314 226 q 313 84 314 107 q 310 -11 310 -5 q 339 -131 310 -94 q 480 -182 377 -182 l 480 -286 "},"X":{"x_min":-0.015625,"x_max":854.15625,"ha":940,"o":"m 854 0 l 683 0 l 423 409 l 166 0 l 0 0 l 347 519 l 18 1013 l 186 1013 l 428 637 l 675 1013 l 836 1013 l 504 520 l 854 0 "},"#":{"x_min":0,"x_max":963.890625,"ha":1061,"o":"m 963 690 l 927 590 l 719 590 l 655 410 l 876 410 l 840 310 l 618 310 l 508 -3 l 393 -2 l 506 309 l 329 310 l 215 -2 l 102 -3 l 212 310 l 0 310 l 36 410 l 248 409 l 312 590 l 86 590 l 120 690 l 347 690 l 459 1006 l 573 1006 l 462 690 l 640 690 l 751 1006 l 865 1006 l 754 690 l 963 690 m 606 590 l 425 590 l 362 410 l 543 410 l 606 590 "},"ι":{"x_min":42,"x_max":284,"ha":361,"o":"m 284 3 q 233 -10 258 -5 q 182 -15 207 -15 q 85 26 119 -15 q 42 200 42 79 l 42 738 l 167 738 l 168 215 q 172 141 168 157 q 226 101 183 101 q 248 103 239 101 q 284 112 257 104 l 284 3 "},"Ά":{"x_min":0,"x_max":906.953125,"ha":982,"o":"m 283 1040 l 88 799 l 5 799 l 145 1040 l 283 1040 m 906 0 l 756 0 l 650 303 l 251 303 l 143 0 l 0 0 l 376 1012 l 529 1012 l 906 0 m 609 421 l 452 866 l 293 421 l 609 421 "},")":{"x_min":0,"x_max":318,"ha":415,"o":"m 318 365 q 257 25 318 191 q 87 -290 197 -141 l 0 -290 q 140 21 93 -128 q 193 360 193 189 q 141 704 193 537 q 0 1024 97 850 l 87 1024 q 257 706 197 871 q 318 365 318 542 "},"ε":{"x_min":0,"x_max":634.71875,"ha":714,"o":"m 634 234 q 527 38 634 110 q 300 -25 433 -25 q 98 29 183 -25 q 0 204 0 93 q 37 314 0 265 q 128 390 67 353 q 56 460 82 419 q 26 555 26 505 q 114 712 26 654 q 295 763 191 763 q 499 700 416 763 q 589 515 589 631 l 478 515 q 419 618 464 580 q 307 657 374 657 q 207 630 253 657 q 151 547 151 598 q 238 445 151 469 q 389 434 280 434 l 389 331 l 349 331 q 206 315 255 331 q 125 210 125 287 q 183 107 125 145 q 302 76 233 76 q 436 117 379 76 q 509 234 493 159 l 634 234 "},"Δ":{"x_min":0,"x_max":952.78125,"ha":1028,"o":"m 952 0 l 0 0 l 400 1013 l 551 1013 l 952 0 m 762 124 l 476 867 l 187 124 l 762 124 "},"}":{"x_min":0,"x_max":481,"ha":578,"o":"m 481 314 q 318 262 364 314 q 282 136 282 222 q 284 65 282 97 q 293 -58 293 -48 q 241 -217 293 -166 q 0 -286 174 -286 l 0 -182 q 143 -130 105 -182 q 171 -2 171 -93 q 168 81 171 22 q 165 144 165 140 q 188 275 165 229 q 306 365 220 339 q 191 455 224 391 q 165 588 165 505 q 168 681 165 624 q 171 742 171 737 q 141 865 171 827 q 0 915 102 915 l 0 1015 q 243 942 176 1015 q 293 773 293 888 q 287 675 293 741 q 282 590 282 608 q 318 466 282 505 q 481 417 364 417 l 481 314 "},"‰":{"x_min":-3,"x_max":1672,"ha":1821,"o":"m 846 0 q 664 76 732 0 q 603 244 603 145 q 662 412 603 344 q 846 489 729 489 q 1027 412 959 489 q 1089 244 1089 343 q 1029 76 1089 144 q 846 0 962 0 m 845 103 q 945 143 910 103 q 981 243 981 184 q 947 340 981 301 q 845 385 910 385 q 745 342 782 385 q 709 243 709 300 q 742 147 709 186 q 845 103 781 103 m 888 986 l 284 -25 l 199 -25 l 803 986 l 888 986 m 241 468 q 58 545 126 468 q -3 715 -3 615 q 56 881 -3 813 q 238 958 124 958 q 421 881 353 958 q 483 712 483 813 q 423 544 483 612 q 241 468 356 468 m 241 855 q 137 811 175 855 q 100 710 100 768 q 136 612 100 653 q 240 572 172 572 q 344 614 306 572 q 382 713 382 656 q 347 810 382 771 q 241 855 308 855 m 1428 0 q 1246 76 1314 0 q 1185 244 1185 145 q 1244 412 1185 344 q 1428 489 1311 489 q 1610 412 1542 489 q 1672 244 1672 343 q 1612 76 1672 144 q 1428 0 1545 0 m 1427 103 q 1528 143 1492 103 q 1564 243 1564 184 q 1530 340 1564 301 q 1427 385 1492 385 q 1327 342 1364 385 q 1291 243 1291 300 q 1324 147 1291 186 q 1427 103 1363 103 "},"a":{"x_min":0,"x_max":698.609375,"ha":794,"o":"m 698 0 q 661 -12 679 -7 q 615 -17 643 -17 q 536 12 564 -17 q 500 96 508 41 q 384 6 456 37 q 236 -25 312 -25 q 65 31 130 -25 q 0 194 0 88 q 118 390 0 334 q 328 435 180 420 q 488 483 476 451 q 495 523 495 504 q 442 619 495 584 q 325 654 389 654 q 209 617 257 654 q 152 513 161 580 l 33 513 q 123 705 33 633 q 332 772 207 772 q 528 712 448 772 q 617 531 617 645 l 617 163 q 624 108 617 126 q 664 90 632 90 l 698 94 l 698 0 m 491 262 l 491 372 q 272 329 350 347 q 128 201 128 294 q 166 113 128 144 q 264 83 205 83 q 414 130 346 83 q 491 262 491 183 "},"—":{"x_min":0,"x_max":941.671875,"ha":1039,"o":"m 941 334 l 0 334 l 0 410 l 941 410 l 941 334 "},"=":{"x_min":8.71875,"x_max":780.953125,"ha":792,"o":"m 780 510 l 8 510 l 8 606 l 780 606 l 780 510 m 780 235 l 8 235 l 8 332 l 780 332 l 780 235 "},"N":{"x_min":0,"x_max":801,"ha":914,"o":"m 801 0 l 651 0 l 131 823 l 131 0 l 0 0 l 0 1013 l 151 1013 l 670 193 l 670 1013 l 801 1013 l 801 0 "},"ρ":{"x_min":0,"x_max":712,"ha":797,"o":"m 712 369 q 620 94 712 207 q 362 -26 521 -26 q 230 2 292 -26 q 119 83 167 30 l 119 -278 l 0 -278 l 0 362 q 91 643 0 531 q 355 764 190 764 q 617 647 517 764 q 712 369 712 536 m 583 366 q 530 559 583 480 q 359 651 469 651 q 190 562 252 651 q 135 370 135 483 q 189 176 135 257 q 359 85 250 85 q 528 175 466 85 q 583 366 583 254 "},"2":{"x_min":59,"x_max":731,"ha":792,"o":"m 731 0 l 59 0 q 197 314 59 188 q 457 487 199 315 q 598 691 598 580 q 543 819 598 772 q 411 867 488 867 q 272 811 328 867 q 209 630 209 747 l 81 630 q 182 901 81 805 q 408 986 271 986 q 629 909 536 986 q 731 694 731 826 q 613 449 731 541 q 378 316 495 383 q 201 122 235 234 l 731 122 l 731 0 "},"¯":{"x_min":0,"x_max":941.671875,"ha":938,"o":"m 941 1033 l 0 1033 l 0 1109 l 941 1109 l 941 1033 "},"Z":{"x_min":0,"x_max":779,"ha":849,"o":"m 779 0 l 0 0 l 0 113 l 621 896 l 40 896 l 40 1013 l 779 1013 l 778 887 l 171 124 l 779 124 l 779 0 "},"u":{"x_min":0,"x_max":617,"ha":729,"o":"m 617 0 l 499 0 l 499 110 q 391 10 460 45 q 246 -25 322 -25 q 61 58 127 -25 q 0 258 0 136 l 0 738 l 125 738 l 125 284 q 156 148 125 202 q 273 82 197 82 q 433 165 369 82 q 493 340 493 243 l 493 738 l 617 738 l 617 0 "},"k":{"x_min":0,"x_max":612.484375,"ha":697,"o":"m 612 738 l 338 465 l 608 0 l 469 0 l 251 382 l 121 251 l 121 0 l 0 0 l 0 1013 l 121 1013 l 121 402 l 456 738 l 612 738 "},"Η":{"x_min":0,"x_max":803,"ha":917,"o":"m 803 0 l 667 0 l 667 475 l 140 475 l 140 0 l 0 0 l 0 1013 l 140 1013 l 140 599 l 667 599 l 667 1013 l 803 1013 l 803 0 "},"Α":{"x_min":0,"x_max":906.953125,"ha":985,"o":"m 906 0 l 756 0 l 650 303 l 251 303 l 143 0 l 0 0 l 376 1013 l 529 1013 l 906 0 m 609 421 l 452 866 l 293 421 l 609 421 "},"s":{"x_min":0,"x_max":604,"ha":697,"o":"m 604 217 q 501 36 604 104 q 292 -23 411 -23 q 86 43 166 -23 q 0 238 0 114 l 121 237 q 175 122 121 164 q 300 85 223 85 q 415 112 363 85 q 479 207 479 147 q 361 309 479 276 q 140 372 141 370 q 21 544 21 426 q 111 708 21 647 q 298 761 190 761 q 492 705 413 761 q 583 531 583 643 l 462 531 q 412 625 462 594 q 298 657 363 657 q 199 636 242 657 q 143 558 143 608 q 262 454 143 486 q 484 394 479 397 q 604 217 604 341 "},"B":{"x_min":0,"x_max":778,"ha":876,"o":"m 580 546 q 724 469 670 535 q 778 311 778 403 q 673 83 778 171 q 432 0 575 0 l 0 0 l 0 1013 l 411 1013 q 629 957 541 1013 q 732 768 732 892 q 691 633 732 693 q 580 546 650 572 m 393 899 l 139 899 l 139 588 l 379 588 q 521 624 462 588 q 592 744 592 667 q 531 859 592 819 q 393 899 471 899 m 419 124 q 566 169 504 124 q 635 303 635 219 q 559 436 635 389 q 402 477 494 477 l 139 477 l 139 124 l 419 124 "},"…":{"x_min":0,"x_max":614,"ha":708,"o":"m 142 0 l 0 0 l 0 151 l 142 151 l 142 0 m 378 0 l 236 0 l 236 151 l 378 151 l 378 0 m 614 0 l 472 0 l 472 151 l 614 151 l 614 0 "},"?":{"x_min":0,"x_max":607,"ha":704,"o":"m 607 777 q 543 599 607 674 q 422 474 482 537 q 357 272 357 391 l 236 272 q 297 487 236 395 q 411 619 298 490 q 474 762 474 691 q 422 885 474 838 q 301 933 371 933 q 179 880 228 933 q 124 706 124 819 l 0 706 q 94 963 0 872 q 302 1044 177 1044 q 511 973 423 1044 q 607 777 607 895 m 370 0 l 230 0 l 230 151 l 370 151 l 370 0 "},"H":{"x_min":0,"x_max":803,"ha":915,"o":"m 803 0 l 667 0 l 667 475 l 140 475 l 140 0 l 0 0 l 0 1013 l 140 1013 l 140 599 l 667 599 l 667 1013 l 803 1013 l 803 0 "},"ν":{"x_min":0,"x_max":675,"ha":761,"o":"m 675 738 l 404 0 l 272 0 l 0 738 l 133 738 l 340 147 l 541 738 l 675 738 "},"c":{"x_min":1,"x_max":701.390625,"ha":775,"o":"m 701 264 q 584 53 681 133 q 353 -26 487 -26 q 91 91 188 -26 q 1 370 1 201 q 92 645 1 537 q 353 761 190 761 q 572 688 479 761 q 690 493 666 615 l 556 493 q 487 606 545 562 q 356 650 428 650 q 186 563 246 650 q 134 372 134 487 q 188 179 134 258 q 359 88 250 88 q 492 136 437 88 q 566 264 548 185 l 701 264 "},"¶":{"x_min":0,"x_max":566.671875,"ha":678,"o":"m 21 892 l 52 892 l 98 761 l 145 892 l 176 892 l 178 741 l 157 741 l 157 867 l 108 741 l 88 741 l 40 871 l 40 741 l 21 741 l 21 892 m 308 854 l 308 731 q 252 691 308 691 q 227 691 240 691 q 207 696 213 695 l 207 712 l 253 706 q 288 733 288 706 l 288 763 q 244 741 279 741 q 193 797 193 741 q 261 860 193 860 q 287 860 273 860 q 308 854 302 855 m 288 842 l 263 843 q 213 796 213 843 q 248 756 213 756 q 288 796 288 756 l 288 842 m 566 988 l 502 988 l 502 -1 l 439 -1 l 439 988 l 317 988 l 317 -1 l 252 -1 l 252 602 q 81 653 155 602 q 0 805 0 711 q 101 989 0 918 q 309 1053 194 1053 l 566 1053 l 566 988 "},"β":{"x_min":0,"x_max":660,"ha":745,"o":"m 471 550 q 610 450 561 522 q 660 280 660 378 q 578 64 660 151 q 367 -22 497 -22 q 239 5 299 -22 q 126 82 178 32 l 126 -278 l 0 -278 l 0 593 q 54 903 0 801 q 318 1042 127 1042 q 519 964 436 1042 q 603 771 603 887 q 567 644 603 701 q 471 550 532 586 m 337 79 q 476 138 418 79 q 535 279 535 198 q 427 437 535 386 q 226 477 344 477 l 226 583 q 398 620 329 583 q 486 762 486 668 q 435 884 486 833 q 312 935 384 935 q 169 861 219 935 q 126 698 126 797 l 126 362 q 170 169 126 242 q 337 79 224 79 "},"Μ":{"x_min":0,"x_max":954,"ha":1068,"o":"m 954 0 l 819 0 l 819 868 l 537 0 l 405 0 l 128 865 l 128 0 l 0 0 l 0 1013 l 199 1013 l 472 158 l 758 1013 l 954 1013 l 954 0 "},"Ό":{"x_min":0.109375,"x_max":1120,"ha":1217,"o":"m 1120 505 q 994 132 1120 282 q 642 -29 861 -29 q 290 130 422 -29 q 167 505 167 280 q 294 883 167 730 q 650 1046 430 1046 q 999 882 868 1046 q 1120 505 1120 730 m 977 504 q 896 784 977 669 q 644 915 804 915 q 391 785 484 915 q 307 504 307 669 q 391 224 307 339 q 644 95 486 95 q 894 224 803 95 q 977 504 977 339 m 277 1040 l 83 799 l 0 799 l 140 1040 l 277 1040 "},"Ή":{"x_min":0,"x_max":1158,"ha":1275,"o":"m 1158 0 l 1022 0 l 1022 475 l 496 475 l 496 0 l 356 0 l 356 1012 l 496 1012 l 496 599 l 1022 599 l 1022 1012 l 1158 1012 l 1158 0 m 277 1040 l 83 799 l 0 799 l 140 1040 l 277 1040 "},"•":{"x_min":0,"x_max":663.890625,"ha":775,"o":"m 663 529 q 566 293 663 391 q 331 196 469 196 q 97 294 194 196 q 0 529 0 393 q 96 763 0 665 q 331 861 193 861 q 566 763 469 861 q 663 529 663 665 "},"¥":{"x_min":0.1875,"x_max":819.546875,"ha":886,"o":"m 563 561 l 697 561 l 696 487 l 520 487 l 482 416 l 482 380 l 697 380 l 695 308 l 482 308 l 482 0 l 342 0 l 342 308 l 125 308 l 125 380 l 342 380 l 342 417 l 303 487 l 125 487 l 125 561 l 258 561 l 0 1013 l 140 1013 l 411 533 l 679 1013 l 819 1013 l 563 561 "},"(":{"x_min":0,"x_max":318.0625,"ha":415,"o":"m 318 -290 l 230 -290 q 61 23 122 -142 q 0 365 0 190 q 62 712 0 540 q 230 1024 119 869 l 318 1024 q 175 705 219 853 q 125 360 125 542 q 176 22 125 187 q 318 -290 223 -127 "},"U":{"x_min":0,"x_max":796,"ha":904,"o":"m 796 393 q 681 93 796 212 q 386 -25 566 -25 q 101 95 208 -25 q 0 393 0 211 l 0 1013 l 138 1013 l 138 391 q 204 191 138 270 q 394 107 276 107 q 586 191 512 107 q 656 391 656 270 l 656 1013 l 796 1013 l 796 393 "},"γ":{"x_min":0.5,"x_max":744.953125,"ha":822,"o":"m 744 737 l 463 54 l 463 -278 l 338 -278 l 338 54 l 154 495 q 104 597 124 569 q 13 651 67 651 l 0 651 l 0 751 l 39 753 q 168 711 121 753 q 242 594 207 676 l 403 208 l 617 737 l 744 737 "},"α":{"x_min":0,"x_max":765.5625,"ha":809,"o":"m 765 -4 q 698 -14 726 -14 q 564 97 586 -14 q 466 7 525 40 q 337 -26 407 -26 q 88 98 186 -26 q 0 369 0 212 q 88 637 0 525 q 337 760 184 760 q 465 728 407 760 q 563 637 524 696 l 563 739 l 685 739 l 685 222 q 693 141 685 168 q 748 94 708 94 q 765 96 760 94 l 765 -4 m 584 371 q 531 562 584 485 q 360 653 470 653 q 192 566 254 653 q 135 379 135 489 q 186 181 135 261 q 358 84 247 84 q 528 176 465 84 q 584 371 584 260 "},"F":{"x_min":0,"x_max":683.328125,"ha":717,"o":"m 683 888 l 140 888 l 140 583 l 613 583 l 613 458 l 140 458 l 140 0 l 0 0 l 0 1013 l 683 1013 l 683 888 "},"­":{"x_min":0,"x_max":705.5625,"ha":803,"o":"m 705 334 l 0 334 l 0 410 l 705 410 l 705 334 "},":":{"x_min":0,"x_max":142,"ha":239,"o":"m 142 585 l 0 585 l 0 738 l 142 738 l 142 585 m 142 0 l 0 0 l 0 151 l 142 151 l 142 0 "},"Χ":{"x_min":0,"x_max":854.171875,"ha":935,"o":"m 854 0 l 683 0 l 423 409 l 166 0 l 0 0 l 347 519 l 18 1013 l 186 1013 l 427 637 l 675 1013 l 836 1013 l 504 521 l 854 0 "},"*":{"x_min":116,"x_max":674,"ha":792,"o":"m 674 768 l 475 713 l 610 544 l 517 477 l 394 652 l 272 478 l 178 544 l 314 713 l 116 766 l 153 876 l 341 812 l 342 1013 l 446 1013 l 446 811 l 635 874 l 674 768 "},"†":{"x_min":0,"x_max":777,"ha":835,"o":"m 458 804 l 777 804 l 777 683 l 458 683 l 458 0 l 319 0 l 319 681 l 0 683 l 0 804 l 319 804 l 319 1015 l 458 1013 l 458 804 "},"°":{"x_min":0,"x_max":347,"ha":444,"o":"m 173 802 q 43 856 91 802 q 0 977 0 905 q 45 1101 0 1049 q 173 1153 90 1153 q 303 1098 255 1153 q 347 977 347 1049 q 303 856 347 905 q 173 802 256 802 m 173 884 q 238 910 214 884 q 262 973 262 937 q 239 1038 262 1012 q 173 1064 217 1064 q 108 1037 132 1064 q 85 973 85 1010 q 108 910 85 937 q 173 884 132 884 "},"V":{"x_min":0,"x_max":862.71875,"ha":940,"o":"m 862 1013 l 505 0 l 361 0 l 0 1013 l 143 1013 l 434 165 l 718 1012 l 862 1013 "},"Ξ":{"x_min":0,"x_max":734.71875,"ha":763,"o":"m 723 889 l 9 889 l 9 1013 l 723 1013 l 723 889 m 673 463 l 61 463 l 61 589 l 673 589 l 673 463 m 734 0 l 0 0 l 0 124 l 734 124 l 734 0 "}," ":{"x_min":0,"x_max":0,"ha":853},"Ϋ":{"x_min":0.328125,"x_max":819.515625,"ha":889,"o":"m 588 1046 l 460 1046 l 460 1189 l 588 1189 l 588 1046 m 360 1046 l 232 1046 l 232 1189 l 360 1189 l 360 1046 m 819 1012 l 482 416 l 482 0 l 342 0 l 342 416 l 0 1012 l 140 1012 l 411 533 l 679 1012 l 819 1012 "},"0":{"x_min":73,"x_max":715,"ha":792,"o":"m 394 -29 q 153 129 242 -29 q 73 479 73 272 q 152 829 73 687 q 394 989 241 989 q 634 829 545 989 q 715 479 715 684 q 635 129 715 270 q 394 -29 546 -29 m 394 89 q 546 211 489 89 q 598 479 598 322 q 548 748 598 640 q 394 871 491 871 q 241 748 298 871 q 190 479 190 637 q 239 211 190 319 q 394 89 296 89 "},"”":{"x_min":0,"x_max":347,"ha":454,"o":"m 139 851 q 102 737 139 784 q 0 669 65 690 l 0 734 q 59 787 42 741 q 72 873 72 821 l 0 873 l 0 1013 l 139 1013 l 139 851 m 347 851 q 310 737 347 784 q 208 669 273 690 l 208 734 q 267 787 250 741 q 280 873 280 821 l 208 873 l 208 1013 l 347 1013 l 347 851 "},"@":{"x_min":0,"x_max":1260,"ha":1357,"o":"m 1098 -45 q 877 -160 1001 -117 q 633 -203 752 -203 q 155 -29 327 -203 q 0 360 0 127 q 176 802 0 616 q 687 1008 372 1008 q 1123 854 969 1008 q 1260 517 1260 718 q 1155 216 1260 341 q 868 82 1044 82 q 772 106 801 82 q 737 202 737 135 q 647 113 700 144 q 527 82 594 82 q 367 147 420 82 q 314 312 314 212 q 401 565 314 452 q 639 690 498 690 q 810 588 760 690 l 849 668 l 938 668 q 877 441 900 532 q 833 226 833 268 q 853 182 833 198 q 902 167 873 167 q 1088 272 1012 167 q 1159 512 1159 372 q 1051 793 1159 681 q 687 925 925 925 q 248 747 415 925 q 97 361 97 586 q 226 26 97 159 q 627 -122 370 -122 q 856 -87 737 -122 q 1061 8 976 -53 l 1098 -45 m 786 488 q 738 580 777 545 q 643 615 700 615 q 483 517 548 615 q 425 322 425 430 q 457 203 425 250 q 552 156 490 156 q 722 273 665 156 q 786 488 738 309 "},"Ί":{"x_min":0,"x_max":499,"ha":613,"o":"m 277 1040 l 83 799 l 0 799 l 140 1040 l 277 1040 m 499 0 l 360 0 l 360 1012 l 499 1012 l 499 0 "},"i":{"x_min":14,"x_max":136,"ha":275,"o":"m 136 873 l 14 873 l 14 1013 l 136 1013 l 136 873 m 136 0 l 14 0 l 14 737 l 136 737 l 136 0 "},"Β":{"x_min":0,"x_max":778,"ha":877,"o":"m 580 545 q 724 468 671 534 q 778 310 778 402 q 673 83 778 170 q 432 0 575 0 l 0 0 l 0 1013 l 411 1013 q 629 957 541 1013 q 732 768 732 891 q 691 632 732 692 q 580 545 650 571 m 393 899 l 139 899 l 139 587 l 379 587 q 521 623 462 587 q 592 744 592 666 q 531 859 592 819 q 393 899 471 899 m 419 124 q 566 169 504 124 q 635 302 635 219 q 559 435 635 388 q 402 476 494 476 l 139 476 l 139 124 l 419 124 "},"υ":{"x_min":0,"x_max":617,"ha":725,"o":"m 617 352 q 540 94 617 199 q 308 -24 455 -24 q 76 94 161 -24 q 0 352 0 199 l 0 739 l 126 739 l 126 355 q 169 185 126 257 q 312 98 220 98 q 451 185 402 98 q 492 355 492 257 l 492 739 l 617 739 l 617 352 "},"]":{"x_min":0,"x_max":275,"ha":372,"o":"m 275 -281 l 0 -281 l 0 -187 l 151 -187 l 151 920 l 0 920 l 0 1013 l 275 1013 l 275 -281 "},"m":{"x_min":0,"x_max":1019,"ha":1128,"o":"m 1019 0 l 897 0 l 897 454 q 860 591 897 536 q 739 660 816 660 q 613 586 659 660 q 573 436 573 522 l 573 0 l 447 0 l 447 455 q 412 591 447 535 q 294 657 372 657 q 165 586 213 657 q 122 437 122 521 l 122 0 l 0 0 l 0 738 l 117 738 l 117 640 q 202 730 150 697 q 316 763 254 763 q 437 730 381 763 q 525 642 494 697 q 621 731 559 700 q 753 763 682 763 q 943 694 867 763 q 1019 512 1019 625 l 1019 0 "},"χ":{"x_min":8.328125,"x_max":780.5625,"ha":815,"o":"m 780 -278 q 715 -294 747 -294 q 616 -257 663 -294 q 548 -175 576 -227 l 379 133 l 143 -277 l 9 -277 l 313 254 l 163 522 q 127 586 131 580 q 36 640 91 640 q 8 637 27 640 l 8 752 l 52 757 q 162 719 113 757 q 236 627 200 690 l 383 372 l 594 737 l 726 737 l 448 250 l 625 -69 q 670 -153 647 -110 q 743 -188 695 -188 q 780 -184 759 -188 l 780 -278 "},"8":{"x_min":55,"x_max":736,"ha":792,"o":"m 571 527 q 694 424 652 491 q 736 280 736 358 q 648 71 736 158 q 395 -26 551 -26 q 142 69 238 -26 q 55 279 55 157 q 96 425 55 359 q 220 527 138 491 q 120 615 153 562 q 88 726 88 668 q 171 904 88 827 q 395 986 261 986 q 618 905 529 986 q 702 727 702 830 q 670 616 702 667 q 571 527 638 565 m 394 565 q 519 610 475 565 q 563 717 563 655 q 521 823 563 781 q 392 872 474 872 q 265 824 312 872 q 224 720 224 783 q 265 613 224 656 q 394 565 312 565 m 395 91 q 545 150 488 91 q 597 280 597 204 q 546 408 597 355 q 395 465 492 465 q 244 408 299 465 q 194 280 194 356 q 244 150 194 203 q 395 91 299 91 "},"ί":{"x_min":42,"x_max":326.71875,"ha":361,"o":"m 284 3 q 233 -10 258 -5 q 182 -15 207 -15 q 85 26 119 -15 q 42 200 42 79 l 42 737 l 167 737 l 168 215 q 172 141 168 157 q 226 101 183 101 q 248 102 239 101 q 284 112 257 104 l 284 3 m 326 1040 l 137 819 l 54 819 l 189 1040 l 326 1040 "},"Ζ":{"x_min":0,"x_max":779.171875,"ha":850,"o":"m 779 0 l 0 0 l 0 113 l 620 896 l 40 896 l 40 1013 l 779 1013 l 779 887 l 170 124 l 779 124 l 779 0 "},"R":{"x_min":0,"x_max":781.953125,"ha":907,"o":"m 781 0 l 623 0 q 587 242 590 52 q 407 433 585 433 l 138 433 l 138 0 l 0 0 l 0 1013 l 396 1013 q 636 946 539 1013 q 749 731 749 868 q 711 597 749 659 q 608 502 674 534 q 718 370 696 474 q 729 207 722 352 q 781 26 736 62 l 781 0 m 373 551 q 533 594 465 551 q 614 731 614 645 q 532 859 614 815 q 373 896 465 896 l 138 896 l 138 551 l 373 551 "},"o":{"x_min":0,"x_max":713,"ha":821,"o":"m 357 -25 q 94 91 194 -25 q 0 368 0 202 q 93 642 0 533 q 357 761 193 761 q 618 644 518 761 q 713 368 713 533 q 619 91 713 201 q 357 -25 521 -25 m 357 85 q 528 175 465 85 q 584 369 584 255 q 529 562 584 484 q 357 651 467 651 q 189 560 250 651 q 135 369 135 481 q 187 177 135 257 q 357 85 250 85 "},"5":{"x_min":54.171875,"x_max":738,"ha":792,"o":"m 738 314 q 626 60 738 153 q 382 -23 526 -23 q 155 47 248 -23 q 54 256 54 125 l 183 256 q 259 132 204 174 q 382 91 314 91 q 533 149 471 91 q 602 314 602 213 q 538 469 602 411 q 386 528 475 528 q 284 506 332 528 q 197 439 237 484 l 81 439 l 159 958 l 684 958 l 684 840 l 254 840 l 214 579 q 306 627 258 612 q 407 643 354 643 q 636 552 540 643 q 738 314 738 457 "},"7":{"x_min":58.71875,"x_max":730.953125,"ha":792,"o":"m 730 839 q 469 448 560 641 q 335 0 378 255 l 192 0 q 328 441 235 252 q 593 830 421 630 l 58 830 l 58 958 l 730 958 l 730 839 "},"K":{"x_min":0,"x_max":819.46875,"ha":906,"o":"m 819 0 l 649 0 l 294 509 l 139 355 l 139 0 l 0 0 l 0 1013 l 139 1013 l 139 526 l 626 1013 l 809 1013 l 395 600 l 819 0 "},",":{"x_min":0,"x_max":142,"ha":239,"o":"m 142 -12 q 105 -132 142 -82 q 0 -205 68 -182 l 0 -138 q 57 -82 40 -124 q 70 0 70 -51 l 0 0 l 0 151 l 142 151 l 142 -12 "},"d":{"x_min":0,"x_max":683,"ha":796,"o":"m 683 0 l 564 0 l 564 93 q 456 6 516 38 q 327 -25 395 -25 q 87 100 181 -25 q 0 365 0 215 q 90 639 0 525 q 343 763 187 763 q 564 647 486 763 l 564 1013 l 683 1013 l 683 0 m 582 373 q 529 562 582 484 q 361 653 468 653 q 190 561 253 653 q 135 365 135 479 q 189 175 135 254 q 358 85 251 85 q 529 178 468 85 q 582 373 582 258 "},"¨":{"x_min":-109,"x_max":247,"ha":232,"o":"m 247 1046 l 119 1046 l 119 1189 l 247 1189 l 247 1046 m 19 1046 l -109 1046 l -109 1189 l 19 1189 l 19 1046 "},"E":{"x_min":0,"x_max":736.109375,"ha":789,"o":"m 736 0 l 0 0 l 0 1013 l 725 1013 l 725 889 l 139 889 l 139 585 l 677 585 l 677 467 l 139 467 l 139 125 l 736 125 l 736 0 "},"Y":{"x_min":0,"x_max":820,"ha":886,"o":"m 820 1013 l 482 416 l 482 0 l 342 0 l 342 416 l 0 1013 l 140 1013 l 411 534 l 679 1012 l 820 1013 "},"\"":{"x_min":0,"x_max":299,"ha":396,"o":"m 299 606 l 203 606 l 203 988 l 299 988 l 299 606 m 96 606 l 0 606 l 0 988 l 96 988 l 96 606 "},"‹":{"x_min":17.984375,"x_max":773.609375,"ha":792,"o":"m 773 40 l 18 376 l 17 465 l 773 799 l 773 692 l 159 420 l 773 149 l 773 40 "},"„":{"x_min":0,"x_max":364,"ha":467,"o":"m 141 -12 q 104 -132 141 -82 q 0 -205 67 -182 l 0 -138 q 56 -82 40 -124 q 69 0 69 -51 l 0 0 l 0 151 l 141 151 l 141 -12 m 364 -12 q 327 -132 364 -82 q 222 -205 290 -182 l 222 -138 q 279 -82 262 -124 q 292 0 292 -51 l 222 0 l 222 151 l 364 151 l 364 -12 "},"δ":{"x_min":1,"x_max":710,"ha":810,"o":"m 710 360 q 616 87 710 196 q 356 -28 518 -28 q 99 82 197 -28 q 1 356 1 192 q 100 606 1 509 q 355 703 199 703 q 180 829 288 754 q 70 903 124 866 l 70 1012 l 643 1012 l 643 901 l 258 901 q 462 763 422 794 q 636 592 577 677 q 710 360 710 485 m 584 365 q 552 501 584 447 q 451 602 521 555 q 372 611 411 611 q 197 541 258 611 q 136 355 136 472 q 190 171 136 245 q 358 85 252 85 q 528 173 465 85 q 584 365 584 252 "},"έ":{"x_min":0,"x_max":634.71875,"ha":714,"o":"m 634 234 q 527 38 634 110 q 300 -25 433 -25 q 98 29 183 -25 q 0 204 0 93 q 37 313 0 265 q 128 390 67 352 q 56 459 82 419 q 26 555 26 505 q 114 712 26 654 q 295 763 191 763 q 499 700 416 763 q 589 515 589 631 l 478 515 q 419 618 464 580 q 307 657 374 657 q 207 630 253 657 q 151 547 151 598 q 238 445 151 469 q 389 434 280 434 l 389 331 l 349 331 q 206 315 255 331 q 125 210 125 287 q 183 107 125 145 q 302 76 233 76 q 436 117 379 76 q 509 234 493 159 l 634 234 m 520 1040 l 331 819 l 248 819 l 383 1040 l 520 1040 "},"ω":{"x_min":0,"x_max":922,"ha":1031,"o":"m 922 339 q 856 97 922 203 q 650 -26 780 -26 q 538 9 587 -26 q 461 103 489 44 q 387 12 436 46 q 277 -22 339 -22 q 69 97 147 -22 q 0 339 0 203 q 45 551 0 444 q 161 738 84 643 l 302 738 q 175 553 219 647 q 124 336 124 446 q 155 179 124 249 q 275 88 197 88 q 375 163 341 88 q 400 294 400 219 l 400 572 l 524 572 l 524 294 q 561 135 524 192 q 643 88 591 88 q 762 182 719 88 q 797 342 797 257 q 745 556 797 450 q 619 738 705 638 l 760 738 q 874 551 835 640 q 922 339 922 444 "},"´":{"x_min":0,"x_max":96,"ha":251,"o":"m 96 606 l 0 606 l 0 988 l 96 988 l 96 606 "},"±":{"x_min":11,"x_max":781,"ha":792,"o":"m 781 490 l 446 490 l 446 255 l 349 255 l 349 490 l 11 490 l 11 586 l 349 586 l 349 819 l 446 819 l 446 586 l 781 586 l 781 490 m 781 21 l 11 21 l 11 115 l 781 115 l 781 21 "},"|":{"x_min":343,"x_max":449,"ha":792,"o":"m 449 462 l 343 462 l 343 986 l 449 986 l 449 462 m 449 -242 l 343 -242 l 343 280 l 449 280 l 449 -242 "},"ϋ":{"x_min":0,"x_max":617,"ha":725,"o":"m 482 800 l 372 800 l 372 925 l 482 925 l 482 800 m 239 800 l 129 800 l 129 925 l 239 925 l 239 800 m 617 352 q 540 93 617 199 q 308 -24 455 -24 q 76 93 161 -24 q 0 352 0 199 l 0 738 l 126 738 l 126 354 q 169 185 126 257 q 312 98 220 98 q 451 185 402 98 q 492 354 492 257 l 492 738 l 617 738 l 617 352 "},"§":{"x_min":0,"x_max":593,"ha":690,"o":"m 593 425 q 554 312 593 369 q 467 233 516 254 q 537 83 537 172 q 459 -74 537 -12 q 288 -133 387 -133 q 115 -69 184 -133 q 47 96 47 -6 l 166 96 q 199 7 166 40 q 288 -26 232 -26 q 371 -5 332 -26 q 420 60 420 21 q 311 201 420 139 q 108 309 210 255 q 0 490 0 383 q 33 602 0 551 q 124 687 66 654 q 75 743 93 712 q 58 812 58 773 q 133 984 58 920 q 300 1043 201 1043 q 458 987 394 1043 q 529 814 529 925 l 411 814 q 370 908 404 877 q 289 939 336 939 q 213 911 246 939 q 180 841 180 883 q 286 720 180 779 q 484 612 480 615 q 593 425 593 534 m 467 409 q 355 544 467 473 q 196 630 228 612 q 146 587 162 609 q 124 525 124 558 q 239 387 124 462 q 398 298 369 315 q 448 345 429 316 q 467 409 467 375 "},"b":{"x_min":0,"x_max":685,"ha":783,"o":"m 685 372 q 597 99 685 213 q 347 -25 501 -25 q 219 5 277 -25 q 121 93 161 36 l 121 0 l 0 0 l 0 1013 l 121 1013 l 121 634 q 214 723 157 692 q 341 754 272 754 q 591 637 493 754 q 685 372 685 526 m 554 356 q 499 550 554 470 q 328 644 437 644 q 162 556 223 644 q 108 369 108 478 q 160 176 108 256 q 330 83 221 83 q 498 169 435 83 q 554 356 554 245 "},"q":{"x_min":0,"x_max":683,"ha":876,"o":"m 683 -278 l 564 -278 l 564 97 q 474 8 533 39 q 345 -23 415 -23 q 91 93 188 -23 q 0 364 0 203 q 87 635 0 522 q 337 760 184 760 q 466 727 408 760 q 564 637 523 695 l 564 737 l 683 737 l 683 -278 m 582 375 q 527 564 582 488 q 358 652 466 652 q 190 565 253 652 q 135 377 135 488 q 189 179 135 261 q 361 84 251 84 q 530 179 469 84 q 582 375 582 260 "},"Ω":{"x_min":-0.171875,"x_max":969.5625,"ha":1068,"o":"m 969 0 l 555 0 l 555 123 q 744 308 675 194 q 814 558 814 423 q 726 812 814 709 q 484 922 633 922 q 244 820 334 922 q 154 567 154 719 q 223 316 154 433 q 412 123 292 199 l 412 0 l 0 0 l 0 124 l 217 124 q 68 327 122 210 q 15 572 15 444 q 144 911 15 781 q 484 1041 274 1041 q 822 909 691 1041 q 953 569 953 777 q 899 326 953 443 q 750 124 846 210 l 969 124 l 969 0 "},"ύ":{"x_min":0,"x_max":617,"ha":725,"o":"m 617 352 q 540 93 617 199 q 308 -24 455 -24 q 76 93 161 -24 q 0 352 0 199 l 0 738 l 126 738 l 126 354 q 169 185 126 257 q 312 98 220 98 q 451 185 402 98 q 492 354 492 257 l 492 738 l 617 738 l 617 352 m 535 1040 l 346 819 l 262 819 l 397 1040 l 535 1040 "},"z":{"x_min":-0.015625,"x_max":613.890625,"ha":697,"o":"m 613 0 l 0 0 l 0 100 l 433 630 l 20 630 l 20 738 l 594 738 l 593 636 l 163 110 l 613 110 l 613 0 "},"™":{"x_min":0,"x_max":894,"ha":1000,"o":"m 389 951 l 229 951 l 229 503 l 160 503 l 160 951 l 0 951 l 0 1011 l 389 1011 l 389 951 m 894 503 l 827 503 l 827 939 l 685 503 l 620 503 l 481 937 l 481 503 l 417 503 l 417 1011 l 517 1011 l 653 580 l 796 1010 l 894 1011 l 894 503 "},"ή":{"x_min":0.78125,"x_max":697,"ha":810,"o":"m 697 -278 l 572 -278 l 572 454 q 540 587 572 536 q 425 650 501 650 q 271 579 337 650 q 206 420 206 509 l 206 0 l 81 0 l 81 489 q 73 588 81 562 q 0 644 56 644 l 0 741 q 68 755 38 755 q 158 721 124 755 q 200 630 193 687 q 297 726 234 692 q 434 761 359 761 q 620 692 544 761 q 697 516 697 624 l 697 -278 m 479 1040 l 290 819 l 207 819 l 341 1040 l 479 1040 "},"Θ":{"x_min":0,"x_max":960,"ha":1056,"o":"m 960 507 q 833 129 960 280 q 476 -32 698 -32 q 123 129 255 -32 q 0 507 0 280 q 123 883 0 732 q 476 1045 255 1045 q 832 883 696 1045 q 960 507 960 732 m 817 500 q 733 789 817 669 q 476 924 639 924 q 223 792 317 924 q 142 507 142 675 q 222 222 142 339 q 476 89 315 89 q 730 218 636 89 q 817 500 817 334 m 716 449 l 243 449 l 243 571 l 716 571 l 716 449 "},"®":{"x_min":-3,"x_max":1008,"ha":1106,"o":"m 503 532 q 614 562 566 532 q 672 658 672 598 q 614 747 672 716 q 503 772 569 772 l 338 772 l 338 532 l 503 532 m 502 -7 q 123 151 263 -7 q -3 501 -3 294 q 123 851 -3 706 q 502 1011 263 1011 q 881 851 739 1011 q 1008 501 1008 708 q 883 151 1008 292 q 502 -7 744 -7 m 502 60 q 830 197 709 60 q 940 501 940 322 q 831 805 940 681 q 502 944 709 944 q 174 805 296 944 q 65 501 65 680 q 173 197 65 320 q 502 60 294 60 m 788 146 l 678 146 q 653 316 655 183 q 527 449 652 449 l 338 449 l 338 146 l 241 146 l 241 854 l 518 854 q 688 808 621 854 q 766 658 766 755 q 739 563 766 607 q 668 497 713 519 q 751 331 747 472 q 788 164 756 190 l 788 146 "},"~":{"x_min":0,"x_max":833,"ha":931,"o":"m 833 958 q 778 753 833 831 q 594 665 716 665 q 402 761 502 665 q 240 857 302 857 q 131 795 166 857 q 104 665 104 745 l 0 665 q 54 867 0 789 q 237 958 116 958 q 429 861 331 958 q 594 765 527 765 q 704 827 670 765 q 729 958 729 874 l 833 958 "},"Ε":{"x_min":0,"x_max":736.21875,"ha":778,"o":"m 736 0 l 0 0 l 0 1013 l 725 1013 l 725 889 l 139 889 l 139 585 l 677 585 l 677 467 l 139 467 l 139 125 l 736 125 l 736 0 "},"³":{"x_min":0,"x_max":450,"ha":547,"o":"m 450 552 q 379 413 450 464 q 220 366 313 366 q 69 414 130 366 q 0 567 0 470 l 85 567 q 126 470 85 504 q 225 437 168 437 q 320 467 280 437 q 360 552 360 498 q 318 632 360 608 q 213 657 276 657 q 195 657 203 657 q 176 657 181 657 l 176 722 q 279 733 249 722 q 334 815 334 752 q 300 881 334 856 q 220 907 267 907 q 133 875 169 907 q 97 781 97 844 l 15 781 q 78 926 15 875 q 220 972 135 972 q 364 930 303 972 q 426 817 426 888 q 344 697 426 733 q 421 642 392 681 q 450 552 450 603 "},"[":{"x_min":0,"x_max":273.609375,"ha":371,"o":"m 273 -281 l 0 -281 l 0 1013 l 273 1013 l 273 920 l 124 920 l 124 -187 l 273 -187 l 273 -281 "},"L":{"x_min":0,"x_max":645.828125,"ha":696,"o":"m 645 0 l 0 0 l 0 1013 l 140 1013 l 140 126 l 645 126 l 645 0 "},"σ":{"x_min":0,"x_max":803.390625,"ha":894,"o":"m 803 628 l 633 628 q 713 368 713 512 q 618 93 713 204 q 357 -25 518 -25 q 94 91 194 -25 q 0 368 0 201 q 94 644 0 533 q 356 761 194 761 q 481 750 398 761 q 608 739 564 739 l 803 739 l 803 628 m 360 85 q 529 180 467 85 q 584 374 584 262 q 527 566 584 490 q 352 651 463 651 q 187 559 247 651 q 135 368 135 478 q 189 175 135 254 q 360 85 251 85 "},"ζ":{"x_min":0,"x_max":573,"ha":642,"o":"m 573 -40 q 553 -162 573 -97 q 510 -278 543 -193 l 400 -278 q 441 -187 428 -219 q 462 -90 462 -132 q 378 -14 462 -14 q 108 45 197 -14 q 0 290 0 117 q 108 631 0 462 q 353 901 194 767 l 55 901 l 55 1012 l 561 1012 l 561 924 q 261 669 382 831 q 128 301 128 489 q 243 117 128 149 q 458 98 350 108 q 573 -40 573 80 "},"θ":{"x_min":0,"x_max":674,"ha":778,"o":"m 674 496 q 601 160 674 304 q 336 -26 508 -26 q 73 153 165 -26 q 0 485 0 296 q 72 840 0 683 q 343 1045 166 1045 q 605 844 516 1045 q 674 496 674 692 m 546 579 q 498 798 546 691 q 336 935 437 935 q 178 798 237 935 q 126 579 137 701 l 546 579 m 546 475 l 126 475 q 170 233 126 348 q 338 80 230 80 q 504 233 447 80 q 546 475 546 346 "},"Ο":{"x_min":0,"x_max":958,"ha":1054,"o":"m 485 1042 q 834 883 703 1042 q 958 511 958 735 q 834 136 958 287 q 481 -26 701 -26 q 126 130 261 -26 q 0 504 0 279 q 127 880 0 729 q 485 1042 263 1042 m 480 98 q 731 225 638 98 q 815 504 815 340 q 733 783 815 670 q 480 913 640 913 q 226 785 321 913 q 142 504 142 671 q 226 224 142 339 q 480 98 319 98 "},"Γ":{"x_min":0,"x_max":705.28125,"ha":749,"o":"m 705 886 l 140 886 l 140 0 l 0 0 l 0 1012 l 705 1012 l 705 886 "}," ":{"x_min":0,"x_max":0,"ha":375},"%":{"x_min":-3,"x_max":1089,"ha":1186,"o":"m 845 0 q 663 76 731 0 q 602 244 602 145 q 661 412 602 344 q 845 489 728 489 q 1027 412 959 489 q 1089 244 1089 343 q 1029 76 1089 144 q 845 0 962 0 m 844 103 q 945 143 909 103 q 981 243 981 184 q 947 340 981 301 q 844 385 909 385 q 744 342 781 385 q 708 243 708 300 q 741 147 708 186 q 844 103 780 103 m 888 986 l 284 -25 l 199 -25 l 803 986 l 888 986 m 241 468 q 58 545 126 468 q -3 715 -3 615 q 56 881 -3 813 q 238 958 124 958 q 421 881 353 958 q 483 712 483 813 q 423 544 483 612 q 241 468 356 468 m 241 855 q 137 811 175 855 q 100 710 100 768 q 136 612 100 653 q 240 572 172 572 q 344 614 306 572 q 382 713 382 656 q 347 810 382 771 q 241 855 308 855 "},"P":{"x_min":0,"x_max":726,"ha":806,"o":"m 424 1013 q 640 931 555 1013 q 726 719 726 850 q 637 506 726 587 q 413 426 548 426 l 140 426 l 140 0 l 0 0 l 0 1013 l 424 1013 m 379 889 l 140 889 l 140 548 l 372 548 q 522 589 459 548 q 593 720 593 637 q 528 845 593 801 q 379 889 463 889 "},"Έ":{"x_min":0,"x_max":1078.21875,"ha":1118,"o":"m 1078 0 l 342 0 l 342 1013 l 1067 1013 l 1067 889 l 481 889 l 481 585 l 1019 585 l 1019 467 l 481 467 l 481 125 l 1078 125 l 1078 0 m 277 1040 l 83 799 l 0 799 l 140 1040 l 277 1040 "},"Ώ":{"x_min":0.125,"x_max":1136.546875,"ha":1235,"o":"m 1136 0 l 722 0 l 722 123 q 911 309 842 194 q 981 558 981 423 q 893 813 981 710 q 651 923 800 923 q 411 821 501 923 q 321 568 321 720 q 390 316 321 433 q 579 123 459 200 l 579 0 l 166 0 l 166 124 l 384 124 q 235 327 289 210 q 182 572 182 444 q 311 912 182 782 q 651 1042 441 1042 q 989 910 858 1042 q 1120 569 1120 778 q 1066 326 1120 443 q 917 124 1013 210 l 1136 124 l 1136 0 m 277 1040 l 83 800 l 0 800 l 140 1041 l 277 1040 "},"_":{"x_min":0,"x_max":705.5625,"ha":803,"o":"m 705 -334 l 0 -334 l 0 -234 l 705 -234 l 705 -334 "},"Ϊ":{"x_min":-110,"x_max":246,"ha":275,"o":"m 246 1046 l 118 1046 l 118 1189 l 246 1189 l 246 1046 m 18 1046 l -110 1046 l -110 1189 l 18 1189 l 18 1046 m 136 0 l 0 0 l 0 1012 l 136 1012 l 136 0 "},"+":{"x_min":23,"x_max":768,"ha":792,"o":"m 768 372 l 444 372 l 444 0 l 347 0 l 347 372 l 23 372 l 23 468 l 347 468 l 347 840 l 444 840 l 444 468 l 768 468 l 768 372 "},"½":{"x_min":0,"x_max":1050,"ha":1149,"o":"m 1050 0 l 625 0 q 712 178 625 108 q 878 277 722 187 q 967 385 967 328 q 932 456 967 429 q 850 484 897 484 q 759 450 798 484 q 721 352 721 416 l 640 352 q 706 502 640 448 q 851 551 766 551 q 987 509 931 551 q 1050 385 1050 462 q 976 251 1050 301 q 829 179 902 215 q 717 68 740 133 l 1050 68 l 1050 0 m 834 985 l 215 -28 l 130 -28 l 750 984 l 834 985 m 224 422 l 142 422 l 142 811 l 0 811 l 0 867 q 104 889 62 867 q 164 973 157 916 l 224 973 l 224 422 "},"Ρ":{"x_min":0,"x_max":720,"ha":783,"o":"m 424 1013 q 637 933 554 1013 q 720 723 720 853 q 633 508 720 591 q 413 426 546 426 l 140 426 l 140 0 l 0 0 l 0 1013 l 424 1013 m 378 889 l 140 889 l 140 548 l 371 548 q 521 589 458 548 q 592 720 592 637 q 527 845 592 801 q 378 889 463 889 "},"'":{"x_min":0,"x_max":139,"ha":236,"o":"m 139 851 q 102 737 139 784 q 0 669 65 690 l 0 734 q 59 787 42 741 q 72 873 72 821 l 0 873 l 0 1013 l 139 1013 l 139 851 "},"ª":{"x_min":0,"x_max":350,"ha":397,"o":"m 350 625 q 307 616 328 616 q 266 631 281 616 q 247 673 251 645 q 190 628 225 644 q 116 613 156 613 q 32 641 64 613 q 0 722 0 669 q 72 826 0 800 q 247 866 159 846 l 247 887 q 220 934 247 916 q 162 953 194 953 q 104 934 129 953 q 76 882 80 915 l 16 882 q 60 976 16 941 q 166 1011 104 1011 q 266 979 224 1011 q 308 891 308 948 l 308 706 q 311 679 308 688 q 331 670 315 670 l 350 672 l 350 625 m 247 757 l 247 811 q 136 790 175 798 q 64 726 64 773 q 83 682 64 697 q 132 667 103 667 q 207 690 174 667 q 247 757 247 718 "},"΅":{"x_min":0,"x_max":450,"ha":553,"o":"m 450 800 l 340 800 l 340 925 l 450 925 l 450 800 m 406 1040 l 212 800 l 129 800 l 269 1040 l 406 1040 m 110 800 l 0 800 l 0 925 l 110 925 l 110 800 "},"T":{"x_min":0,"x_max":777,"ha":835,"o":"m 777 894 l 458 894 l 458 0 l 319 0 l 319 894 l 0 894 l 0 1013 l 777 1013 l 777 894 "},"Φ":{"x_min":0,"x_max":915,"ha":997,"o":"m 527 0 l 389 0 l 389 122 q 110 231 220 122 q 0 509 0 340 q 110 785 0 677 q 389 893 220 893 l 389 1013 l 527 1013 l 527 893 q 804 786 693 893 q 915 509 915 679 q 805 231 915 341 q 527 122 696 122 l 527 0 m 527 226 q 712 310 641 226 q 779 507 779 389 q 712 705 779 627 q 527 787 641 787 l 527 226 m 389 226 l 389 787 q 205 698 275 775 q 136 505 136 620 q 206 308 136 391 q 389 226 276 226 "},"⁋":{"x_min":0,"x_max":0,"ha":694},"j":{"x_min":-77.78125,"x_max":167,"ha":349,"o":"m 167 871 l 42 871 l 42 1013 l 167 1013 l 167 871 m 167 -80 q 121 -231 167 -184 q -26 -278 76 -278 l -77 -278 l -77 -164 l -41 -164 q 26 -143 11 -164 q 42 -65 42 -122 l 42 737 l 167 737 l 167 -80 "},"Σ":{"x_min":0,"x_max":756.953125,"ha":819,"o":"m 756 0 l 0 0 l 0 107 l 395 523 l 22 904 l 22 1013 l 745 1013 l 745 889 l 209 889 l 566 523 l 187 125 l 756 125 l 756 0 "},"1":{"x_min":215.671875,"x_max":574,"ha":792,"o":"m 574 0 l 442 0 l 442 697 l 215 697 l 215 796 q 386 833 330 796 q 475 986 447 875 l 574 986 l 574 0 "},"›":{"x_min":18.0625,"x_max":774,"ha":792,"o":"m 774 376 l 18 40 l 18 149 l 631 421 l 18 692 l 18 799 l 774 465 l 774 376 "},"<":{"x_min":17.984375,"x_max":773.609375,"ha":792,"o":"m 773 40 l 18 376 l 17 465 l 773 799 l 773 692 l 159 420 l 773 149 l 773 40 "},"£":{"x_min":0,"x_max":704.484375,"ha":801,"o":"m 704 41 q 623 -10 664 5 q 543 -26 583 -26 q 359 15 501 -26 q 243 36 288 36 q 158 23 197 36 q 73 -21 119 10 l 6 76 q 125 195 90 150 q 175 331 175 262 q 147 443 175 383 l 0 443 l 0 512 l 108 512 q 43 734 43 623 q 120 929 43 854 q 358 1010 204 1010 q 579 936 487 1010 q 678 729 678 857 l 678 684 l 552 684 q 504 838 552 780 q 362 896 457 896 q 216 852 263 896 q 176 747 176 815 q 199 627 176 697 q 248 512 217 574 l 468 512 l 468 443 l 279 443 q 297 356 297 398 q 230 194 297 279 q 153 107 211 170 q 227 133 190 125 q 293 142 264 142 q 410 119 339 142 q 516 96 482 96 q 579 105 550 96 q 648 142 608 115 l 704 41 "},"t":{"x_min":0,"x_max":367,"ha":458,"o":"m 367 0 q 312 -5 339 -2 q 262 -8 284 -8 q 145 28 183 -8 q 108 143 108 64 l 108 638 l 0 638 l 0 738 l 108 738 l 108 944 l 232 944 l 232 738 l 367 738 l 367 638 l 232 638 l 232 185 q 248 121 232 140 q 307 102 264 102 q 345 104 330 102 q 367 107 360 107 l 367 0 "},"¬":{"x_min":0,"x_max":706,"ha":803,"o":"m 706 411 l 706 158 l 630 158 l 630 335 l 0 335 l 0 411 l 706 411 "},"λ":{"x_min":0,"x_max":750,"ha":803,"o":"m 750 -7 q 679 -15 716 -15 q 538 59 591 -15 q 466 214 512 97 l 336 551 l 126 0 l 0 0 l 270 705 q 223 837 247 770 q 116 899 190 899 q 90 898 100 899 l 90 1004 q 152 1011 125 1011 q 298 938 244 1011 q 373 783 326 901 l 605 192 q 649 115 629 136 q 716 95 669 95 l 736 95 q 750 97 745 97 l 750 -7 "},"W":{"x_min":0,"x_max":1263.890625,"ha":1351,"o":"m 1263 1013 l 995 0 l 859 0 l 627 837 l 405 0 l 265 0 l 0 1013 l 136 1013 l 342 202 l 556 1013 l 701 1013 l 921 207 l 1133 1012 l 1263 1013 "},">":{"x_min":18.0625,"x_max":774,"ha":792,"o":"m 774 376 l 18 40 l 18 149 l 631 421 l 18 692 l 18 799 l 774 465 l 774 376 "},"v":{"x_min":0,"x_max":675.15625,"ha":761,"o":"m 675 738 l 404 0 l 272 0 l 0 738 l 133 737 l 340 147 l 541 737 l 675 738 "},"τ":{"x_min":0.28125,"x_max":644.5,"ha":703,"o":"m 644 628 l 382 628 l 382 179 q 388 120 382 137 q 436 91 401 91 q 474 94 447 91 q 504 97 501 97 l 504 0 q 454 -9 482 -5 q 401 -14 426 -14 q 278 67 308 -14 q 260 233 260 118 l 260 628 l 0 628 l 0 739 l 644 739 l 644 628 "},"ξ":{"x_min":0,"x_max":624.9375,"ha":699,"o":"m 624 -37 q 608 -153 624 -96 q 563 -278 593 -211 l 454 -278 q 491 -183 486 -200 q 511 -83 511 -126 q 484 -23 511 -44 q 370 1 452 1 q 323 0 354 1 q 283 -1 293 -1 q 84 76 169 -1 q 0 266 0 154 q 56 431 0 358 q 197 538 108 498 q 94 613 134 562 q 54 730 54 665 q 77 823 54 780 q 143 901 101 867 l 27 901 l 27 1012 l 576 1012 l 576 901 l 380 901 q 244 863 303 901 q 178 745 178 820 q 312 600 178 636 q 532 582 380 582 l 532 479 q 276 455 361 479 q 118 281 118 410 q 165 173 118 217 q 274 120 208 133 q 494 101 384 110 q 624 -37 624 76 "},"&":{"x_min":-3,"x_max":894.25,"ha":992,"o":"m 894 0 l 725 0 l 624 123 q 471 0 553 40 q 306 -41 390 -41 q 168 -7 231 -41 q 62 92 105 26 q 14 187 31 139 q -3 276 -3 235 q 55 433 -3 358 q 248 581 114 508 q 170 689 196 640 q 137 817 137 751 q 214 985 137 922 q 384 1041 284 1041 q 548 988 483 1041 q 622 824 622 928 q 563 666 622 739 q 431 556 516 608 l 621 326 q 649 407 639 361 q 663 493 653 426 l 781 493 q 703 229 781 352 l 894 0 m 504 818 q 468 908 504 877 q 384 940 433 940 q 293 907 331 940 q 255 818 255 875 q 289 714 255 767 q 363 628 313 678 q 477 729 446 682 q 504 818 504 771 m 556 209 l 314 499 q 179 395 223 449 q 135 283 135 341 q 146 222 135 253 q 183 158 158 192 q 333 80 241 80 q 556 209 448 80 "},"Λ":{"x_min":0,"x_max":862.5,"ha":942,"o":"m 862 0 l 719 0 l 426 847 l 143 0 l 0 0 l 356 1013 l 501 1013 l 862 0 "},"I":{"x_min":41,"x_max":180,"ha":293,"o":"m 180 0 l 41 0 l 41 1013 l 180 1013 l 180 0 "},"G":{"x_min":0,"x_max":921,"ha":1011,"o":"m 921 0 l 832 0 l 801 136 q 655 15 741 58 q 470 -28 568 -28 q 126 133 259 -28 q 0 499 0 284 q 125 881 0 731 q 486 1043 259 1043 q 763 957 647 1043 q 905 709 890 864 l 772 709 q 668 866 747 807 q 486 926 589 926 q 228 795 322 926 q 142 507 142 677 q 228 224 142 342 q 483 94 323 94 q 712 195 625 94 q 796 435 796 291 l 477 435 l 477 549 l 921 549 l 921 0 "},"ΰ":{"x_min":0,"x_max":617,"ha":725,"o":"m 524 800 l 414 800 l 414 925 l 524 925 l 524 800 m 183 800 l 73 800 l 73 925 l 183 925 l 183 800 m 617 352 q 540 93 617 199 q 308 -24 455 -24 q 76 93 161 -24 q 0 352 0 199 l 0 738 l 126 738 l 126 354 q 169 185 126 257 q 312 98 220 98 q 451 185 402 98 q 492 354 492 257 l 492 738 l 617 738 l 617 352 m 489 1040 l 300 819 l 216 819 l 351 1040 l 489 1040 "},"`":{"x_min":0,"x_max":138.890625,"ha":236,"o":"m 138 699 l 0 699 l 0 861 q 36 974 0 929 q 138 1041 72 1020 l 138 977 q 82 931 95 969 q 69 839 69 893 l 138 839 l 138 699 "},"·":{"x_min":0,"x_max":142,"ha":239,"o":"m 142 585 l 0 585 l 0 738 l 142 738 l 142 585 "},"Υ":{"x_min":0.328125,"x_max":819.515625,"ha":889,"o":"m 819 1013 l 482 416 l 482 0 l 342 0 l 342 416 l 0 1013 l 140 1013 l 411 533 l 679 1013 l 819 1013 "},"r":{"x_min":0,"x_max":355.5625,"ha":432,"o":"m 355 621 l 343 621 q 179 569 236 621 q 122 411 122 518 l 122 0 l 0 0 l 0 737 l 117 737 l 117 604 q 204 719 146 686 q 355 753 262 753 l 355 621 "},"x":{"x_min":0,"x_max":675,"ha":764,"o":"m 675 0 l 525 0 l 331 286 l 144 0 l 0 0 l 256 379 l 12 738 l 157 737 l 336 473 l 516 738 l 661 738 l 412 380 l 675 0 "},"μ":{"x_min":0,"x_max":696.609375,"ha":747,"o":"m 696 -4 q 628 -14 657 -14 q 498 97 513 -14 q 422 8 470 41 q 313 -24 374 -24 q 207 3 258 -24 q 120 80 157 31 l 120 -278 l 0 -278 l 0 738 l 124 738 l 124 343 q 165 172 124 246 q 308 82 216 82 q 451 177 402 82 q 492 358 492 254 l 492 738 l 616 738 l 616 214 q 623 136 616 160 q 673 92 636 92 q 696 95 684 92 l 696 -4 "},"h":{"x_min":0,"x_max":615,"ha":724,"o":"m 615 472 l 615 0 l 490 0 l 490 454 q 456 590 490 535 q 338 654 416 654 q 186 588 251 654 q 122 436 122 522 l 122 0 l 0 0 l 0 1013 l 122 1013 l 122 633 q 218 727 149 694 q 362 760 287 760 q 552 676 484 760 q 615 472 615 600 "},".":{"x_min":0,"x_max":142,"ha":239,"o":"m 142 0 l 0 0 l 0 151 l 142 151 l 142 0 "},"φ":{"x_min":-2,"x_max":878,"ha":974,"o":"m 496 -279 l 378 -279 l 378 -17 q 101 88 204 -17 q -2 367 -2 194 q 68 626 -2 510 q 283 758 151 758 l 283 646 q 167 537 209 626 q 133 373 133 462 q 192 177 133 254 q 378 93 259 93 l 378 758 q 445 764 426 763 q 476 765 464 765 q 765 659 653 765 q 878 377 878 553 q 771 96 878 209 q 496 -17 665 -17 l 496 -279 m 496 93 l 514 93 q 687 183 623 93 q 746 380 746 265 q 691 569 746 491 q 522 658 629 658 l 496 656 l 496 93 "},";":{"x_min":0,"x_max":142,"ha":239,"o":"m 142 585 l 0 585 l 0 738 l 142 738 l 142 585 m 142 -12 q 105 -132 142 -82 q 0 -206 68 -182 l 0 -138 q 58 -82 43 -123 q 68 0 68 -56 l 0 0 l 0 151 l 142 151 l 142 -12 "},"f":{"x_min":0,"x_max":378,"ha":472,"o":"m 378 638 l 246 638 l 246 0 l 121 0 l 121 638 l 0 638 l 0 738 l 121 738 q 137 935 121 887 q 290 1028 171 1028 q 320 1027 305 1028 q 378 1021 334 1026 l 378 908 q 323 918 346 918 q 257 870 273 918 q 246 780 246 840 l 246 738 l 378 738 l 378 638 "},"“":{"x_min":1,"x_max":348.21875,"ha":454,"o":"m 140 670 l 1 670 l 1 830 q 37 943 1 897 q 140 1011 74 990 l 140 947 q 82 900 97 940 q 68 810 68 861 l 140 810 l 140 670 m 348 670 l 209 670 l 209 830 q 245 943 209 897 q 348 1011 282 990 l 348 947 q 290 900 305 940 q 276 810 276 861 l 348 810 l 348 670 "},"A":{"x_min":0.03125,"x_max":906.953125,"ha":1008,"o":"m 906 0 l 756 0 l 648 303 l 251 303 l 142 0 l 0 0 l 376 1013 l 529 1013 l 906 0 m 610 421 l 452 867 l 293 421 l 610 421 "},"6":{"x_min":53,"x_max":739,"ha":792,"o":"m 739 312 q 633 62 739 162 q 400 -31 534 -31 q 162 78 257 -31 q 53 439 53 206 q 178 859 53 712 q 441 986 284 986 q 643 912 559 986 q 732 713 732 833 l 601 713 q 544 830 594 786 q 426 875 494 875 q 268 793 331 875 q 193 517 193 697 q 301 597 240 570 q 427 624 362 624 q 643 540 552 624 q 739 312 739 451 m 603 298 q 540 461 603 400 q 404 516 484 516 q 268 461 323 516 q 207 300 207 401 q 269 137 207 198 q 405 83 325 83 q 541 137 486 83 q 603 298 603 197 "},"‘":{"x_min":1,"x_max":139.890625,"ha":236,"o":"m 139 670 l 1 670 l 1 830 q 37 943 1 897 q 139 1011 74 990 l 139 947 q 82 900 97 940 q 68 810 68 861 l 139 810 l 139 670 "},"ϊ":{"x_min":-70,"x_max":283,"ha":361,"o":"m 283 800 l 173 800 l 173 925 l 283 925 l 283 800 m 40 800 l -70 800 l -70 925 l 40 925 l 40 800 m 283 3 q 232 -10 257 -5 q 181 -15 206 -15 q 84 26 118 -15 q 41 200 41 79 l 41 737 l 166 737 l 167 215 q 171 141 167 157 q 225 101 182 101 q 247 103 238 101 q 283 112 256 104 l 283 3 "},"π":{"x_min":-0.21875,"x_max":773.21875,"ha":857,"o":"m 773 -7 l 707 -11 q 575 40 607 -11 q 552 174 552 77 l 552 226 l 552 626 l 222 626 l 222 0 l 97 0 l 97 626 l 0 626 l 0 737 l 773 737 l 773 626 l 676 626 l 676 171 q 695 103 676 117 q 773 90 714 90 l 773 -7 "},"ά":{"x_min":0,"x_max":765.5625,"ha":809,"o":"m 765 -4 q 698 -14 726 -14 q 564 97 586 -14 q 466 7 525 40 q 337 -26 407 -26 q 88 98 186 -26 q 0 369 0 212 q 88 637 0 525 q 337 760 184 760 q 465 727 407 760 q 563 637 524 695 l 563 738 l 685 738 l 685 222 q 693 141 685 168 q 748 94 708 94 q 765 95 760 94 l 765 -4 m 584 371 q 531 562 584 485 q 360 653 470 653 q 192 566 254 653 q 135 379 135 489 q 186 181 135 261 q 358 84 247 84 q 528 176 465 84 q 584 371 584 260 m 604 1040 l 415 819 l 332 819 l 466 1040 l 604 1040 "},"O":{"x_min":0,"x_max":958,"ha":1057,"o":"m 485 1041 q 834 882 702 1041 q 958 512 958 734 q 834 136 958 287 q 481 -26 702 -26 q 126 130 261 -26 q 0 504 0 279 q 127 880 0 728 q 485 1041 263 1041 m 480 98 q 731 225 638 98 q 815 504 815 340 q 733 783 815 669 q 480 912 640 912 q 226 784 321 912 q 142 504 142 670 q 226 224 142 339 q 480 98 319 98 "},"n":{"x_min":0,"x_max":615,"ha":724,"o":"m 615 463 l 615 0 l 490 0 l 490 454 q 453 592 490 537 q 331 656 410 656 q 178 585 240 656 q 117 421 117 514 l 117 0 l 0 0 l 0 738 l 117 738 l 117 630 q 218 728 150 693 q 359 764 286 764 q 552 675 484 764 q 615 463 615 593 "},"3":{"x_min":54,"x_max":737,"ha":792,"o":"m 737 284 q 635 55 737 141 q 399 -25 541 -25 q 156 52 248 -25 q 54 308 54 140 l 185 308 q 245 147 185 202 q 395 96 302 96 q 539 140 484 96 q 602 280 602 190 q 510 429 602 390 q 324 454 451 454 l 324 565 q 487 584 441 565 q 565 719 565 617 q 515 835 565 791 q 395 879 466 879 q 255 824 307 879 q 203 661 203 769 l 78 661 q 166 909 78 822 q 387 992 250 992 q 603 921 513 992 q 701 723 701 844 q 669 607 701 656 q 578 524 637 558 q 696 434 655 499 q 737 284 737 369 "},"9":{"x_min":53,"x_max":739,"ha":792,"o":"m 739 524 q 619 94 739 241 q 362 -32 516 -32 q 150 47 242 -32 q 59 244 59 126 l 191 244 q 246 129 191 176 q 373 82 301 82 q 526 161 466 82 q 597 440 597 255 q 363 334 501 334 q 130 432 216 334 q 53 650 53 521 q 134 880 53 786 q 383 986 226 986 q 659 841 566 986 q 739 524 739 719 m 388 449 q 535 514 480 449 q 585 658 585 573 q 535 805 585 744 q 388 873 480 873 q 242 809 294 873 q 191 658 191 745 q 239 514 191 572 q 388 449 292 449 "},"l":{"x_min":41,"x_max":166,"ha":279,"o":"m 166 0 l 41 0 l 41 1013 l 166 1013 l 166 0 "},"¤":{"x_min":40.09375,"x_max":728.796875,"ha":825,"o":"m 728 304 l 649 224 l 512 363 q 383 331 458 331 q 256 363 310 331 l 119 224 l 40 304 l 177 441 q 150 553 150 493 q 184 673 150 621 l 40 818 l 119 898 l 267 749 q 321 766 291 759 q 384 773 351 773 q 447 766 417 773 q 501 749 477 759 l 649 898 l 728 818 l 585 675 q 612 618 604 648 q 621 553 621 587 q 591 441 621 491 l 728 304 m 384 682 q 280 643 318 682 q 243 551 243 604 q 279 461 243 499 q 383 423 316 423 q 487 461 449 423 q 525 553 525 500 q 490 641 525 605 q 384 682 451 682 "},"κ":{"x_min":0,"x_max":632.328125,"ha":679,"o":"m 632 0 l 482 0 l 225 384 l 124 288 l 124 0 l 0 0 l 0 738 l 124 738 l 124 446 l 433 738 l 596 738 l 312 466 l 632 0 "},"4":{"x_min":48,"x_max":742.453125,"ha":792,"o":"m 742 243 l 602 243 l 602 0 l 476 0 l 476 243 l 48 243 l 48 368 l 476 958 l 602 958 l 602 354 l 742 354 l 742 243 m 476 354 l 476 792 l 162 354 l 476 354 "},"p":{"x_min":0,"x_max":685,"ha":786,"o":"m 685 364 q 598 96 685 205 q 350 -23 504 -23 q 121 89 205 -23 l 121 -278 l 0 -278 l 0 738 l 121 738 l 121 633 q 220 726 159 691 q 351 761 280 761 q 598 636 504 761 q 685 364 685 522 m 557 371 q 501 560 557 481 q 330 651 437 651 q 162 559 223 651 q 108 366 108 479 q 162 177 108 254 q 333 87 224 87 q 502 178 441 87 q 557 371 557 258 "},"‡":{"x_min":0,"x_max":777,"ha":835,"o":"m 458 238 l 458 0 l 319 0 l 319 238 l 0 238 l 0 360 l 319 360 l 319 681 l 0 683 l 0 804 l 319 804 l 319 1015 l 458 1013 l 458 804 l 777 804 l 777 683 l 458 683 l 458 360 l 777 360 l 777 238 l 458 238 "},"ψ":{"x_min":0,"x_max":808,"ha":907,"o":"m 465 -278 l 341 -278 l 341 -15 q 87 102 180 -15 q 0 378 0 210 l 0 739 l 133 739 l 133 379 q 182 195 133 275 q 341 98 242 98 l 341 922 l 465 922 l 465 98 q 623 195 563 98 q 675 382 675 278 l 675 742 l 808 742 l 808 381 q 720 104 808 213 q 466 -13 627 -13 l 465 -278 "},"η":{"x_min":0.78125,"x_max":697,"ha":810,"o":"m 697 -278 l 572 -278 l 572 454 q 540 587 572 536 q 425 650 501 650 q 271 579 337 650 q 206 420 206 509 l 206 0 l 81 0 l 81 489 q 73 588 81 562 q 0 644 56 644 l 0 741 q 68 755 38 755 q 158 720 124 755 q 200 630 193 686 q 297 726 234 692 q 434 761 359 761 q 620 692 544 761 q 697 516 697 624 l 697 -278 "}},"cssFontWeight":"normal","ascender":1189,"underlinePosition":-100,"cssFontStyle":"normal","boundingBox":{"yMin":-334,"xMin":-111,"yMax":1189,"xMax":1672},"resolution":1000,"original_font_information":{"postscript_name":"Helvetiker-Regular","version_string":"Version 1.00 2004 initial release","vendor_url":"http://www.magenta.gr/","full_font_name":"Helvetiker","font_family_name":"Helvetiker","copyright":"Copyright (c) Μagenta ltd, 2004","description":"","trademark":"","designer":"","designer_url":"","unique_font_identifier":"Μagenta ltd:Helvetiker:22-10-104","license_url":"http://www.ellak.gr/fonts/MgOpen/license.html","license_description":"Copyright (c) 2004 by MAGENTA Ltd. All Rights Reserved.\r\n\r\nPermission is hereby granted, free of charge, to any person obtaining a copy of the fonts accompanying this license (\"Fonts\") and associated documentation files (the \"Font Software\"), to reproduce and distribute the Font Software, including without limitation the rights to use, copy, merge, publish, distribute, and/or sell copies of the Font Software, and to permit persons to whom the Font Software is furnished to do so, subject to the following conditions: \r\n\r\nThe above copyright and this permission notice shall be included in all copies of one or more of the Font Software typefaces.\r\n\r\nThe Font Software may be modified, altered, or added to, and in particular the designs of glyphs or characters in the Fonts may be modified and additional glyphs or characters may be added to the Fonts, only if the fonts are renamed to names not containing the word \"MgOpen\", or if the modifications are accepted for inclusion in the Font Software itself by the each appointed Administrator.\r\n\r\nThis License becomes null and void to the extent applicable to Fonts or Font Software that has been modified and is distributed under the \"MgOpen\" name.\r\n\r\nThe Font Software may be sold as part of a larger software package but no copy of one or more of the Font Software typefaces may be sold by itself. \r\n\r\nTHE FONT SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL MAGENTA OR PERSONS OR BODIES IN CHARGE OF ADMINISTRATION AND MAINTENANCE OF THE FONT SOFTWARE BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM OTHER DEALINGS IN THE FONT SOFTWARE.","manufacturer_name":"Μagenta ltd","font_sub_family_name":"Regular"},"descender":-334,"familyName":"Helvetiker","lineHeight":1522,"underlineThickness":50} 2 | --------------------------------------------------------------------------------