├── .editorconfig ├── .eslintrc.json ├── .gitattributes ├── .github └── workflows │ └── ci.yaml ├── .gitignore ├── .npmrc ├── docs ├── index.html └── index.js ├── example ├── example.js └── westminster.svg ├── license ├── package.json ├── readme.md ├── src └── index.js ├── test ├── data │ ├── simple.js │ ├── uk-2017-virtual-dom.js │ └── uk-2017.js ├── simple.js ├── uk-2017-virtual-dom.js ├── uk-2017.js └── util.js └── webpack.config.js /.editorconfig: -------------------------------------------------------------------------------- 1 | # editorconfig.org 2 | root = true 3 | 4 | [*] 5 | indent_style = tab 6 | end_of_line = lf 7 | charset = utf-8 8 | trim_trailing_whitespace = true 9 | insert_final_newline = true 10 | 11 | [*.{yml,yaml}] 12 | indent_style = space 13 | indent_size = 2 14 | -------------------------------------------------------------------------------- /.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "standard", 3 | "rules": { 4 | "comma-dangle": [ 5 | "error", 6 | "always-multiline" 7 | ], 8 | "indent": ["error", "tab"], 9 | "no-tabs": "off" 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | * text=auto eol=lf 2 | -------------------------------------------------------------------------------- /.github/workflows/ci.yaml: -------------------------------------------------------------------------------- 1 | name: CI 2 | on: 3 | [push, pull_request] 4 | jobs: 5 | test: 6 | runs-on: ubuntu-latest 7 | strategy: 8 | matrix: 9 | node-version: [14.x, 16.x] 10 | steps: 11 | - uses: actions/checkout@v2 12 | - name: Use Node.js ${{ matrix.node-version }} 13 | uses: actions/setup-node@v1 14 | with: 15 | node-version: ${{ matrix.node-version }} 16 | - run: npm i 17 | - run: npm test 18 | env: 19 | CI: true 20 | build-and-deploy: 21 | runs-on: ubuntu-latest 22 | needs: test 23 | if: github.ref == 'refs/heads/main' 24 | steps: 25 | - name: Checkout main 26 | uses: actions/checkout@v2 27 | - name: Use Node.js 14 28 | uses: actions/setup-node@v1 29 | with: 30 | node-version: 14 31 | - run: npm i 32 | - run: npm run build 33 | - run: touch docs/.nojekyll 34 | - name: Deploy 35 | uses: JamesIves/github-pages-deploy-action@4.1.3 36 | with: 37 | branch: gh-pages 38 | folder: docs 39 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # general 2 | .DS_Store 3 | *.log 4 | 5 | # node-specific 6 | node_modules 7 | package-lock.json 8 | yarn.lock 9 | shrinkwrap.yaml 10 | pnpm-lock.yaml 11 | dist 12 | 13 | /docs/bundle 14 | -------------------------------------------------------------------------------- /.npmrc: -------------------------------------------------------------------------------- 1 | package-lock=false 2 | -------------------------------------------------------------------------------- /docs/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | westminster-svg 6 | 7 | 8 | 9 | 10 | 116 | 117 |

westminster-svg

118 |

Create SVG patterns programmatically to visualize data.

119 |
120 |
121 |
122 |
123 | 173 |
174 |
175 |
176 | 177 | 178 | -------------------------------------------------------------------------------- /docs/index.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | 3 | import h from 'virtual-hyperscript-svg' 4 | import createElement from 'virtual-dom/create-element.js' 5 | import diff from 'virtual-dom/diff.js' 6 | import patch from 'virtual-dom/patch.js' 7 | 8 | import patterns from '../src/index.js' 9 | 10 | const data = document.querySelector('#demo-data') 11 | 12 | const render = () => patterns(JSON.parse(data.value), { hFunction: h }) 13 | 14 | let tree = render() 15 | let root = createElement(tree) 16 | document.querySelector('#demo-target').appendChild(root) 17 | 18 | const rerender = () => { 19 | const tree2 = render() 20 | root = patch(root, diff(tree, tree2)) 21 | tree = tree2 22 | } 23 | const callRerender = function () { 24 | return setTimeout(rerender, 5) 25 | } 26 | 27 | data.addEventListener('keydown', function (e) { 28 | // 8 is the keycode for backspace 29 | if (e.keyCode === 8) callRerender() 30 | }) 31 | data.addEventListener('keypress', function () { 32 | callRerender() 33 | }) 34 | -------------------------------------------------------------------------------- /example/example.js: -------------------------------------------------------------------------------- 1 | import { toHtml } from 'hast-util-to-html' 2 | import svgify from '../src/index.js' 3 | 4 | const westminster = { 5 | headBench: { 6 | speaker: { 7 | seats: 1, 8 | colour: '#000', 9 | }, 10 | }, 11 | left: { 12 | labour: { 13 | seats: 262, 14 | colour: '#dc241f', 15 | }, 16 | snp: { 17 | seats: 35, 18 | colour: '#ff0', 19 | }, 20 | libdems: { 21 | seats: 12, 22 | colour: '#faa61a', 23 | }, 24 | sinnfein: { 25 | seats: 7, 26 | colour: '#080', 27 | }, 28 | plaidcymru: { 29 | seats: 4, 30 | colour: '#008142', 31 | }, 32 | green: { 33 | seats: 1, 34 | colour: '#6ab023', 35 | }, 36 | independent: { 37 | seats: 1, 38 | colour: '#aadfff', 39 | }, 40 | }, 41 | crossBench: { 42 | dup: { 43 | seats: 10, 44 | colour: '#d46a4c', 45 | }, 46 | }, 47 | right: { 48 | conservative: { 49 | seats: 317, 50 | colour: '#0087dc', 51 | }, 52 | }, 53 | } 54 | 55 | process.stdout.write(toHtml(svgify(westminster))) 56 | -------------------------------------------------------------------------------- /example/westminster.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | 110 | 111 | 112 | 113 | 114 | 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | 126 | 127 | 128 | 129 | 130 | 131 | 132 | 133 | 134 | 135 | 136 | 137 | 138 | 139 | 140 | 141 | 142 | 143 | 144 | 145 | 146 | 147 | 148 | 149 | 150 | 151 | 152 | 153 | 154 | 155 | 156 | 157 | 158 | 159 | 160 | 161 | 162 | 163 | 164 | 165 | 166 | 167 | 168 | 169 | 170 | 171 | 172 | 173 | 174 | 175 | 176 | 177 | 178 | 179 | 180 | 181 | 182 | 183 | 184 | 185 | 186 | 187 | 188 | 189 | 190 | 191 | 192 | 193 | 194 | 195 | 196 | 197 | 198 | 199 | 200 | 201 | 202 | 203 | 204 | 205 | 206 | 207 | 208 | 209 | 210 | 211 | 212 | 213 | 214 | 215 | 216 | 217 | 218 | 219 | 220 | 221 | 222 | 223 | 224 | 225 | 226 | 227 | 228 | 229 | 230 | 231 | 232 | 233 | 234 | 235 | 236 | 237 | 238 | 239 | 240 | 241 | 242 | 243 | 244 | 245 | 246 | 247 | 248 | 249 | 250 | 251 | 252 | 253 | 254 | 255 | 256 | 257 | 258 | 259 | 260 | 261 | 262 | 263 | 264 | 265 | 266 | 267 | 268 | 269 | 270 | 271 | 272 | 273 | 274 | 275 | 276 | 277 | 278 | 279 | 280 | 281 | 282 | 283 | 284 | 285 | 286 | 287 | 288 | 289 | 290 | 291 | 292 | 293 | 294 | 295 | 296 | 297 | 298 | 299 | 300 | 301 | 302 | 303 | 304 | 305 | 306 | 307 | 308 | 309 | 310 | 311 | 312 | 313 | 314 | 315 | 316 | 317 | 318 | 319 | 320 | 321 | 322 | 323 | 324 | 325 | 326 | 327 | 328 | 329 | 330 | 331 | 332 | 333 | 334 | 335 | 336 | 337 | 338 | 339 | 340 | 341 | 342 | 343 | 344 | 345 | 346 | 347 | 348 | 349 | 350 | 351 | 352 | 353 | 354 | 355 | 356 | 357 | 358 | 359 | 360 | 361 | 362 | 363 | 364 | 365 | 366 | 367 | 368 | 369 | 370 | 371 | 372 | 373 | 374 | 375 | 376 | 377 | 378 | 379 | 380 | 381 | 382 | 383 | 384 | 385 | 386 | 387 | 388 | 389 | 390 | 391 | 392 | 393 | 394 | 395 | 396 | 397 | 398 | 399 | 400 | 401 | 402 | 403 | 404 | 405 | 406 | 407 | 408 | 409 | 410 | 411 | 412 | 413 | 414 | 415 | 416 | 417 | 418 | 419 | 420 | 421 | 422 | 423 | 424 | 425 | 426 | 427 | 428 | 429 | 430 | 431 | 432 | 433 | 434 | 435 | 436 | 437 | 438 | 439 | 440 | 441 | 442 | 443 | 444 | 445 | 446 | 447 | 448 | 449 | 450 | 451 | 452 | 453 | 454 | 455 | 456 | 457 | 458 | 459 | 460 | 461 | 462 | 463 | 464 | 465 | 466 | 467 | 468 | 469 | 470 | 471 | 472 | 473 | 474 | 475 | 476 | 477 | 478 | 479 | 480 | 481 | 482 | 483 | 484 | 485 | 486 | 487 | 488 | 489 | 490 | 491 | 492 | 493 | 494 | 495 | 496 | 497 | 498 | 499 | 500 | 501 | 502 | 503 | 504 | 505 | 506 | 507 | 508 | 509 | 510 | 511 | 512 | 513 | 514 | 515 | 516 | 517 | 518 | 519 | 520 | 521 | 522 | 523 | 524 | 525 | 526 | 527 | 528 | 529 | 530 | 531 | 532 | 533 | 534 | 535 | 536 | 537 | 538 | 539 | 540 | 541 | 542 | 543 | 544 | 545 | 546 | 547 | 548 | 549 | 550 | 551 | 552 | 553 | 554 | 555 | 556 | 557 | 558 | 559 | 560 | 561 | 562 | 563 | 564 | 565 | 566 | 567 | 568 | 569 | 570 | 571 | 572 | 573 | 574 | 575 | 576 | 577 | 578 | 579 | 580 | 581 | 582 | 583 | 584 | 585 | 586 | 587 | 588 | 589 | 590 | 591 | 592 | 593 | 594 | 595 | 596 | 597 | 598 | 599 | 600 | 601 | 602 | 603 | 604 | 605 | 606 | 607 | 608 | 609 | 610 | 611 | 612 | 613 | 614 | 615 | 616 | 617 | 618 | 619 | 620 | 621 | 622 | 623 | 624 | 625 | 626 | 627 | 628 | 629 | 630 | 631 | 632 | 633 | 634 | 635 | 636 | 637 | 638 | 639 | 640 | 641 | 642 | 643 | 644 | 645 | 646 | 647 | 648 | 649 | 650 | 651 | 652 | 653 | -------------------------------------------------------------------------------- /license: -------------------------------------------------------------------------------- 1 | Copyright (c) 2021, Julius Tens 2 | 3 | Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted, provided that the above copyright notice and this permission notice appear in all copies. 4 | 5 | THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. 6 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "westminster-svg", 3 | "description": "Generate westminster parliament charts as virtual-dom SVG.", 4 | "version": "2.0.0", 5 | "keywords": [ 6 | "parliament", 7 | "westminster", 8 | "house", 9 | "commons", 10 | "house of commons", 11 | "election", 12 | "wiki", 13 | "wikipedia", 14 | "parlament", 15 | "chart", 16 | "svg" 17 | ], 18 | "author": "Julius Tens ", 19 | "homepage": "https://github.com/juliuste/westminster-svg", 20 | "repository": "juliuste/westminster-svg", 21 | "bugs": "https://github.com/juliuste/westminster-svg/issues", 22 | "files": [ 23 | "src/*" 24 | ], 25 | "main": "src/index.js", 26 | "type": "module", 27 | "dependencies": { 28 | "hastscript": "^7.0.2", 29 | "lodash": "^4.17.21" 30 | }, 31 | "devDependencies": { 32 | "depcheck": "^1.4.2", 33 | "eslint": "^7.32.0", 34 | "eslint-config-standard": "^16.0.3", 35 | "eslint-plugin-import": "^2.24.2", 36 | "eslint-plugin-node": "^11.1.0", 37 | "eslint-plugin-promise": "^5.1.0", 38 | "hast-util-to-html": "^8.0.2", 39 | "tape": "^5.3.1", 40 | "virtual-dom": "^2.1.1", 41 | "virtual-hyperscript-svg": "^2.0.0", 42 | "webpack": "^5.56.1", 43 | "webpack-cli": "^4.8.0" 44 | }, 45 | "scripts": { 46 | "build": "webpack", 47 | "check-deps": "depcheck --ignores='webpack-cli' --ignore-dirs='bundle'", 48 | "fix": "npm run lint -- --fix", 49 | "lint": "eslint src test example docs/index.js", 50 | "prepublishOnly": "npm test", 51 | "test": "npm run lint && npm run check-deps && tape test/*.js" 52 | }, 53 | "license": "ISC", 54 | "engines": { 55 | "node": ">=14" 56 | } 57 | } 58 | -------------------------------------------------------------------------------- /readme.md: -------------------------------------------------------------------------------- 1 | # westminster-svg 2 | 3 | Generate westminster parliament charts as **[_hast_](https://github.com/syntax-tree/hast) virtual DOM SVG\***. Design inspired by the [Wikipedia parliament charts](https://github.com/slashme/parliamentdiagram). *Play around with the [__live demo__](https://juliuste.github.io/westminster-svg/)!* For "normal" parliament charts, see **[parliament-svg](https://github.com/juliuste/parliament-svg)**. 4 | 5 | \*Also compatible with other virtual DOM implementations, see the [docs below](#Usage). 6 | 7 | [![npm version](https://img.shields.io/npm/v/westminster-svg.svg)](https://www.npmjs.com/package/westminster-svg) 8 | [![License](https://img.shields.io/github/license/juliuste/westminster-svg.svg?style=flat)](license) 9 | [![Contact me](https://img.shields.io/badge/contact-email-turquoise)](mailto:mail@juliustens.eu) 10 | 11 | ## Installation 12 | 13 | **This package is [ESM only](https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c): Node 12+ is needed to use it and it must be `import`ed instead of `require`d.** 14 | 15 | ```shell 16 | npm install --save westminster-svg 17 | ``` 18 | 19 | ## Usage 20 | 21 | ```js 22 | import westminsterSVG from 'westminster-svg' 23 | 24 | const virtualSvg = westminsterSVG(parliament, [opt]) 25 | ``` 26 | 27 | - **`opt`** can contain the following options: 28 | - **`hFunction`** is a function that will be used to generate the element tree. Defaults to [`hastscript`](https://github.com/syntax-tree/hastscript/)'s `s()` function, custom values need to match that function's signature. You could use [`virtual-hyperscript-svg`](https://github.com/substack/virtual-hyperscript-svg)'s `h()` function here if you prefer working with [`virtual-dom`](https://github.com/Matt-Esch/virtual-dom), for example. 29 | - **`parliament`** is an object containing party information for all four 'sides' of the parliament: `headBench`, `left`, `crossBench` and `right`. After the [2017 UK general election](https://en.wikipedia.org/wiki/United_Kingdom_general_election,_2017) it should look as follows: 30 | 31 | ```js 32 | { 33 | headBench: { 34 | speaker: { 35 | seats: 1, 36 | colour: '#000' 37 | } 38 | }, 39 | left: { 40 | labour: { 41 | seats: 262, 42 | colour: '#dc241f', 43 | }, 44 | snp: { 45 | seats: 35, 46 | colour: '#ff0', 47 | }, 48 | libdems: { 49 | seats: 12, 50 | colour: '#faa61a', 51 | }, 52 | sinnfein: { 53 | seats: 7, 54 | colour: '#080', 55 | }, 56 | plaidcymru: { 57 | seats: 4, 58 | colour: '#008142', 59 | }, 60 | green: { 61 | seats: 1, 62 | colour: '#6ab023', 63 | }, 64 | independent: { 65 | seats: 1, 66 | colour: '#aadfff', 67 | } 68 | }, 69 | crossBench: { 70 | dup: { 71 | seats: 10, 72 | colour: '#d46a4c', 73 | } 74 | }, 75 | right: { 76 | conservative: { 77 | seats: 317, 78 | colour: '#0087dc', 79 | } 80 | } 81 | } 82 | ``` 83 | 84 | Please note that the parties will be displayed in the order of their `object` keys from left to right (based on the speaker's viewpoint). Further, each seat SVG element contains the party name in its `class` attribute. 85 | 86 | For the given `parliament` object, the rendered result should look as follows: 87 | 88 | ![Example: House of Commons after GE 2017](https://rawgit.com/juliuste/westminster-svg/main/example/westminster.svg) 89 | 90 | If you want to convert the [_hast_](https://github.com/syntax-tree/hast) tree to an SVG string, use `hast-util-to-html` (don't get confused by the name, the library can also stringify SVG): 91 | 92 | ```js 93 | import westminsterSVG from 'westminster-svg' 94 | import { toHtml as toSvg } from 'hast-util-to-html' 95 | 96 | const virtualSvg = westminsterSVG(parliament) 97 | const svg = toSvg(virtualSvg) 98 | ``` 99 | 100 | Check the [`code example`](example/example.js) as well. 101 | 102 | ### What if I prefer virtual-dom (or anything else)? 103 | 104 | If you prefer [`virtual-dom`](https://github.com/Matt-Esch/virtual-dom) over `hast`, e.g. for diffing or patching, you can either: 105 | - use [`hast-to-hyperscript`](https://github.com/syntax-tree/hast-to-hyperscript) to transform the tree after it was generated _or_ 106 | - use the [`hFunction`](#Usage) parameter documented above with a virtual-dom `h()` function of your choice 107 | 108 | ## Contributing 109 | 110 | If you found a bug or want to propose a feature, feel free to visit [the issues page](https://github.com/juliuste/westminster-svg/issues). 111 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | 3 | import { s as hastH } from 'hastscript' 4 | import roundTo from 'lodash/round.js' 5 | import max from 'lodash/max.js' 6 | import sortBy from 'lodash/sortBy.js' 7 | import sumBy from 'lodash/sumBy.js' 8 | import toArray from 'lodash/toArray.js' 9 | import reverse from 'lodash/reverse.js' 10 | 11 | const proportion = 1.1 * Math.PI 12 | 13 | const radius = 0.42 14 | const middleSpace = 2 / 3 15 | 16 | const round = (x) => roundTo(x, 8) 17 | 18 | const countSeatsInSide = (side) => 19 | sumBy(toArray(side), (p) => p.seats) 20 | 21 | const calculateWingRows = (parliament) => { 22 | const averageWingSize = sumBy([parliament.left, parliament.right], countSeatsInSide) / 2 23 | const rows = Math.ceil(Math.sqrt(averageWingSize / proportion)) 24 | return rows 25 | } 26 | 27 | const calculateHeight = (wingRows) => 2 * wingRows + middleSpace * 2 + 1 // this should - in theory - use 'headColumns' instead of the +1, but that shouldn't really matter for usual parliament sizes 28 | 29 | const calculateCrossRows = (cross, wingRows) => { 30 | const crossSeats = countSeatsInSide(cross) 31 | const maxColumns = max([1, Math.floor(calculateHeight(wingRows) - 0.75)]) 32 | let currentRows = 1 33 | while (Math.ceil(crossSeats / currentRows) > maxColumns) currentRows++ 34 | return currentRows 35 | } 36 | 37 | const calculateHeadColumns = (head, maxWingColumns) => { 38 | const headSeats = countSeatsInSide(head) 39 | const maxRows = Math.floor(maxWingColumns * 0.9) 40 | let currentColumns = 1 41 | while (Math.ceil(headSeats / currentColumns) > maxRows) currentColumns++ 42 | return currentColumns 43 | } 44 | 45 | const calculateMissingDimension = (side, knownDimension) => { 46 | const seats = countSeatsInSide(side) 47 | return Math.ceil(seats / knownDimension) 48 | } 49 | 50 | const generateHeadPoints = (headSeats, headRows, headColumns, startingPoint) => { 51 | const points = [] 52 | for (let row = 0; row < headRows; row++) { 53 | for (let column = 0; column < headColumns; column++) { 54 | let modifier 55 | if (row === headRows - 1) modifier = ((headColumns - (headSeats % headColumns)) % headColumns) / 2 // center last row if necessary 56 | else modifier = 0 57 | points.push([ 58 | startingPoint[0] + row, 59 | startingPoint[1] + column + modifier, 60 | ]) 61 | if (points.length === headSeats) return reverse(points) 62 | } 63 | } 64 | } 65 | 66 | const generateWingPoints = (wingSeats, wingRows, wingColumns, startingPoint, yDirection) => { 67 | const points = [] 68 | for (let column = 0; column < wingColumns; column++) { 69 | for (let row = 0; row < wingRows; row++) { 70 | points.push([ 71 | startingPoint[0] + column, 72 | startingPoint[1] + (row * yDirection), 73 | ]) 74 | if (points.length === wingSeats) return points 75 | } 76 | } 77 | } 78 | 79 | const generateCrossPoints = (crossSeats, crossRows, crossColumns, startingPoint) => { 80 | const points = [] 81 | for (let row = 0; row < crossRows; row++) { 82 | for (let column = 0; column < crossColumns; column++) { 83 | let modifier 84 | if (row === crossRows - 1) modifier = ((crossRows - (crossSeats % crossRows)) % crossRows) / 2 85 | else modifier = 0 86 | points.push([ 87 | startingPoint[0] + row, 88 | startingPoint[1] + column + modifier, 89 | ]) 90 | if (points.length === crossSeats) return sortBy(points, (p) => p[1]) 91 | } 92 | } 93 | } 94 | 95 | const fillPoint = (point, party, colour) => ({ 96 | x: round(point[0]), 97 | y: round(point[1]), 98 | r: radius, 99 | fill: colour, 100 | class: party, 101 | }) 102 | 103 | const fillSidePoints = (sidePoints, side) => { 104 | const filledPoints = [] 105 | let start = 0 106 | for (const party in side) { 107 | for (let i = 0; i < side[party].seats; i++) { 108 | filledPoints.push(fillPoint(sidePoints[start + i], party, side[party].colour)) 109 | } 110 | start += side[party].seats 111 | } 112 | return filledPoints 113 | } 114 | 115 | const generateChart = (parliament) => { 116 | const wingRows = calculateWingRows(parliament) 117 | const leftWingColumns = calculateMissingDimension(parliament.left, wingRows) 118 | const rightWingColumns = calculateMissingDimension(parliament.right, wingRows) 119 | 120 | // console.error(wingRows, leftWingColumns, rightWingColumns) 121 | 122 | const crossRows = calculateCrossRows(parliament.crossBench, wingRows) 123 | const crossColumns = calculateMissingDimension(parliament.crossBench, crossRows) 124 | 125 | // console.error(crossRows, crossColumns) 126 | 127 | const headColumns = calculateHeadColumns(parliament.headBench, max([leftWingColumns, rightWingColumns])) 128 | const headRows = calculateMissingDimension(parliament.headBench, headColumns) 129 | 130 | // console.error(headColumns, headRows) 131 | 132 | const headSeats = countSeatsInSide(parliament.headBench) 133 | const leftWingSeats = countSeatsInSide(parliament.left) 134 | const rightWingSeats = countSeatsInSide(parliament.right) 135 | const crossSeats = countSeatsInSide(parliament.crossBench) 136 | 137 | // console.error(headSeats, leftWingSeats, rightWingSeats, crossSeats) 138 | 139 | const headStart = [0, -(headColumns - 1) / 2] 140 | const leftWingStart = [1, headStart[1] - middleSpace - 1] 141 | const rightWingStart = [1, headStart[1] + (headColumns - 1) + middleSpace + 1] 142 | const crossStart = [1 + max([leftWingColumns, rightWingColumns]) + 1, -(crossColumns - 1) / 2] 143 | 144 | // console.error(headStart, leftWingStart, rightWingStart, crossStart) 145 | 146 | const padding = 0.5 147 | 148 | const left = headStart[0] - 0.5 - padding 149 | const top = leftWingStart[1] - (wingRows - 1) - 0.5 - padding 150 | const right = crossStart[0] + (crossRows - 1) + 0.5 + padding 151 | const bottom = rightWingStart[1] + (wingRows - 1) + 0.5 + padding 152 | const width = right - left 153 | const height = bottom - top 154 | 155 | // console.error(left, top, right, bottom, width, height) 156 | 157 | const headPoints = generateHeadPoints(headSeats, headRows, headColumns, headStart) 158 | const leftWingPoints = generateWingPoints(leftWingSeats, wingRows, leftWingColumns, leftWingStart, -1) 159 | const rightWingPoints = generateWingPoints(rightWingSeats, wingRows, rightWingColumns, rightWingStart, 1) 160 | const crossPoints = generateCrossPoints(crossSeats, crossRows, crossColumns, crossStart) 161 | 162 | const points = [] 163 | 164 | points.push(...fillSidePoints(headPoints, parliament.headBench)) 165 | points.push(...fillSidePoints(leftWingPoints, parliament.left)) 166 | points.push(...fillSidePoints(rightWingPoints, parliament.right)) 167 | points.push(...fillSidePoints(crossPoints, parliament.crossBench)) 168 | 169 | return { 170 | points, 171 | dimensions: { 172 | left, top, right, bottom, width, height, 173 | }, 174 | } 175 | } 176 | 177 | const pointToSVG = hFn => point => hFn('circle', { 178 | cx: point.x, 179 | cy: point.y, 180 | r: point.r, 181 | fill: point.fill, 182 | class: point.party, 183 | }) 184 | 185 | const defaults = { 186 | hFunction: hastH, 187 | } 188 | 189 | const generate = (parliament, options = {}) => { 190 | const { hFunction } = Object.assign({}, defaults, options) 191 | if (typeof hFunction !== 'function') throw new Error('`hFunction` option must be a function') 192 | 193 | const chart = generateChart(parliament) 194 | const elements = chart.points.map(pointToSVG(hFunction)) 195 | const document = hFunction('svg', { 196 | xmlns: 'http://www.w3.org/2000/svg', 197 | viewBox: [chart.dimensions.left, chart.dimensions.top, chart.dimensions.width, chart.dimensions.height].join(','), 198 | }, elements) 199 | return document 200 | } 201 | 202 | export default generate 203 | -------------------------------------------------------------------------------- /test/data/simple.js: -------------------------------------------------------------------------------- 1 | export default { 2 | type: 'element', 3 | tagName: 'svg', 4 | properties: { 5 | xmlns: 'http://www.w3.org/2000/svg', 6 | viewBox: '-1,-10.666666666666666,34,21.333333333333332', 7 | }, 8 | children: [ 9 | { 10 | type: 'element', 11 | tagName: 'circle', 12 | properties: { 13 | cx: 2, 14 | cy: 0, 15 | r: 0.42, 16 | fill: '#abc', 17 | }, 18 | children: [], 19 | }, 20 | { 21 | type: 'element', 22 | tagName: 'circle', 23 | properties: { 24 | cx: 1, 25 | cy: 0, 26 | r: 0.42, 27 | fill: '#abc', 28 | }, 29 | children: [], 30 | }, 31 | { 32 | type: 'element', 33 | tagName: 'circle', 34 | properties: { 35 | cx: 0, 36 | cy: 0, 37 | r: 0.42, 38 | fill: '#abc', 39 | }, 40 | children: [], 41 | }, 42 | { 43 | type: 'element', 44 | tagName: 'circle', 45 | properties: { 46 | cx: 1, 47 | cy: -1.66666667, 48 | r: 0.42, 49 | fill: '#d21', 50 | }, 51 | children: [], 52 | }, 53 | { 54 | type: 'element', 55 | tagName: 'circle', 56 | properties: { 57 | cx: 1, 58 | cy: -2.66666667, 59 | r: 0.42, 60 | fill: '#d21', 61 | }, 62 | children: [], 63 | }, 64 | { 65 | type: 'element', 66 | tagName: 'circle', 67 | properties: { 68 | cx: 1, 69 | cy: -3.66666667, 70 | r: 0.42, 71 | fill: '#d21', 72 | }, 73 | children: [], 74 | }, 75 | { 76 | type: 'element', 77 | tagName: 'circle', 78 | properties: { 79 | cx: 1, 80 | cy: -4.66666667, 81 | r: 0.42, 82 | fill: '#d21', 83 | }, 84 | children: [], 85 | }, 86 | { 87 | type: 'element', 88 | tagName: 'circle', 89 | properties: { 90 | cx: 1, 91 | cy: -5.66666667, 92 | r: 0.42, 93 | fill: '#d21', 94 | }, 95 | children: [], 96 | }, 97 | { 98 | type: 'element', 99 | tagName: 'circle', 100 | properties: { 101 | cx: 1, 102 | cy: -6.66666667, 103 | r: 0.42, 104 | fill: '#d21', 105 | }, 106 | children: [], 107 | }, 108 | { 109 | type: 'element', 110 | tagName: 'circle', 111 | properties: { 112 | cx: 1, 113 | cy: -7.66666667, 114 | r: 0.42, 115 | fill: '#d21', 116 | }, 117 | children: [], 118 | }, 119 | { 120 | type: 'element', 121 | tagName: 'circle', 122 | properties: { 123 | cx: 1, 124 | cy: -8.66666667, 125 | r: 0.42, 126 | fill: '#d21', 127 | }, 128 | children: [], 129 | }, 130 | { 131 | type: 'element', 132 | tagName: 'circle', 133 | properties: { 134 | cx: 1, 135 | cy: -9.66666667, 136 | r: 0.42, 137 | fill: '#d21', 138 | }, 139 | children: [], 140 | }, 141 | { 142 | type: 'element', 143 | tagName: 'circle', 144 | properties: { 145 | cx: 2, 146 | cy: -1.66666667, 147 | r: 0.42, 148 | fill: '#d21', 149 | }, 150 | children: [], 151 | }, 152 | { 153 | type: 'element', 154 | tagName: 'circle', 155 | properties: { 156 | cx: 2, 157 | cy: -2.66666667, 158 | r: 0.42, 159 | fill: '#d21', 160 | }, 161 | children: [], 162 | }, 163 | { 164 | type: 'element', 165 | tagName: 'circle', 166 | properties: { 167 | cx: 2, 168 | cy: -3.66666667, 169 | r: 0.42, 170 | fill: '#d21', 171 | }, 172 | children: [], 173 | }, 174 | { 175 | type: 'element', 176 | tagName: 'circle', 177 | properties: { 178 | cx: 2, 179 | cy: -4.66666667, 180 | r: 0.42, 181 | fill: '#d21', 182 | }, 183 | children: [], 184 | }, 185 | { 186 | type: 'element', 187 | tagName: 'circle', 188 | properties: { 189 | cx: 2, 190 | cy: -5.66666667, 191 | r: 0.42, 192 | fill: '#d21', 193 | }, 194 | children: [], 195 | }, 196 | { 197 | type: 'element', 198 | tagName: 'circle', 199 | properties: { 200 | cx: 2, 201 | cy: -6.66666667, 202 | r: 0.42, 203 | fill: '#d21', 204 | }, 205 | children: [], 206 | }, 207 | { 208 | type: 'element', 209 | tagName: 'circle', 210 | properties: { 211 | cx: 2, 212 | cy: -7.66666667, 213 | r: 0.42, 214 | fill: '#d21', 215 | }, 216 | children: [], 217 | }, 218 | { 219 | type: 'element', 220 | tagName: 'circle', 221 | properties: { 222 | cx: 2, 223 | cy: -8.66666667, 224 | r: 0.42, 225 | fill: '#d21', 226 | }, 227 | children: [], 228 | }, 229 | { 230 | type: 'element', 231 | tagName: 'circle', 232 | properties: { 233 | cx: 2, 234 | cy: -9.66666667, 235 | r: 0.42, 236 | fill: '#d21', 237 | }, 238 | children: [], 239 | }, 240 | { 241 | type: 'element', 242 | tagName: 'circle', 243 | properties: { 244 | cx: 3, 245 | cy: -1.66666667, 246 | r: 0.42, 247 | fill: '#d21', 248 | }, 249 | children: [], 250 | }, 251 | { 252 | type: 'element', 253 | tagName: 'circle', 254 | properties: { 255 | cx: 3, 256 | cy: -2.66666667, 257 | r: 0.42, 258 | fill: '#d21', 259 | }, 260 | children: [], 261 | }, 262 | { 263 | type: 'element', 264 | tagName: 'circle', 265 | properties: { 266 | cx: 3, 267 | cy: -3.66666667, 268 | r: 0.42, 269 | fill: '#d21', 270 | }, 271 | children: [], 272 | }, 273 | { 274 | type: 'element', 275 | tagName: 'circle', 276 | properties: { 277 | cx: 3, 278 | cy: -4.66666667, 279 | r: 0.42, 280 | fill: '#d21', 281 | }, 282 | children: [], 283 | }, 284 | { 285 | type: 'element', 286 | tagName: 'circle', 287 | properties: { 288 | cx: 3, 289 | cy: -5.66666667, 290 | r: 0.42, 291 | fill: '#d21', 292 | }, 293 | children: [], 294 | }, 295 | { 296 | type: 'element', 297 | tagName: 'circle', 298 | properties: { 299 | cx: 3, 300 | cy: -6.66666667, 301 | r: 0.42, 302 | fill: '#d21', 303 | }, 304 | children: [], 305 | }, 306 | { 307 | type: 'element', 308 | tagName: 'circle', 309 | properties: { 310 | cx: 3, 311 | cy: -7.66666667, 312 | r: 0.42, 313 | fill: '#d21', 314 | }, 315 | children: [], 316 | }, 317 | { 318 | type: 'element', 319 | tagName: 'circle', 320 | properties: { 321 | cx: 3, 322 | cy: -8.66666667, 323 | r: 0.42, 324 | fill: '#d21', 325 | }, 326 | children: [], 327 | }, 328 | { 329 | type: 'element', 330 | tagName: 'circle', 331 | properties: { 332 | cx: 3, 333 | cy: -9.66666667, 334 | r: 0.42, 335 | fill: '#d21', 336 | }, 337 | children: [], 338 | }, 339 | { 340 | type: 'element', 341 | tagName: 'circle', 342 | properties: { 343 | cx: 4, 344 | cy: -1.66666667, 345 | r: 0.42, 346 | fill: '#d21', 347 | }, 348 | children: [], 349 | }, 350 | { 351 | type: 'element', 352 | tagName: 'circle', 353 | properties: { 354 | cx: 4, 355 | cy: -2.66666667, 356 | r: 0.42, 357 | fill: '#d21', 358 | }, 359 | children: [], 360 | }, 361 | { 362 | type: 'element', 363 | tagName: 'circle', 364 | properties: { 365 | cx: 4, 366 | cy: -3.66666667, 367 | r: 0.42, 368 | fill: '#d21', 369 | }, 370 | children: [], 371 | }, 372 | { 373 | type: 'element', 374 | tagName: 'circle', 375 | properties: { 376 | cx: 4, 377 | cy: -4.66666667, 378 | r: 0.42, 379 | fill: '#d21', 380 | }, 381 | children: [], 382 | }, 383 | { 384 | type: 'element', 385 | tagName: 'circle', 386 | properties: { 387 | cx: 4, 388 | cy: -5.66666667, 389 | r: 0.42, 390 | fill: '#d21', 391 | }, 392 | children: [], 393 | }, 394 | { 395 | type: 'element', 396 | tagName: 'circle', 397 | properties: { 398 | cx: 4, 399 | cy: -6.66666667, 400 | r: 0.42, 401 | fill: '#d21', 402 | }, 403 | children: [], 404 | }, 405 | { 406 | type: 'element', 407 | tagName: 'circle', 408 | properties: { 409 | cx: 4, 410 | cy: -7.66666667, 411 | r: 0.42, 412 | fill: '#d21', 413 | }, 414 | children: [], 415 | }, 416 | { 417 | type: 'element', 418 | tagName: 'circle', 419 | properties: { 420 | cx: 4, 421 | cy: -8.66666667, 422 | r: 0.42, 423 | fill: '#d21', 424 | }, 425 | children: [], 426 | }, 427 | { 428 | type: 'element', 429 | tagName: 'circle', 430 | properties: { 431 | cx: 4, 432 | cy: -9.66666667, 433 | r: 0.42, 434 | fill: '#d21', 435 | }, 436 | children: [], 437 | }, 438 | { 439 | type: 'element', 440 | tagName: 'circle', 441 | properties: { 442 | cx: 5, 443 | cy: -1.66666667, 444 | r: 0.42, 445 | fill: '#d21', 446 | }, 447 | children: [], 448 | }, 449 | { 450 | type: 'element', 451 | tagName: 'circle', 452 | properties: { 453 | cx: 5, 454 | cy: -2.66666667, 455 | r: 0.42, 456 | fill: '#d21', 457 | }, 458 | children: [], 459 | }, 460 | { 461 | type: 'element', 462 | tagName: 'circle', 463 | properties: { 464 | cx: 5, 465 | cy: -3.66666667, 466 | r: 0.42, 467 | fill: '#d21', 468 | }, 469 | children: [], 470 | }, 471 | { 472 | type: 'element', 473 | tagName: 'circle', 474 | properties: { 475 | cx: 5, 476 | cy: -4.66666667, 477 | r: 0.42, 478 | fill: '#d21', 479 | }, 480 | children: [], 481 | }, 482 | { 483 | type: 'element', 484 | tagName: 'circle', 485 | properties: { 486 | cx: 5, 487 | cy: -5.66666667, 488 | r: 0.42, 489 | fill: '#d21', 490 | }, 491 | children: [], 492 | }, 493 | { 494 | type: 'element', 495 | tagName: 'circle', 496 | properties: { 497 | cx: 5, 498 | cy: -6.66666667, 499 | r: 0.42, 500 | fill: '#d21', 501 | }, 502 | children: [], 503 | }, 504 | { 505 | type: 'element', 506 | tagName: 'circle', 507 | properties: { 508 | cx: 5, 509 | cy: -7.66666667, 510 | r: 0.42, 511 | fill: '#d21', 512 | }, 513 | children: [], 514 | }, 515 | { 516 | type: 'element', 517 | tagName: 'circle', 518 | properties: { 519 | cx: 5, 520 | cy: -8.66666667, 521 | r: 0.42, 522 | fill: '#d21', 523 | }, 524 | children: [], 525 | }, 526 | { 527 | type: 'element', 528 | tagName: 'circle', 529 | properties: { 530 | cx: 5, 531 | cy: -9.66666667, 532 | r: 0.42, 533 | fill: '#d21', 534 | }, 535 | children: [], 536 | }, 537 | { 538 | type: 'element', 539 | tagName: 'circle', 540 | properties: { 541 | cx: 6, 542 | cy: -1.66666667, 543 | r: 0.42, 544 | fill: '#d21', 545 | }, 546 | children: [], 547 | }, 548 | { 549 | type: 'element', 550 | tagName: 'circle', 551 | properties: { 552 | cx: 6, 553 | cy: -2.66666667, 554 | r: 0.42, 555 | fill: '#d21', 556 | }, 557 | children: [], 558 | }, 559 | { 560 | type: 'element', 561 | tagName: 'circle', 562 | properties: { 563 | cx: 6, 564 | cy: -3.66666667, 565 | r: 0.42, 566 | fill: '#d21', 567 | }, 568 | children: [], 569 | }, 570 | { 571 | type: 'element', 572 | tagName: 'circle', 573 | properties: { 574 | cx: 6, 575 | cy: -4.66666667, 576 | r: 0.42, 577 | fill: '#d21', 578 | }, 579 | children: [], 580 | }, 581 | { 582 | type: 'element', 583 | tagName: 'circle', 584 | properties: { 585 | cx: 6, 586 | cy: -5.66666667, 587 | r: 0.42, 588 | fill: '#d21', 589 | }, 590 | children: [], 591 | }, 592 | { 593 | type: 'element', 594 | tagName: 'circle', 595 | properties: { 596 | cx: 6, 597 | cy: -6.66666667, 598 | r: 0.42, 599 | fill: '#d21', 600 | }, 601 | children: [], 602 | }, 603 | { 604 | type: 'element', 605 | tagName: 'circle', 606 | properties: { 607 | cx: 6, 608 | cy: -7.66666667, 609 | r: 0.42, 610 | fill: '#d21', 611 | }, 612 | children: [], 613 | }, 614 | { 615 | type: 'element', 616 | tagName: 'circle', 617 | properties: { 618 | cx: 6, 619 | cy: -8.66666667, 620 | r: 0.42, 621 | fill: '#d21', 622 | }, 623 | children: [], 624 | }, 625 | { 626 | type: 'element', 627 | tagName: 'circle', 628 | properties: { 629 | cx: 6, 630 | cy: -9.66666667, 631 | r: 0.42, 632 | fill: '#d21', 633 | }, 634 | children: [], 635 | }, 636 | { 637 | type: 'element', 638 | tagName: 'circle', 639 | properties: { 640 | cx: 7, 641 | cy: -1.66666667, 642 | r: 0.42, 643 | fill: '#d21', 644 | }, 645 | children: [], 646 | }, 647 | { 648 | type: 'element', 649 | tagName: 'circle', 650 | properties: { 651 | cx: 7, 652 | cy: -2.66666667, 653 | r: 0.42, 654 | fill: '#d21', 655 | }, 656 | children: [], 657 | }, 658 | { 659 | type: 'element', 660 | tagName: 'circle', 661 | properties: { 662 | cx: 7, 663 | cy: -3.66666667, 664 | r: 0.42, 665 | fill: '#d21', 666 | }, 667 | children: [], 668 | }, 669 | { 670 | type: 'element', 671 | tagName: 'circle', 672 | properties: { 673 | cx: 7, 674 | cy: -4.66666667, 675 | r: 0.42, 676 | fill: '#d21', 677 | }, 678 | children: [], 679 | }, 680 | { 681 | type: 'element', 682 | tagName: 'circle', 683 | properties: { 684 | cx: 7, 685 | cy: -5.66666667, 686 | r: 0.42, 687 | fill: '#d21', 688 | }, 689 | children: [], 690 | }, 691 | { 692 | type: 'element', 693 | tagName: 'circle', 694 | properties: { 695 | cx: 7, 696 | cy: -6.66666667, 697 | r: 0.42, 698 | fill: '#d21', 699 | }, 700 | children: [], 701 | }, 702 | { 703 | type: 'element', 704 | tagName: 'circle', 705 | properties: { 706 | cx: 7, 707 | cy: -7.66666667, 708 | r: 0.42, 709 | fill: '#d21', 710 | }, 711 | children: [], 712 | }, 713 | { 714 | type: 'element', 715 | tagName: 'circle', 716 | properties: { 717 | cx: 7, 718 | cy: -8.66666667, 719 | r: 0.42, 720 | fill: '#d21', 721 | }, 722 | children: [], 723 | }, 724 | { 725 | type: 'element', 726 | tagName: 'circle', 727 | properties: { 728 | cx: 7, 729 | cy: -9.66666667, 730 | r: 0.42, 731 | fill: '#d21', 732 | }, 733 | children: [], 734 | }, 735 | { 736 | type: 'element', 737 | tagName: 'circle', 738 | properties: { 739 | cx: 8, 740 | cy: -1.66666667, 741 | r: 0.42, 742 | fill: '#d21', 743 | }, 744 | children: [], 745 | }, 746 | { 747 | type: 'element', 748 | tagName: 'circle', 749 | properties: { 750 | cx: 8, 751 | cy: -2.66666667, 752 | r: 0.42, 753 | fill: '#d21', 754 | }, 755 | children: [], 756 | }, 757 | { 758 | type: 'element', 759 | tagName: 'circle', 760 | properties: { 761 | cx: 8, 762 | cy: -3.66666667, 763 | r: 0.42, 764 | fill: '#d21', 765 | }, 766 | children: [], 767 | }, 768 | { 769 | type: 'element', 770 | tagName: 'circle', 771 | properties: { 772 | cx: 8, 773 | cy: -4.66666667, 774 | r: 0.42, 775 | fill: '#d21', 776 | }, 777 | children: [], 778 | }, 779 | { 780 | type: 'element', 781 | tagName: 'circle', 782 | properties: { 783 | cx: 8, 784 | cy: -5.66666667, 785 | r: 0.42, 786 | fill: '#d21', 787 | }, 788 | children: [], 789 | }, 790 | { 791 | type: 'element', 792 | tagName: 'circle', 793 | properties: { 794 | cx: 8, 795 | cy: -6.66666667, 796 | r: 0.42, 797 | fill: '#d21', 798 | }, 799 | children: [], 800 | }, 801 | { 802 | type: 'element', 803 | tagName: 'circle', 804 | properties: { 805 | cx: 8, 806 | cy: -7.66666667, 807 | r: 0.42, 808 | fill: '#d21', 809 | }, 810 | children: [], 811 | }, 812 | { 813 | type: 'element', 814 | tagName: 'circle', 815 | properties: { 816 | cx: 8, 817 | cy: -8.66666667, 818 | r: 0.42, 819 | fill: '#d21', 820 | }, 821 | children: [], 822 | }, 823 | { 824 | type: 'element', 825 | tagName: 'circle', 826 | properties: { 827 | cx: 8, 828 | cy: -9.66666667, 829 | r: 0.42, 830 | fill: '#d21', 831 | }, 832 | children: [], 833 | }, 834 | { 835 | type: 'element', 836 | tagName: 'circle', 837 | properties: { 838 | cx: 9, 839 | cy: -1.66666667, 840 | r: 0.42, 841 | fill: '#d21', 842 | }, 843 | children: [], 844 | }, 845 | { 846 | type: 'element', 847 | tagName: 'circle', 848 | properties: { 849 | cx: 9, 850 | cy: -2.66666667, 851 | r: 0.42, 852 | fill: '#d21', 853 | }, 854 | children: [], 855 | }, 856 | { 857 | type: 'element', 858 | tagName: 'circle', 859 | properties: { 860 | cx: 9, 861 | cy: -3.66666667, 862 | r: 0.42, 863 | fill: '#d21', 864 | }, 865 | children: [], 866 | }, 867 | { 868 | type: 'element', 869 | tagName: 'circle', 870 | properties: { 871 | cx: 9, 872 | cy: -4.66666667, 873 | r: 0.42, 874 | fill: '#d21', 875 | }, 876 | children: [], 877 | }, 878 | { 879 | type: 'element', 880 | tagName: 'circle', 881 | properties: { 882 | cx: 9, 883 | cy: -5.66666667, 884 | r: 0.42, 885 | fill: '#d21', 886 | }, 887 | children: [], 888 | }, 889 | { 890 | type: 'element', 891 | tagName: 'circle', 892 | properties: { 893 | cx: 9, 894 | cy: -6.66666667, 895 | r: 0.42, 896 | fill: '#d21', 897 | }, 898 | children: [], 899 | }, 900 | { 901 | type: 'element', 902 | tagName: 'circle', 903 | properties: { 904 | cx: 9, 905 | cy: -7.66666667, 906 | r: 0.42, 907 | fill: '#d21', 908 | }, 909 | children: [], 910 | }, 911 | { 912 | type: 'element', 913 | tagName: 'circle', 914 | properties: { 915 | cx: 9, 916 | cy: -8.66666667, 917 | r: 0.42, 918 | fill: '#d21', 919 | }, 920 | children: [], 921 | }, 922 | { 923 | type: 'element', 924 | tagName: 'circle', 925 | properties: { 926 | cx: 9, 927 | cy: -9.66666667, 928 | r: 0.42, 929 | fill: '#d21', 930 | }, 931 | children: [], 932 | }, 933 | { 934 | type: 'element', 935 | tagName: 'circle', 936 | properties: { 937 | cx: 10, 938 | cy: -1.66666667, 939 | r: 0.42, 940 | fill: '#d21', 941 | }, 942 | children: [], 943 | }, 944 | { 945 | type: 'element', 946 | tagName: 'circle', 947 | properties: { 948 | cx: 10, 949 | cy: -2.66666667, 950 | r: 0.42, 951 | fill: '#d21', 952 | }, 953 | children: [], 954 | }, 955 | { 956 | type: 'element', 957 | tagName: 'circle', 958 | properties: { 959 | cx: 10, 960 | cy: -3.66666667, 961 | r: 0.42, 962 | fill: '#d21', 963 | }, 964 | children: [], 965 | }, 966 | { 967 | type: 'element', 968 | tagName: 'circle', 969 | properties: { 970 | cx: 10, 971 | cy: -4.66666667, 972 | r: 0.42, 973 | fill: '#d21', 974 | }, 975 | children: [], 976 | }, 977 | { 978 | type: 'element', 979 | tagName: 'circle', 980 | properties: { 981 | cx: 10, 982 | cy: -5.66666667, 983 | r: 0.42, 984 | fill: '#d21', 985 | }, 986 | children: [], 987 | }, 988 | { 989 | type: 'element', 990 | tagName: 'circle', 991 | properties: { 992 | cx: 10, 993 | cy: -6.66666667, 994 | r: 0.42, 995 | fill: '#d21', 996 | }, 997 | children: [], 998 | }, 999 | { 1000 | type: 'element', 1001 | tagName: 'circle', 1002 | properties: { 1003 | cx: 10, 1004 | cy: -7.66666667, 1005 | r: 0.42, 1006 | fill: '#d21', 1007 | }, 1008 | children: [], 1009 | }, 1010 | { 1011 | type: 'element', 1012 | tagName: 'circle', 1013 | properties: { 1014 | cx: 10, 1015 | cy: -8.66666667, 1016 | r: 0.42, 1017 | fill: '#d21', 1018 | }, 1019 | children: [], 1020 | }, 1021 | { 1022 | type: 'element', 1023 | tagName: 'circle', 1024 | properties: { 1025 | cx: 10, 1026 | cy: -9.66666667, 1027 | r: 0.42, 1028 | fill: '#d21', 1029 | }, 1030 | children: [], 1031 | }, 1032 | { 1033 | type: 'element', 1034 | tagName: 'circle', 1035 | properties: { 1036 | cx: 11, 1037 | cy: -1.66666667, 1038 | r: 0.42, 1039 | fill: '#d21', 1040 | }, 1041 | children: [], 1042 | }, 1043 | { 1044 | type: 'element', 1045 | tagName: 'circle', 1046 | properties: { 1047 | cx: 11, 1048 | cy: -2.66666667, 1049 | r: 0.42, 1050 | fill: '#d21', 1051 | }, 1052 | children: [], 1053 | }, 1054 | { 1055 | type: 'element', 1056 | tagName: 'circle', 1057 | properties: { 1058 | cx: 11, 1059 | cy: -3.66666667, 1060 | r: 0.42, 1061 | fill: '#d21', 1062 | }, 1063 | children: [], 1064 | }, 1065 | { 1066 | type: 'element', 1067 | tagName: 'circle', 1068 | properties: { 1069 | cx: 11, 1070 | cy: -4.66666667, 1071 | r: 0.42, 1072 | fill: '#d21', 1073 | }, 1074 | children: [], 1075 | }, 1076 | { 1077 | type: 'element', 1078 | tagName: 'circle', 1079 | properties: { 1080 | cx: 11, 1081 | cy: -5.66666667, 1082 | r: 0.42, 1083 | fill: '#d21', 1084 | }, 1085 | children: [], 1086 | }, 1087 | { 1088 | type: 'element', 1089 | tagName: 'circle', 1090 | properties: { 1091 | cx: 11, 1092 | cy: -6.66666667, 1093 | r: 0.42, 1094 | fill: '#d21', 1095 | }, 1096 | children: [], 1097 | }, 1098 | { 1099 | type: 'element', 1100 | tagName: 'circle', 1101 | properties: { 1102 | cx: 11, 1103 | cy: -7.66666667, 1104 | r: 0.42, 1105 | fill: '#d21', 1106 | }, 1107 | children: [], 1108 | }, 1109 | { 1110 | type: 'element', 1111 | tagName: 'circle', 1112 | properties: { 1113 | cx: 11, 1114 | cy: -8.66666667, 1115 | r: 0.42, 1116 | fill: '#d21', 1117 | }, 1118 | children: [], 1119 | }, 1120 | { 1121 | type: 'element', 1122 | tagName: 'circle', 1123 | properties: { 1124 | cx: 11, 1125 | cy: -9.66666667, 1126 | r: 0.42, 1127 | fill: '#d21', 1128 | }, 1129 | children: [], 1130 | }, 1131 | { 1132 | type: 'element', 1133 | tagName: 'circle', 1134 | properties: { 1135 | cx: 12, 1136 | cy: -1.66666667, 1137 | r: 0.42, 1138 | fill: '#d21', 1139 | }, 1140 | children: [], 1141 | }, 1142 | { 1143 | type: 'element', 1144 | tagName: 'circle', 1145 | properties: { 1146 | cx: 12, 1147 | cy: -2.66666667, 1148 | r: 0.42, 1149 | fill: '#d21', 1150 | }, 1151 | children: [], 1152 | }, 1153 | { 1154 | type: 'element', 1155 | tagName: 'circle', 1156 | properties: { 1157 | cx: 12, 1158 | cy: -3.66666667, 1159 | r: 0.42, 1160 | fill: '#d21', 1161 | }, 1162 | children: [], 1163 | }, 1164 | { 1165 | type: 'element', 1166 | tagName: 'circle', 1167 | properties: { 1168 | cx: 12, 1169 | cy: -4.66666667, 1170 | r: 0.42, 1171 | fill: '#d21', 1172 | }, 1173 | children: [], 1174 | }, 1175 | { 1176 | type: 'element', 1177 | tagName: 'circle', 1178 | properties: { 1179 | cx: 12, 1180 | cy: -5.66666667, 1181 | r: 0.42, 1182 | fill: '#d21', 1183 | }, 1184 | children: [], 1185 | }, 1186 | { 1187 | type: 'element', 1188 | tagName: 'circle', 1189 | properties: { 1190 | cx: 12, 1191 | cy: -6.66666667, 1192 | r: 0.42, 1193 | fill: '#d21', 1194 | }, 1195 | children: [], 1196 | }, 1197 | { 1198 | type: 'element', 1199 | tagName: 'circle', 1200 | properties: { 1201 | cx: 12, 1202 | cy: -7.66666667, 1203 | r: 0.42, 1204 | fill: '#d21', 1205 | }, 1206 | children: [], 1207 | }, 1208 | { 1209 | type: 'element', 1210 | tagName: 'circle', 1211 | properties: { 1212 | cx: 12, 1213 | cy: -8.66666667, 1214 | r: 0.42, 1215 | fill: '#d21', 1216 | }, 1217 | children: [], 1218 | }, 1219 | { 1220 | type: 'element', 1221 | tagName: 'circle', 1222 | properties: { 1223 | cx: 12, 1224 | cy: -9.66666667, 1225 | r: 0.42, 1226 | fill: '#d21', 1227 | }, 1228 | children: [], 1229 | }, 1230 | { 1231 | type: 'element', 1232 | tagName: 'circle', 1233 | properties: { 1234 | cx: 13, 1235 | cy: -1.66666667, 1236 | r: 0.42, 1237 | fill: '#d21', 1238 | }, 1239 | children: [], 1240 | }, 1241 | { 1242 | type: 'element', 1243 | tagName: 'circle', 1244 | properties: { 1245 | cx: 13, 1246 | cy: -2.66666667, 1247 | r: 0.42, 1248 | fill: '#d21', 1249 | }, 1250 | children: [], 1251 | }, 1252 | { 1253 | type: 'element', 1254 | tagName: 'circle', 1255 | properties: { 1256 | cx: 13, 1257 | cy: -3.66666667, 1258 | r: 0.42, 1259 | fill: '#d21', 1260 | }, 1261 | children: [], 1262 | }, 1263 | { 1264 | type: 'element', 1265 | tagName: 'circle', 1266 | properties: { 1267 | cx: 13, 1268 | cy: -4.66666667, 1269 | r: 0.42, 1270 | fill: '#d21', 1271 | }, 1272 | children: [], 1273 | }, 1274 | { 1275 | type: 'element', 1276 | tagName: 'circle', 1277 | properties: { 1278 | cx: 13, 1279 | cy: -5.66666667, 1280 | r: 0.42, 1281 | fill: '#d21', 1282 | }, 1283 | children: [], 1284 | }, 1285 | { 1286 | type: 'element', 1287 | tagName: 'circle', 1288 | properties: { 1289 | cx: 13, 1290 | cy: -6.66666667, 1291 | r: 0.42, 1292 | fill: '#d21', 1293 | }, 1294 | children: [], 1295 | }, 1296 | { 1297 | type: 'element', 1298 | tagName: 'circle', 1299 | properties: { 1300 | cx: 13, 1301 | cy: -7.66666667, 1302 | r: 0.42, 1303 | fill: '#d21', 1304 | }, 1305 | children: [], 1306 | }, 1307 | { 1308 | type: 'element', 1309 | tagName: 'circle', 1310 | properties: { 1311 | cx: 13, 1312 | cy: -8.66666667, 1313 | r: 0.42, 1314 | fill: '#d21', 1315 | }, 1316 | children: [], 1317 | }, 1318 | { 1319 | type: 'element', 1320 | tagName: 'circle', 1321 | properties: { 1322 | cx: 13, 1323 | cy: -9.66666667, 1324 | r: 0.42, 1325 | fill: '#d21', 1326 | }, 1327 | children: [], 1328 | }, 1329 | { 1330 | type: 'element', 1331 | tagName: 'circle', 1332 | properties: { 1333 | cx: 14, 1334 | cy: -1.66666667, 1335 | r: 0.42, 1336 | fill: '#d21', 1337 | }, 1338 | children: [], 1339 | }, 1340 | { 1341 | type: 'element', 1342 | tagName: 'circle', 1343 | properties: { 1344 | cx: 14, 1345 | cy: -2.66666667, 1346 | r: 0.42, 1347 | fill: '#d21', 1348 | }, 1349 | children: [], 1350 | }, 1351 | { 1352 | type: 'element', 1353 | tagName: 'circle', 1354 | properties: { 1355 | cx: 14, 1356 | cy: -3.66666667, 1357 | r: 0.42, 1358 | fill: '#d21', 1359 | }, 1360 | children: [], 1361 | }, 1362 | { 1363 | type: 'element', 1364 | tagName: 'circle', 1365 | properties: { 1366 | cx: 14, 1367 | cy: -4.66666667, 1368 | r: 0.42, 1369 | fill: '#d21', 1370 | }, 1371 | children: [], 1372 | }, 1373 | { 1374 | type: 'element', 1375 | tagName: 'circle', 1376 | properties: { 1377 | cx: 14, 1378 | cy: -5.66666667, 1379 | r: 0.42, 1380 | fill: '#d21', 1381 | }, 1382 | children: [], 1383 | }, 1384 | { 1385 | type: 'element', 1386 | tagName: 'circle', 1387 | properties: { 1388 | cx: 14, 1389 | cy: -6.66666667, 1390 | r: 0.42, 1391 | fill: '#d21', 1392 | }, 1393 | children: [], 1394 | }, 1395 | { 1396 | type: 'element', 1397 | tagName: 'circle', 1398 | properties: { 1399 | cx: 14, 1400 | cy: -7.66666667, 1401 | r: 0.42, 1402 | fill: '#d21', 1403 | }, 1404 | children: [], 1405 | }, 1406 | { 1407 | type: 'element', 1408 | tagName: 'circle', 1409 | properties: { 1410 | cx: 14, 1411 | cy: -8.66666667, 1412 | r: 0.42, 1413 | fill: '#d21', 1414 | }, 1415 | children: [], 1416 | }, 1417 | { 1418 | type: 'element', 1419 | tagName: 'circle', 1420 | properties: { 1421 | cx: 14, 1422 | cy: -9.66666667, 1423 | r: 0.42, 1424 | fill: '#d21', 1425 | }, 1426 | children: [], 1427 | }, 1428 | { 1429 | type: 'element', 1430 | tagName: 'circle', 1431 | properties: { 1432 | cx: 15, 1433 | cy: -1.66666667, 1434 | r: 0.42, 1435 | fill: '#d21', 1436 | }, 1437 | children: [], 1438 | }, 1439 | { 1440 | type: 'element', 1441 | tagName: 'circle', 1442 | properties: { 1443 | cx: 15, 1444 | cy: -2.66666667, 1445 | r: 0.42, 1446 | fill: '#d21', 1447 | }, 1448 | children: [], 1449 | }, 1450 | { 1451 | type: 'element', 1452 | tagName: 'circle', 1453 | properties: { 1454 | cx: 15, 1455 | cy: -3.66666667, 1456 | r: 0.42, 1457 | fill: '#d21', 1458 | }, 1459 | children: [], 1460 | }, 1461 | { 1462 | type: 'element', 1463 | tagName: 'circle', 1464 | properties: { 1465 | cx: 15, 1466 | cy: -4.66666667, 1467 | r: 0.42, 1468 | fill: '#d21', 1469 | }, 1470 | children: [], 1471 | }, 1472 | { 1473 | type: 'element', 1474 | tagName: 'circle', 1475 | properties: { 1476 | cx: 15, 1477 | cy: -5.66666667, 1478 | r: 0.42, 1479 | fill: '#d21', 1480 | }, 1481 | children: [], 1482 | }, 1483 | { 1484 | type: 'element', 1485 | tagName: 'circle', 1486 | properties: { 1487 | cx: 15, 1488 | cy: -6.66666667, 1489 | r: 0.42, 1490 | fill: '#d21', 1491 | }, 1492 | children: [], 1493 | }, 1494 | { 1495 | type: 'element', 1496 | tagName: 'circle', 1497 | properties: { 1498 | cx: 15, 1499 | cy: -7.66666667, 1500 | r: 0.42, 1501 | fill: '#d21', 1502 | }, 1503 | children: [], 1504 | }, 1505 | { 1506 | type: 'element', 1507 | tagName: 'circle', 1508 | properties: { 1509 | cx: 15, 1510 | cy: -8.66666667, 1511 | r: 0.42, 1512 | fill: '#d21', 1513 | }, 1514 | children: [], 1515 | }, 1516 | { 1517 | type: 'element', 1518 | tagName: 'circle', 1519 | properties: { 1520 | cx: 15, 1521 | cy: -9.66666667, 1522 | r: 0.42, 1523 | fill: '#d21', 1524 | }, 1525 | children: [], 1526 | }, 1527 | { 1528 | type: 'element', 1529 | tagName: 'circle', 1530 | properties: { 1531 | cx: 16, 1532 | cy: -1.66666667, 1533 | r: 0.42, 1534 | fill: '#d21', 1535 | }, 1536 | children: [], 1537 | }, 1538 | { 1539 | type: 'element', 1540 | tagName: 'circle', 1541 | properties: { 1542 | cx: 16, 1543 | cy: -2.66666667, 1544 | r: 0.42, 1545 | fill: '#d21', 1546 | }, 1547 | children: [], 1548 | }, 1549 | { 1550 | type: 'element', 1551 | tagName: 'circle', 1552 | properties: { 1553 | cx: 16, 1554 | cy: -3.66666667, 1555 | r: 0.42, 1556 | fill: '#d21', 1557 | }, 1558 | children: [], 1559 | }, 1560 | { 1561 | type: 'element', 1562 | tagName: 'circle', 1563 | properties: { 1564 | cx: 16, 1565 | cy: -4.66666667, 1566 | r: 0.42, 1567 | fill: '#d21', 1568 | }, 1569 | children: [], 1570 | }, 1571 | { 1572 | type: 'element', 1573 | tagName: 'circle', 1574 | properties: { 1575 | cx: 16, 1576 | cy: -5.66666667, 1577 | r: 0.42, 1578 | fill: '#d21', 1579 | }, 1580 | children: [], 1581 | }, 1582 | { 1583 | type: 'element', 1584 | tagName: 'circle', 1585 | properties: { 1586 | cx: 16, 1587 | cy: -6.66666667, 1588 | r: 0.42, 1589 | fill: '#d21', 1590 | }, 1591 | children: [], 1592 | }, 1593 | { 1594 | type: 'element', 1595 | tagName: 'circle', 1596 | properties: { 1597 | cx: 16, 1598 | cy: -7.66666667, 1599 | r: 0.42, 1600 | fill: '#d21', 1601 | }, 1602 | children: [], 1603 | }, 1604 | { 1605 | type: 'element', 1606 | tagName: 'circle', 1607 | properties: { 1608 | cx: 16, 1609 | cy: -8.66666667, 1610 | r: 0.42, 1611 | fill: '#d21', 1612 | }, 1613 | children: [], 1614 | }, 1615 | { 1616 | type: 'element', 1617 | tagName: 'circle', 1618 | properties: { 1619 | cx: 16, 1620 | cy: -9.66666667, 1621 | r: 0.42, 1622 | fill: '#d21', 1623 | }, 1624 | children: [], 1625 | }, 1626 | { 1627 | type: 'element', 1628 | tagName: 'circle', 1629 | properties: { 1630 | cx: 17, 1631 | cy: -1.66666667, 1632 | r: 0.42, 1633 | fill: '#d21', 1634 | }, 1635 | children: [], 1636 | }, 1637 | { 1638 | type: 'element', 1639 | tagName: 'circle', 1640 | properties: { 1641 | cx: 17, 1642 | cy: -2.66666667, 1643 | r: 0.42, 1644 | fill: '#d21', 1645 | }, 1646 | children: [], 1647 | }, 1648 | { 1649 | type: 'element', 1650 | tagName: 'circle', 1651 | properties: { 1652 | cx: 17, 1653 | cy: -3.66666667, 1654 | r: 0.42, 1655 | fill: '#d21', 1656 | }, 1657 | children: [], 1658 | }, 1659 | { 1660 | type: 'element', 1661 | tagName: 'circle', 1662 | properties: { 1663 | cx: 17, 1664 | cy: -4.66666667, 1665 | r: 0.42, 1666 | fill: '#d21', 1667 | }, 1668 | children: [], 1669 | }, 1670 | { 1671 | type: 'element', 1672 | tagName: 'circle', 1673 | properties: { 1674 | cx: 17, 1675 | cy: -5.66666667, 1676 | r: 0.42, 1677 | fill: '#d21', 1678 | }, 1679 | children: [], 1680 | }, 1681 | { 1682 | type: 'element', 1683 | tagName: 'circle', 1684 | properties: { 1685 | cx: 17, 1686 | cy: -6.66666667, 1687 | r: 0.42, 1688 | fill: '#d21', 1689 | }, 1690 | children: [], 1691 | }, 1692 | { 1693 | type: 'element', 1694 | tagName: 'circle', 1695 | properties: { 1696 | cx: 17, 1697 | cy: -7.66666667, 1698 | r: 0.42, 1699 | fill: '#d21', 1700 | }, 1701 | children: [], 1702 | }, 1703 | { 1704 | type: 'element', 1705 | tagName: 'circle', 1706 | properties: { 1707 | cx: 17, 1708 | cy: -8.66666667, 1709 | r: 0.42, 1710 | fill: '#d21', 1711 | }, 1712 | children: [], 1713 | }, 1714 | { 1715 | type: 'element', 1716 | tagName: 'circle', 1717 | properties: { 1718 | cx: 17, 1719 | cy: -9.66666667, 1720 | r: 0.42, 1721 | fill: '#d21', 1722 | }, 1723 | children: [], 1724 | }, 1725 | { 1726 | type: 'element', 1727 | tagName: 'circle', 1728 | properties: { 1729 | cx: 18, 1730 | cy: -1.66666667, 1731 | r: 0.42, 1732 | fill: '#d21', 1733 | }, 1734 | children: [], 1735 | }, 1736 | { 1737 | type: 'element', 1738 | tagName: 'circle', 1739 | properties: { 1740 | cx: 18, 1741 | cy: -2.66666667, 1742 | r: 0.42, 1743 | fill: '#d21', 1744 | }, 1745 | children: [], 1746 | }, 1747 | { 1748 | type: 'element', 1749 | tagName: 'circle', 1750 | properties: { 1751 | cx: 18, 1752 | cy: -3.66666667, 1753 | r: 0.42, 1754 | fill: '#d21', 1755 | }, 1756 | children: [], 1757 | }, 1758 | { 1759 | type: 'element', 1760 | tagName: 'circle', 1761 | properties: { 1762 | cx: 18, 1763 | cy: -4.66666667, 1764 | r: 0.42, 1765 | fill: '#d21', 1766 | }, 1767 | children: [], 1768 | }, 1769 | { 1770 | type: 'element', 1771 | tagName: 'circle', 1772 | properties: { 1773 | cx: 18, 1774 | cy: -5.66666667, 1775 | r: 0.42, 1776 | fill: '#d21', 1777 | }, 1778 | children: [], 1779 | }, 1780 | { 1781 | type: 'element', 1782 | tagName: 'circle', 1783 | properties: { 1784 | cx: 18, 1785 | cy: -6.66666667, 1786 | r: 0.42, 1787 | fill: '#d21', 1788 | }, 1789 | children: [], 1790 | }, 1791 | { 1792 | type: 'element', 1793 | tagName: 'circle', 1794 | properties: { 1795 | cx: 18, 1796 | cy: -7.66666667, 1797 | r: 0.42, 1798 | fill: '#d21', 1799 | }, 1800 | children: [], 1801 | }, 1802 | { 1803 | type: 'element', 1804 | tagName: 'circle', 1805 | properties: { 1806 | cx: 18, 1807 | cy: -8.66666667, 1808 | r: 0.42, 1809 | fill: '#d21', 1810 | }, 1811 | children: [], 1812 | }, 1813 | { 1814 | type: 'element', 1815 | tagName: 'circle', 1816 | properties: { 1817 | cx: 18, 1818 | cy: -9.66666667, 1819 | r: 0.42, 1820 | fill: '#d21', 1821 | }, 1822 | children: [], 1823 | }, 1824 | { 1825 | type: 'element', 1826 | tagName: 'circle', 1827 | properties: { 1828 | cx: 19, 1829 | cy: -1.66666667, 1830 | r: 0.42, 1831 | fill: '#d21', 1832 | }, 1833 | children: [], 1834 | }, 1835 | { 1836 | type: 'element', 1837 | tagName: 'circle', 1838 | properties: { 1839 | cx: 19, 1840 | cy: -2.66666667, 1841 | r: 0.42, 1842 | fill: '#d21', 1843 | }, 1844 | children: [], 1845 | }, 1846 | { 1847 | type: 'element', 1848 | tagName: 'circle', 1849 | properties: { 1850 | cx: 19, 1851 | cy: -3.66666667, 1852 | r: 0.42, 1853 | fill: '#d21', 1854 | }, 1855 | children: [], 1856 | }, 1857 | { 1858 | type: 'element', 1859 | tagName: 'circle', 1860 | properties: { 1861 | cx: 19, 1862 | cy: -4.66666667, 1863 | r: 0.42, 1864 | fill: '#d21', 1865 | }, 1866 | children: [], 1867 | }, 1868 | { 1869 | type: 'element', 1870 | tagName: 'circle', 1871 | properties: { 1872 | cx: 19, 1873 | cy: -5.66666667, 1874 | r: 0.42, 1875 | fill: '#d21', 1876 | }, 1877 | children: [], 1878 | }, 1879 | { 1880 | type: 'element', 1881 | tagName: 'circle', 1882 | properties: { 1883 | cx: 19, 1884 | cy: -6.66666667, 1885 | r: 0.42, 1886 | fill: '#d21', 1887 | }, 1888 | children: [], 1889 | }, 1890 | { 1891 | type: 'element', 1892 | tagName: 'circle', 1893 | properties: { 1894 | cx: 19, 1895 | cy: -7.66666667, 1896 | r: 0.42, 1897 | fill: '#d21', 1898 | }, 1899 | children: [], 1900 | }, 1901 | { 1902 | type: 'element', 1903 | tagName: 'circle', 1904 | properties: { 1905 | cx: 19, 1906 | cy: -8.66666667, 1907 | r: 0.42, 1908 | fill: '#d21', 1909 | }, 1910 | children: [], 1911 | }, 1912 | { 1913 | type: 'element', 1914 | tagName: 'circle', 1915 | properties: { 1916 | cx: 19, 1917 | cy: -9.66666667, 1918 | r: 0.42, 1919 | fill: '#d21', 1920 | }, 1921 | children: [], 1922 | }, 1923 | { 1924 | type: 'element', 1925 | tagName: 'circle', 1926 | properties: { 1927 | cx: 20, 1928 | cy: -1.66666667, 1929 | r: 0.42, 1930 | fill: '#d21', 1931 | }, 1932 | children: [], 1933 | }, 1934 | { 1935 | type: 'element', 1936 | tagName: 'circle', 1937 | properties: { 1938 | cx: 20, 1939 | cy: -2.66666667, 1940 | r: 0.42, 1941 | fill: '#d21', 1942 | }, 1943 | children: [], 1944 | }, 1945 | { 1946 | type: 'element', 1947 | tagName: 'circle', 1948 | properties: { 1949 | cx: 20, 1950 | cy: -3.66666667, 1951 | r: 0.42, 1952 | fill: '#d21', 1953 | }, 1954 | children: [], 1955 | }, 1956 | { 1957 | type: 'element', 1958 | tagName: 'circle', 1959 | properties: { 1960 | cx: 20, 1961 | cy: -4.66666667, 1962 | r: 0.42, 1963 | fill: '#d21', 1964 | }, 1965 | children: [], 1966 | }, 1967 | { 1968 | type: 'element', 1969 | tagName: 'circle', 1970 | properties: { 1971 | cx: 20, 1972 | cy: -5.66666667, 1973 | r: 0.42, 1974 | fill: '#d21', 1975 | }, 1976 | children: [], 1977 | }, 1978 | { 1979 | type: 'element', 1980 | tagName: 'circle', 1981 | properties: { 1982 | cx: 20, 1983 | cy: -6.66666667, 1984 | r: 0.42, 1985 | fill: '#d21', 1986 | }, 1987 | children: [], 1988 | }, 1989 | { 1990 | type: 'element', 1991 | tagName: 'circle', 1992 | properties: { 1993 | cx: 20, 1994 | cy: -7.66666667, 1995 | r: 0.42, 1996 | fill: '#d21', 1997 | }, 1998 | children: [], 1999 | }, 2000 | { 2001 | type: 'element', 2002 | tagName: 'circle', 2003 | properties: { 2004 | cx: 20, 2005 | cy: -8.66666667, 2006 | r: 0.42, 2007 | fill: '#d21', 2008 | }, 2009 | children: [], 2010 | }, 2011 | { 2012 | type: 'element', 2013 | tagName: 'circle', 2014 | properties: { 2015 | cx: 20, 2016 | cy: -9.66666667, 2017 | r: 0.42, 2018 | fill: '#d21', 2019 | }, 2020 | children: [], 2021 | }, 2022 | { 2023 | type: 'element', 2024 | tagName: 'circle', 2025 | properties: { 2026 | cx: 21, 2027 | cy: -1.66666667, 2028 | r: 0.42, 2029 | fill: '#d21', 2030 | }, 2031 | children: [], 2032 | }, 2033 | { 2034 | type: 'element', 2035 | tagName: 'circle', 2036 | properties: { 2037 | cx: 21, 2038 | cy: -2.66666667, 2039 | r: 0.42, 2040 | fill: '#d21', 2041 | }, 2042 | children: [], 2043 | }, 2044 | { 2045 | type: 'element', 2046 | tagName: 'circle', 2047 | properties: { 2048 | cx: 21, 2049 | cy: -3.66666667, 2050 | r: 0.42, 2051 | fill: '#d21', 2052 | }, 2053 | children: [], 2054 | }, 2055 | { 2056 | type: 'element', 2057 | tagName: 'circle', 2058 | properties: { 2059 | cx: 21, 2060 | cy: -4.66666667, 2061 | r: 0.42, 2062 | fill: '#d21', 2063 | }, 2064 | children: [], 2065 | }, 2066 | { 2067 | type: 'element', 2068 | tagName: 'circle', 2069 | properties: { 2070 | cx: 21, 2071 | cy: -5.66666667, 2072 | r: 0.42, 2073 | fill: '#d21', 2074 | }, 2075 | children: [], 2076 | }, 2077 | { 2078 | type: 'element', 2079 | tagName: 'circle', 2080 | properties: { 2081 | cx: 21, 2082 | cy: -6.66666667, 2083 | r: 0.42, 2084 | fill: '#d21', 2085 | }, 2086 | children: [], 2087 | }, 2088 | { 2089 | type: 'element', 2090 | tagName: 'circle', 2091 | properties: { 2092 | cx: 21, 2093 | cy: -7.66666667, 2094 | r: 0.42, 2095 | fill: '#d21', 2096 | }, 2097 | children: [], 2098 | }, 2099 | { 2100 | type: 'element', 2101 | tagName: 'circle', 2102 | properties: { 2103 | cx: 21, 2104 | cy: -8.66666667, 2105 | r: 0.42, 2106 | fill: '#d21', 2107 | }, 2108 | children: [], 2109 | }, 2110 | { 2111 | type: 'element', 2112 | tagName: 'circle', 2113 | properties: { 2114 | cx: 21, 2115 | cy: -9.66666667, 2116 | r: 0.42, 2117 | fill: '#d21', 2118 | }, 2119 | children: [], 2120 | }, 2121 | { 2122 | type: 'element', 2123 | tagName: 'circle', 2124 | properties: { 2125 | cx: 22, 2126 | cy: -1.66666667, 2127 | r: 0.42, 2128 | fill: '#d21', 2129 | }, 2130 | children: [], 2131 | }, 2132 | { 2133 | type: 'element', 2134 | tagName: 'circle', 2135 | properties: { 2136 | cx: 22, 2137 | cy: -2.66666667, 2138 | r: 0.42, 2139 | fill: '#d21', 2140 | }, 2141 | children: [], 2142 | }, 2143 | { 2144 | type: 'element', 2145 | tagName: 'circle', 2146 | properties: { 2147 | cx: 22, 2148 | cy: -3.66666667, 2149 | r: 0.42, 2150 | fill: '#d21', 2151 | }, 2152 | children: [], 2153 | }, 2154 | { 2155 | type: 'element', 2156 | tagName: 'circle', 2157 | properties: { 2158 | cx: 22, 2159 | cy: -4.66666667, 2160 | r: 0.42, 2161 | fill: '#d21', 2162 | }, 2163 | children: [], 2164 | }, 2165 | { 2166 | type: 'element', 2167 | tagName: 'circle', 2168 | properties: { 2169 | cx: 22, 2170 | cy: -5.66666667, 2171 | r: 0.42, 2172 | fill: '#d21', 2173 | }, 2174 | children: [], 2175 | }, 2176 | { 2177 | type: 'element', 2178 | tagName: 'circle', 2179 | properties: { 2180 | cx: 22, 2181 | cy: -6.66666667, 2182 | r: 0.42, 2183 | fill: '#d21', 2184 | }, 2185 | children: [], 2186 | }, 2187 | { 2188 | type: 'element', 2189 | tagName: 'circle', 2190 | properties: { 2191 | cx: 22, 2192 | cy: -7.66666667, 2193 | r: 0.42, 2194 | fill: '#d21', 2195 | }, 2196 | children: [], 2197 | }, 2198 | { 2199 | type: 'element', 2200 | tagName: 'circle', 2201 | properties: { 2202 | cx: 22, 2203 | cy: -8.66666667, 2204 | r: 0.42, 2205 | fill: '#d21', 2206 | }, 2207 | children: [], 2208 | }, 2209 | { 2210 | type: 'element', 2211 | tagName: 'circle', 2212 | properties: { 2213 | cx: 22, 2214 | cy: -9.66666667, 2215 | r: 0.42, 2216 | fill: '#d21', 2217 | }, 2218 | children: [], 2219 | }, 2220 | { 2221 | type: 'element', 2222 | tagName: 'circle', 2223 | properties: { 2224 | cx: 23, 2225 | cy: -1.66666667, 2226 | r: 0.42, 2227 | fill: '#d21', 2228 | }, 2229 | children: [], 2230 | }, 2231 | { 2232 | type: 'element', 2233 | tagName: 'circle', 2234 | properties: { 2235 | cx: 23, 2236 | cy: -2.66666667, 2237 | r: 0.42, 2238 | fill: '#d21', 2239 | }, 2240 | children: [], 2241 | }, 2242 | { 2243 | type: 'element', 2244 | tagName: 'circle', 2245 | properties: { 2246 | cx: 23, 2247 | cy: -3.66666667, 2248 | r: 0.42, 2249 | fill: '#ff0', 2250 | }, 2251 | children: [], 2252 | }, 2253 | { 2254 | type: 'element', 2255 | tagName: 'circle', 2256 | properties: { 2257 | cx: 23, 2258 | cy: -4.66666667, 2259 | r: 0.42, 2260 | fill: '#ff0', 2261 | }, 2262 | children: [], 2263 | }, 2264 | { 2265 | type: 'element', 2266 | tagName: 'circle', 2267 | properties: { 2268 | cx: 23, 2269 | cy: -5.66666667, 2270 | r: 0.42, 2271 | fill: '#ff0', 2272 | }, 2273 | children: [], 2274 | }, 2275 | { 2276 | type: 'element', 2277 | tagName: 'circle', 2278 | properties: { 2279 | cx: 23, 2280 | cy: -6.66666667, 2281 | r: 0.42, 2282 | fill: '#ff0', 2283 | }, 2284 | children: [], 2285 | }, 2286 | { 2287 | type: 'element', 2288 | tagName: 'circle', 2289 | properties: { 2290 | cx: 23, 2291 | cy: -7.66666667, 2292 | r: 0.42, 2293 | fill: '#ff0', 2294 | }, 2295 | children: [], 2296 | }, 2297 | { 2298 | type: 'element', 2299 | tagName: 'circle', 2300 | properties: { 2301 | cx: 23, 2302 | cy: -8.66666667, 2303 | r: 0.42, 2304 | fill: '#ff0', 2305 | }, 2306 | children: [], 2307 | }, 2308 | { 2309 | type: 'element', 2310 | tagName: 'circle', 2311 | properties: { 2312 | cx: 23, 2313 | cy: -9.66666667, 2314 | r: 0.42, 2315 | fill: '#ff0', 2316 | }, 2317 | children: [], 2318 | }, 2319 | { 2320 | type: 'element', 2321 | tagName: 'circle', 2322 | properties: { 2323 | cx: 24, 2324 | cy: -1.66666667, 2325 | r: 0.42, 2326 | fill: '#ff0', 2327 | }, 2328 | children: [], 2329 | }, 2330 | { 2331 | type: 'element', 2332 | tagName: 'circle', 2333 | properties: { 2334 | cx: 24, 2335 | cy: -2.66666667, 2336 | r: 0.42, 2337 | fill: '#ff0', 2338 | }, 2339 | children: [], 2340 | }, 2341 | { 2342 | type: 'element', 2343 | tagName: 'circle', 2344 | properties: { 2345 | cx: 24, 2346 | cy: -3.66666667, 2347 | r: 0.42, 2348 | fill: '#ff0', 2349 | }, 2350 | children: [], 2351 | }, 2352 | { 2353 | type: 'element', 2354 | tagName: 'circle', 2355 | properties: { 2356 | cx: 24, 2357 | cy: -4.66666667, 2358 | r: 0.42, 2359 | fill: '#ff0', 2360 | }, 2361 | children: [], 2362 | }, 2363 | { 2364 | type: 'element', 2365 | tagName: 'circle', 2366 | properties: { 2367 | cx: 24, 2368 | cy: -5.66666667, 2369 | r: 0.42, 2370 | fill: '#ff0', 2371 | }, 2372 | children: [], 2373 | }, 2374 | { 2375 | type: 'element', 2376 | tagName: 'circle', 2377 | properties: { 2378 | cx: 24, 2379 | cy: -6.66666667, 2380 | r: 0.42, 2381 | fill: '#ff0', 2382 | }, 2383 | children: [], 2384 | }, 2385 | { 2386 | type: 'element', 2387 | tagName: 'circle', 2388 | properties: { 2389 | cx: 24, 2390 | cy: -7.66666667, 2391 | r: 0.42, 2392 | fill: '#ff0', 2393 | }, 2394 | children: [], 2395 | }, 2396 | { 2397 | type: 'element', 2398 | tagName: 'circle', 2399 | properties: { 2400 | cx: 24, 2401 | cy: -8.66666667, 2402 | r: 0.42, 2403 | fill: '#ff0', 2404 | }, 2405 | children: [], 2406 | }, 2407 | { 2408 | type: 'element', 2409 | tagName: 'circle', 2410 | properties: { 2411 | cx: 24, 2412 | cy: -9.66666667, 2413 | r: 0.42, 2414 | fill: '#ff0', 2415 | }, 2416 | children: [], 2417 | }, 2418 | { 2419 | type: 'element', 2420 | tagName: 'circle', 2421 | properties: { 2422 | cx: 25, 2423 | cy: -1.66666667, 2424 | r: 0.42, 2425 | fill: '#ff0', 2426 | }, 2427 | children: [], 2428 | }, 2429 | { 2430 | type: 'element', 2431 | tagName: 'circle', 2432 | properties: { 2433 | cx: 25, 2434 | cy: -2.66666667, 2435 | r: 0.42, 2436 | fill: '#ff0', 2437 | }, 2438 | children: [], 2439 | }, 2440 | { 2441 | type: 'element', 2442 | tagName: 'circle', 2443 | properties: { 2444 | cx: 25, 2445 | cy: -3.66666667, 2446 | r: 0.42, 2447 | fill: '#ff0', 2448 | }, 2449 | children: [], 2450 | }, 2451 | { 2452 | type: 'element', 2453 | tagName: 'circle', 2454 | properties: { 2455 | cx: 25, 2456 | cy: -4.66666667, 2457 | r: 0.42, 2458 | fill: '#ff0', 2459 | }, 2460 | children: [], 2461 | }, 2462 | { 2463 | type: 'element', 2464 | tagName: 'circle', 2465 | properties: { 2466 | cx: 25, 2467 | cy: -5.66666667, 2468 | r: 0.42, 2469 | fill: '#ff0', 2470 | }, 2471 | children: [], 2472 | }, 2473 | { 2474 | type: 'element', 2475 | tagName: 'circle', 2476 | properties: { 2477 | cx: 25, 2478 | cy: -6.66666667, 2479 | r: 0.42, 2480 | fill: '#ff0', 2481 | }, 2482 | children: [], 2483 | }, 2484 | { 2485 | type: 'element', 2486 | tagName: 'circle', 2487 | properties: { 2488 | cx: 25, 2489 | cy: -7.66666667, 2490 | r: 0.42, 2491 | fill: '#ff0', 2492 | }, 2493 | children: [], 2494 | }, 2495 | { 2496 | type: 'element', 2497 | tagName: 'circle', 2498 | properties: { 2499 | cx: 25, 2500 | cy: -8.66666667, 2501 | r: 0.42, 2502 | fill: '#ff0', 2503 | }, 2504 | children: [], 2505 | }, 2506 | { 2507 | type: 'element', 2508 | tagName: 'circle', 2509 | properties: { 2510 | cx: 25, 2511 | cy: -9.66666667, 2512 | r: 0.42, 2513 | fill: '#ff0', 2514 | }, 2515 | children: [], 2516 | }, 2517 | { 2518 | type: 'element', 2519 | tagName: 'circle', 2520 | properties: { 2521 | cx: 26, 2522 | cy: -1.66666667, 2523 | r: 0.42, 2524 | fill: '#ff0', 2525 | }, 2526 | children: [], 2527 | }, 2528 | { 2529 | type: 'element', 2530 | tagName: 'circle', 2531 | properties: { 2532 | cx: 26, 2533 | cy: -2.66666667, 2534 | r: 0.42, 2535 | fill: '#ff0', 2536 | }, 2537 | children: [], 2538 | }, 2539 | { 2540 | type: 'element', 2541 | tagName: 'circle', 2542 | properties: { 2543 | cx: 26, 2544 | cy: -3.66666667, 2545 | r: 0.42, 2546 | fill: '#ff0', 2547 | }, 2548 | children: [], 2549 | }, 2550 | { 2551 | type: 'element', 2552 | tagName: 'circle', 2553 | properties: { 2554 | cx: 26, 2555 | cy: -4.66666667, 2556 | r: 0.42, 2557 | fill: '#ff0', 2558 | }, 2559 | children: [], 2560 | }, 2561 | { 2562 | type: 'element', 2563 | tagName: 'circle', 2564 | properties: { 2565 | cx: 26, 2566 | cy: -5.66666667, 2567 | r: 0.42, 2568 | fill: '#ff0', 2569 | }, 2570 | children: [], 2571 | }, 2572 | { 2573 | type: 'element', 2574 | tagName: 'circle', 2575 | properties: { 2576 | cx: 1, 2577 | cy: 1.66666667, 2578 | r: 0.42, 2579 | fill: '#08d', 2580 | }, 2581 | children: [], 2582 | }, 2583 | { 2584 | type: 'element', 2585 | tagName: 'circle', 2586 | properties: { 2587 | cx: 1, 2588 | cy: 2.66666667, 2589 | r: 0.42, 2590 | fill: '#08d', 2591 | }, 2592 | children: [], 2593 | }, 2594 | { 2595 | type: 'element', 2596 | tagName: 'circle', 2597 | properties: { 2598 | cx: 1, 2599 | cy: 3.66666667, 2600 | r: 0.42, 2601 | fill: '#08d', 2602 | }, 2603 | children: [], 2604 | }, 2605 | { 2606 | type: 'element', 2607 | tagName: 'circle', 2608 | properties: { 2609 | cx: 1, 2610 | cy: 4.66666667, 2611 | r: 0.42, 2612 | fill: '#08d', 2613 | }, 2614 | children: [], 2615 | }, 2616 | { 2617 | type: 'element', 2618 | tagName: 'circle', 2619 | properties: { 2620 | cx: 1, 2621 | cy: 5.66666667, 2622 | r: 0.42, 2623 | fill: '#08d', 2624 | }, 2625 | children: [], 2626 | }, 2627 | { 2628 | type: 'element', 2629 | tagName: 'circle', 2630 | properties: { 2631 | cx: 1, 2632 | cy: 6.66666667, 2633 | r: 0.42, 2634 | fill: '#08d', 2635 | }, 2636 | children: [], 2637 | }, 2638 | { 2639 | type: 'element', 2640 | tagName: 'circle', 2641 | properties: { 2642 | cx: 1, 2643 | cy: 7.66666667, 2644 | r: 0.42, 2645 | fill: '#08d', 2646 | }, 2647 | children: [], 2648 | }, 2649 | { 2650 | type: 'element', 2651 | tagName: 'circle', 2652 | properties: { 2653 | cx: 1, 2654 | cy: 8.66666667, 2655 | r: 0.42, 2656 | fill: '#08d', 2657 | }, 2658 | children: [], 2659 | }, 2660 | { 2661 | type: 'element', 2662 | tagName: 'circle', 2663 | properties: { 2664 | cx: 1, 2665 | cy: 9.66666667, 2666 | r: 0.42, 2667 | fill: '#08d', 2668 | }, 2669 | children: [], 2670 | }, 2671 | { 2672 | type: 'element', 2673 | tagName: 'circle', 2674 | properties: { 2675 | cx: 2, 2676 | cy: 1.66666667, 2677 | r: 0.42, 2678 | fill: '#08d', 2679 | }, 2680 | children: [], 2681 | }, 2682 | { 2683 | type: 'element', 2684 | tagName: 'circle', 2685 | properties: { 2686 | cx: 2, 2687 | cy: 2.66666667, 2688 | r: 0.42, 2689 | fill: '#08d', 2690 | }, 2691 | children: [], 2692 | }, 2693 | { 2694 | type: 'element', 2695 | tagName: 'circle', 2696 | properties: { 2697 | cx: 2, 2698 | cy: 3.66666667, 2699 | r: 0.42, 2700 | fill: '#08d', 2701 | }, 2702 | children: [], 2703 | }, 2704 | { 2705 | type: 'element', 2706 | tagName: 'circle', 2707 | properties: { 2708 | cx: 2, 2709 | cy: 4.66666667, 2710 | r: 0.42, 2711 | fill: '#08d', 2712 | }, 2713 | children: [], 2714 | }, 2715 | { 2716 | type: 'element', 2717 | tagName: 'circle', 2718 | properties: { 2719 | cx: 2, 2720 | cy: 5.66666667, 2721 | r: 0.42, 2722 | fill: '#08d', 2723 | }, 2724 | children: [], 2725 | }, 2726 | { 2727 | type: 'element', 2728 | tagName: 'circle', 2729 | properties: { 2730 | cx: 2, 2731 | cy: 6.66666667, 2732 | r: 0.42, 2733 | fill: '#08d', 2734 | }, 2735 | children: [], 2736 | }, 2737 | { 2738 | type: 'element', 2739 | tagName: 'circle', 2740 | properties: { 2741 | cx: 2, 2742 | cy: 7.66666667, 2743 | r: 0.42, 2744 | fill: '#08d', 2745 | }, 2746 | children: [], 2747 | }, 2748 | { 2749 | type: 'element', 2750 | tagName: 'circle', 2751 | properties: { 2752 | cx: 2, 2753 | cy: 8.66666667, 2754 | r: 0.42, 2755 | fill: '#08d', 2756 | }, 2757 | children: [], 2758 | }, 2759 | { 2760 | type: 'element', 2761 | tagName: 'circle', 2762 | properties: { 2763 | cx: 2, 2764 | cy: 9.66666667, 2765 | r: 0.42, 2766 | fill: '#08d', 2767 | }, 2768 | children: [], 2769 | }, 2770 | { 2771 | type: 'element', 2772 | tagName: 'circle', 2773 | properties: { 2774 | cx: 3, 2775 | cy: 1.66666667, 2776 | r: 0.42, 2777 | fill: '#08d', 2778 | }, 2779 | children: [], 2780 | }, 2781 | { 2782 | type: 'element', 2783 | tagName: 'circle', 2784 | properties: { 2785 | cx: 3, 2786 | cy: 2.66666667, 2787 | r: 0.42, 2788 | fill: '#08d', 2789 | }, 2790 | children: [], 2791 | }, 2792 | { 2793 | type: 'element', 2794 | tagName: 'circle', 2795 | properties: { 2796 | cx: 3, 2797 | cy: 3.66666667, 2798 | r: 0.42, 2799 | fill: '#08d', 2800 | }, 2801 | children: [], 2802 | }, 2803 | { 2804 | type: 'element', 2805 | tagName: 'circle', 2806 | properties: { 2807 | cx: 3, 2808 | cy: 4.66666667, 2809 | r: 0.42, 2810 | fill: '#08d', 2811 | }, 2812 | children: [], 2813 | }, 2814 | { 2815 | type: 'element', 2816 | tagName: 'circle', 2817 | properties: { 2818 | cx: 3, 2819 | cy: 5.66666667, 2820 | r: 0.42, 2821 | fill: '#08d', 2822 | }, 2823 | children: [], 2824 | }, 2825 | { 2826 | type: 'element', 2827 | tagName: 'circle', 2828 | properties: { 2829 | cx: 3, 2830 | cy: 6.66666667, 2831 | r: 0.42, 2832 | fill: '#08d', 2833 | }, 2834 | children: [], 2835 | }, 2836 | { 2837 | type: 'element', 2838 | tagName: 'circle', 2839 | properties: { 2840 | cx: 3, 2841 | cy: 7.66666667, 2842 | r: 0.42, 2843 | fill: '#08d', 2844 | }, 2845 | children: [], 2846 | }, 2847 | { 2848 | type: 'element', 2849 | tagName: 'circle', 2850 | properties: { 2851 | cx: 3, 2852 | cy: 8.66666667, 2853 | r: 0.42, 2854 | fill: '#08d', 2855 | }, 2856 | children: [], 2857 | }, 2858 | { 2859 | type: 'element', 2860 | tagName: 'circle', 2861 | properties: { 2862 | cx: 3, 2863 | cy: 9.66666667, 2864 | r: 0.42, 2865 | fill: '#08d', 2866 | }, 2867 | children: [], 2868 | }, 2869 | { 2870 | type: 'element', 2871 | tagName: 'circle', 2872 | properties: { 2873 | cx: 4, 2874 | cy: 1.66666667, 2875 | r: 0.42, 2876 | fill: '#08d', 2877 | }, 2878 | children: [], 2879 | }, 2880 | { 2881 | type: 'element', 2882 | tagName: 'circle', 2883 | properties: { 2884 | cx: 4, 2885 | cy: 2.66666667, 2886 | r: 0.42, 2887 | fill: '#08d', 2888 | }, 2889 | children: [], 2890 | }, 2891 | { 2892 | type: 'element', 2893 | tagName: 'circle', 2894 | properties: { 2895 | cx: 4, 2896 | cy: 3.66666667, 2897 | r: 0.42, 2898 | fill: '#08d', 2899 | }, 2900 | children: [], 2901 | }, 2902 | { 2903 | type: 'element', 2904 | tagName: 'circle', 2905 | properties: { 2906 | cx: 4, 2907 | cy: 4.66666667, 2908 | r: 0.42, 2909 | fill: '#08d', 2910 | }, 2911 | children: [], 2912 | }, 2913 | { 2914 | type: 'element', 2915 | tagName: 'circle', 2916 | properties: { 2917 | cx: 4, 2918 | cy: 5.66666667, 2919 | r: 0.42, 2920 | fill: '#08d', 2921 | }, 2922 | children: [], 2923 | }, 2924 | { 2925 | type: 'element', 2926 | tagName: 'circle', 2927 | properties: { 2928 | cx: 4, 2929 | cy: 6.66666667, 2930 | r: 0.42, 2931 | fill: '#08d', 2932 | }, 2933 | children: [], 2934 | }, 2935 | { 2936 | type: 'element', 2937 | tagName: 'circle', 2938 | properties: { 2939 | cx: 4, 2940 | cy: 7.66666667, 2941 | r: 0.42, 2942 | fill: '#08d', 2943 | }, 2944 | children: [], 2945 | }, 2946 | { 2947 | type: 'element', 2948 | tagName: 'circle', 2949 | properties: { 2950 | cx: 4, 2951 | cy: 8.66666667, 2952 | r: 0.42, 2953 | fill: '#08d', 2954 | }, 2955 | children: [], 2956 | }, 2957 | { 2958 | type: 'element', 2959 | tagName: 'circle', 2960 | properties: { 2961 | cx: 4, 2962 | cy: 9.66666667, 2963 | r: 0.42, 2964 | fill: '#08d', 2965 | }, 2966 | children: [], 2967 | }, 2968 | { 2969 | type: 'element', 2970 | tagName: 'circle', 2971 | properties: { 2972 | cx: 5, 2973 | cy: 1.66666667, 2974 | r: 0.42, 2975 | fill: '#08d', 2976 | }, 2977 | children: [], 2978 | }, 2979 | { 2980 | type: 'element', 2981 | tagName: 'circle', 2982 | properties: { 2983 | cx: 5, 2984 | cy: 2.66666667, 2985 | r: 0.42, 2986 | fill: '#08d', 2987 | }, 2988 | children: [], 2989 | }, 2990 | { 2991 | type: 'element', 2992 | tagName: 'circle', 2993 | properties: { 2994 | cx: 5, 2995 | cy: 3.66666667, 2996 | r: 0.42, 2997 | fill: '#08d', 2998 | }, 2999 | children: [], 3000 | }, 3001 | { 3002 | type: 'element', 3003 | tagName: 'circle', 3004 | properties: { 3005 | cx: 5, 3006 | cy: 4.66666667, 3007 | r: 0.42, 3008 | fill: '#08d', 3009 | }, 3010 | children: [], 3011 | }, 3012 | { 3013 | type: 'element', 3014 | tagName: 'circle', 3015 | properties: { 3016 | cx: 5, 3017 | cy: 5.66666667, 3018 | r: 0.42, 3019 | fill: '#08d', 3020 | }, 3021 | children: [], 3022 | }, 3023 | { 3024 | type: 'element', 3025 | tagName: 'circle', 3026 | properties: { 3027 | cx: 5, 3028 | cy: 6.66666667, 3029 | r: 0.42, 3030 | fill: '#08d', 3031 | }, 3032 | children: [], 3033 | }, 3034 | { 3035 | type: 'element', 3036 | tagName: 'circle', 3037 | properties: { 3038 | cx: 5, 3039 | cy: 7.66666667, 3040 | r: 0.42, 3041 | fill: '#08d', 3042 | }, 3043 | children: [], 3044 | }, 3045 | { 3046 | type: 'element', 3047 | tagName: 'circle', 3048 | properties: { 3049 | cx: 5, 3050 | cy: 8.66666667, 3051 | r: 0.42, 3052 | fill: '#08d', 3053 | }, 3054 | children: [], 3055 | }, 3056 | { 3057 | type: 'element', 3058 | tagName: 'circle', 3059 | properties: { 3060 | cx: 5, 3061 | cy: 9.66666667, 3062 | r: 0.42, 3063 | fill: '#08d', 3064 | }, 3065 | children: [], 3066 | }, 3067 | { 3068 | type: 'element', 3069 | tagName: 'circle', 3070 | properties: { 3071 | cx: 6, 3072 | cy: 1.66666667, 3073 | r: 0.42, 3074 | fill: '#08d', 3075 | }, 3076 | children: [], 3077 | }, 3078 | { 3079 | type: 'element', 3080 | tagName: 'circle', 3081 | properties: { 3082 | cx: 6, 3083 | cy: 2.66666667, 3084 | r: 0.42, 3085 | fill: '#08d', 3086 | }, 3087 | children: [], 3088 | }, 3089 | { 3090 | type: 'element', 3091 | tagName: 'circle', 3092 | properties: { 3093 | cx: 6, 3094 | cy: 3.66666667, 3095 | r: 0.42, 3096 | fill: '#08d', 3097 | }, 3098 | children: [], 3099 | }, 3100 | { 3101 | type: 'element', 3102 | tagName: 'circle', 3103 | properties: { 3104 | cx: 6, 3105 | cy: 4.66666667, 3106 | r: 0.42, 3107 | fill: '#08d', 3108 | }, 3109 | children: [], 3110 | }, 3111 | { 3112 | type: 'element', 3113 | tagName: 'circle', 3114 | properties: { 3115 | cx: 6, 3116 | cy: 5.66666667, 3117 | r: 0.42, 3118 | fill: '#08d', 3119 | }, 3120 | children: [], 3121 | }, 3122 | { 3123 | type: 'element', 3124 | tagName: 'circle', 3125 | properties: { 3126 | cx: 6, 3127 | cy: 6.66666667, 3128 | r: 0.42, 3129 | fill: '#08d', 3130 | }, 3131 | children: [], 3132 | }, 3133 | { 3134 | type: 'element', 3135 | tagName: 'circle', 3136 | properties: { 3137 | cx: 6, 3138 | cy: 7.66666667, 3139 | r: 0.42, 3140 | fill: '#08d', 3141 | }, 3142 | children: [], 3143 | }, 3144 | { 3145 | type: 'element', 3146 | tagName: 'circle', 3147 | properties: { 3148 | cx: 6, 3149 | cy: 8.66666667, 3150 | r: 0.42, 3151 | fill: '#08d', 3152 | }, 3153 | children: [], 3154 | }, 3155 | { 3156 | type: 'element', 3157 | tagName: 'circle', 3158 | properties: { 3159 | cx: 6, 3160 | cy: 9.66666667, 3161 | r: 0.42, 3162 | fill: '#08d', 3163 | }, 3164 | children: [], 3165 | }, 3166 | { 3167 | type: 'element', 3168 | tagName: 'circle', 3169 | properties: { 3170 | cx: 7, 3171 | cy: 1.66666667, 3172 | r: 0.42, 3173 | fill: '#08d', 3174 | }, 3175 | children: [], 3176 | }, 3177 | { 3178 | type: 'element', 3179 | tagName: 'circle', 3180 | properties: { 3181 | cx: 7, 3182 | cy: 2.66666667, 3183 | r: 0.42, 3184 | fill: '#08d', 3185 | }, 3186 | children: [], 3187 | }, 3188 | { 3189 | type: 'element', 3190 | tagName: 'circle', 3191 | properties: { 3192 | cx: 7, 3193 | cy: 3.66666667, 3194 | r: 0.42, 3195 | fill: '#08d', 3196 | }, 3197 | children: [], 3198 | }, 3199 | { 3200 | type: 'element', 3201 | tagName: 'circle', 3202 | properties: { 3203 | cx: 7, 3204 | cy: 4.66666667, 3205 | r: 0.42, 3206 | fill: '#08d', 3207 | }, 3208 | children: [], 3209 | }, 3210 | { 3211 | type: 'element', 3212 | tagName: 'circle', 3213 | properties: { 3214 | cx: 7, 3215 | cy: 5.66666667, 3216 | r: 0.42, 3217 | fill: '#08d', 3218 | }, 3219 | children: [], 3220 | }, 3221 | { 3222 | type: 'element', 3223 | tagName: 'circle', 3224 | properties: { 3225 | cx: 7, 3226 | cy: 6.66666667, 3227 | r: 0.42, 3228 | fill: '#08d', 3229 | }, 3230 | children: [], 3231 | }, 3232 | { 3233 | type: 'element', 3234 | tagName: 'circle', 3235 | properties: { 3236 | cx: 7, 3237 | cy: 7.66666667, 3238 | r: 0.42, 3239 | fill: '#08d', 3240 | }, 3241 | children: [], 3242 | }, 3243 | { 3244 | type: 'element', 3245 | tagName: 'circle', 3246 | properties: { 3247 | cx: 7, 3248 | cy: 8.66666667, 3249 | r: 0.42, 3250 | fill: '#08d', 3251 | }, 3252 | children: [], 3253 | }, 3254 | { 3255 | type: 'element', 3256 | tagName: 'circle', 3257 | properties: { 3258 | cx: 7, 3259 | cy: 9.66666667, 3260 | r: 0.42, 3261 | fill: '#08d', 3262 | }, 3263 | children: [], 3264 | }, 3265 | { 3266 | type: 'element', 3267 | tagName: 'circle', 3268 | properties: { 3269 | cx: 8, 3270 | cy: 1.66666667, 3271 | r: 0.42, 3272 | fill: '#08d', 3273 | }, 3274 | children: [], 3275 | }, 3276 | { 3277 | type: 'element', 3278 | tagName: 'circle', 3279 | properties: { 3280 | cx: 8, 3281 | cy: 2.66666667, 3282 | r: 0.42, 3283 | fill: '#08d', 3284 | }, 3285 | children: [], 3286 | }, 3287 | { 3288 | type: 'element', 3289 | tagName: 'circle', 3290 | properties: { 3291 | cx: 8, 3292 | cy: 3.66666667, 3293 | r: 0.42, 3294 | fill: '#08d', 3295 | }, 3296 | children: [], 3297 | }, 3298 | { 3299 | type: 'element', 3300 | tagName: 'circle', 3301 | properties: { 3302 | cx: 8, 3303 | cy: 4.66666667, 3304 | r: 0.42, 3305 | fill: '#08d', 3306 | }, 3307 | children: [], 3308 | }, 3309 | { 3310 | type: 'element', 3311 | tagName: 'circle', 3312 | properties: { 3313 | cx: 8, 3314 | cy: 5.66666667, 3315 | r: 0.42, 3316 | fill: '#08d', 3317 | }, 3318 | children: [], 3319 | }, 3320 | { 3321 | type: 'element', 3322 | tagName: 'circle', 3323 | properties: { 3324 | cx: 8, 3325 | cy: 6.66666667, 3326 | r: 0.42, 3327 | fill: '#08d', 3328 | }, 3329 | children: [], 3330 | }, 3331 | { 3332 | type: 'element', 3333 | tagName: 'circle', 3334 | properties: { 3335 | cx: 8, 3336 | cy: 7.66666667, 3337 | r: 0.42, 3338 | fill: '#08d', 3339 | }, 3340 | children: [], 3341 | }, 3342 | { 3343 | type: 'element', 3344 | tagName: 'circle', 3345 | properties: { 3346 | cx: 8, 3347 | cy: 8.66666667, 3348 | r: 0.42, 3349 | fill: '#08d', 3350 | }, 3351 | children: [], 3352 | }, 3353 | { 3354 | type: 'element', 3355 | tagName: 'circle', 3356 | properties: { 3357 | cx: 8, 3358 | cy: 9.66666667, 3359 | r: 0.42, 3360 | fill: '#08d', 3361 | }, 3362 | children: [], 3363 | }, 3364 | { 3365 | type: 'element', 3366 | tagName: 'circle', 3367 | properties: { 3368 | cx: 9, 3369 | cy: 1.66666667, 3370 | r: 0.42, 3371 | fill: '#08d', 3372 | }, 3373 | children: [], 3374 | }, 3375 | { 3376 | type: 'element', 3377 | tagName: 'circle', 3378 | properties: { 3379 | cx: 9, 3380 | cy: 2.66666667, 3381 | r: 0.42, 3382 | fill: '#08d', 3383 | }, 3384 | children: [], 3385 | }, 3386 | { 3387 | type: 'element', 3388 | tagName: 'circle', 3389 | properties: { 3390 | cx: 9, 3391 | cy: 3.66666667, 3392 | r: 0.42, 3393 | fill: '#08d', 3394 | }, 3395 | children: [], 3396 | }, 3397 | { 3398 | type: 'element', 3399 | tagName: 'circle', 3400 | properties: { 3401 | cx: 9, 3402 | cy: 4.66666667, 3403 | r: 0.42, 3404 | fill: '#08d', 3405 | }, 3406 | children: [], 3407 | }, 3408 | { 3409 | type: 'element', 3410 | tagName: 'circle', 3411 | properties: { 3412 | cx: 9, 3413 | cy: 5.66666667, 3414 | r: 0.42, 3415 | fill: '#08d', 3416 | }, 3417 | children: [], 3418 | }, 3419 | { 3420 | type: 'element', 3421 | tagName: 'circle', 3422 | properties: { 3423 | cx: 9, 3424 | cy: 6.66666667, 3425 | r: 0.42, 3426 | fill: '#08d', 3427 | }, 3428 | children: [], 3429 | }, 3430 | { 3431 | type: 'element', 3432 | tagName: 'circle', 3433 | properties: { 3434 | cx: 9, 3435 | cy: 7.66666667, 3436 | r: 0.42, 3437 | fill: '#08d', 3438 | }, 3439 | children: [], 3440 | }, 3441 | { 3442 | type: 'element', 3443 | tagName: 'circle', 3444 | properties: { 3445 | cx: 9, 3446 | cy: 8.66666667, 3447 | r: 0.42, 3448 | fill: '#08d', 3449 | }, 3450 | children: [], 3451 | }, 3452 | { 3453 | type: 'element', 3454 | tagName: 'circle', 3455 | properties: { 3456 | cx: 9, 3457 | cy: 9.66666667, 3458 | r: 0.42, 3459 | fill: '#08d', 3460 | }, 3461 | children: [], 3462 | }, 3463 | { 3464 | type: 'element', 3465 | tagName: 'circle', 3466 | properties: { 3467 | cx: 10, 3468 | cy: 1.66666667, 3469 | r: 0.42, 3470 | fill: '#08d', 3471 | }, 3472 | children: [], 3473 | }, 3474 | { 3475 | type: 'element', 3476 | tagName: 'circle', 3477 | properties: { 3478 | cx: 10, 3479 | cy: 2.66666667, 3480 | r: 0.42, 3481 | fill: '#08d', 3482 | }, 3483 | children: [], 3484 | }, 3485 | { 3486 | type: 'element', 3487 | tagName: 'circle', 3488 | properties: { 3489 | cx: 10, 3490 | cy: 3.66666667, 3491 | r: 0.42, 3492 | fill: '#08d', 3493 | }, 3494 | children: [], 3495 | }, 3496 | { 3497 | type: 'element', 3498 | tagName: 'circle', 3499 | properties: { 3500 | cx: 10, 3501 | cy: 4.66666667, 3502 | r: 0.42, 3503 | fill: '#08d', 3504 | }, 3505 | children: [], 3506 | }, 3507 | { 3508 | type: 'element', 3509 | tagName: 'circle', 3510 | properties: { 3511 | cx: 10, 3512 | cy: 5.66666667, 3513 | r: 0.42, 3514 | fill: '#08d', 3515 | }, 3516 | children: [], 3517 | }, 3518 | { 3519 | type: 'element', 3520 | tagName: 'circle', 3521 | properties: { 3522 | cx: 10, 3523 | cy: 6.66666667, 3524 | r: 0.42, 3525 | fill: '#08d', 3526 | }, 3527 | children: [], 3528 | }, 3529 | { 3530 | type: 'element', 3531 | tagName: 'circle', 3532 | properties: { 3533 | cx: 10, 3534 | cy: 7.66666667, 3535 | r: 0.42, 3536 | fill: '#08d', 3537 | }, 3538 | children: [], 3539 | }, 3540 | { 3541 | type: 'element', 3542 | tagName: 'circle', 3543 | properties: { 3544 | cx: 10, 3545 | cy: 8.66666667, 3546 | r: 0.42, 3547 | fill: '#08d', 3548 | }, 3549 | children: [], 3550 | }, 3551 | { 3552 | type: 'element', 3553 | tagName: 'circle', 3554 | properties: { 3555 | cx: 10, 3556 | cy: 9.66666667, 3557 | r: 0.42, 3558 | fill: '#08d', 3559 | }, 3560 | children: [], 3561 | }, 3562 | { 3563 | type: 'element', 3564 | tagName: 'circle', 3565 | properties: { 3566 | cx: 11, 3567 | cy: 1.66666667, 3568 | r: 0.42, 3569 | fill: '#08d', 3570 | }, 3571 | children: [], 3572 | }, 3573 | { 3574 | type: 'element', 3575 | tagName: 'circle', 3576 | properties: { 3577 | cx: 11, 3578 | cy: 2.66666667, 3579 | r: 0.42, 3580 | fill: '#08d', 3581 | }, 3582 | children: [], 3583 | }, 3584 | { 3585 | type: 'element', 3586 | tagName: 'circle', 3587 | properties: { 3588 | cx: 11, 3589 | cy: 3.66666667, 3590 | r: 0.42, 3591 | fill: '#08d', 3592 | }, 3593 | children: [], 3594 | }, 3595 | { 3596 | type: 'element', 3597 | tagName: 'circle', 3598 | properties: { 3599 | cx: 11, 3600 | cy: 4.66666667, 3601 | r: 0.42, 3602 | fill: '#08d', 3603 | }, 3604 | children: [], 3605 | }, 3606 | { 3607 | type: 'element', 3608 | tagName: 'circle', 3609 | properties: { 3610 | cx: 11, 3611 | cy: 5.66666667, 3612 | r: 0.42, 3613 | fill: '#08d', 3614 | }, 3615 | children: [], 3616 | }, 3617 | { 3618 | type: 'element', 3619 | tagName: 'circle', 3620 | properties: { 3621 | cx: 11, 3622 | cy: 6.66666667, 3623 | r: 0.42, 3624 | fill: '#08d', 3625 | }, 3626 | children: [], 3627 | }, 3628 | { 3629 | type: 'element', 3630 | tagName: 'circle', 3631 | properties: { 3632 | cx: 11, 3633 | cy: 7.66666667, 3634 | r: 0.42, 3635 | fill: '#08d', 3636 | }, 3637 | children: [], 3638 | }, 3639 | { 3640 | type: 'element', 3641 | tagName: 'circle', 3642 | properties: { 3643 | cx: 11, 3644 | cy: 8.66666667, 3645 | r: 0.42, 3646 | fill: '#08d', 3647 | }, 3648 | children: [], 3649 | }, 3650 | { 3651 | type: 'element', 3652 | tagName: 'circle', 3653 | properties: { 3654 | cx: 11, 3655 | cy: 9.66666667, 3656 | r: 0.42, 3657 | fill: '#08d', 3658 | }, 3659 | children: [], 3660 | }, 3661 | { 3662 | type: 'element', 3663 | tagName: 'circle', 3664 | properties: { 3665 | cx: 12, 3666 | cy: 1.66666667, 3667 | r: 0.42, 3668 | fill: '#08d', 3669 | }, 3670 | children: [], 3671 | }, 3672 | { 3673 | type: 'element', 3674 | tagName: 'circle', 3675 | properties: { 3676 | cx: 12, 3677 | cy: 2.66666667, 3678 | r: 0.42, 3679 | fill: '#08d', 3680 | }, 3681 | children: [], 3682 | }, 3683 | { 3684 | type: 'element', 3685 | tagName: 'circle', 3686 | properties: { 3687 | cx: 12, 3688 | cy: 3.66666667, 3689 | r: 0.42, 3690 | fill: '#08d', 3691 | }, 3692 | children: [], 3693 | }, 3694 | { 3695 | type: 'element', 3696 | tagName: 'circle', 3697 | properties: { 3698 | cx: 12, 3699 | cy: 4.66666667, 3700 | r: 0.42, 3701 | fill: '#08d', 3702 | }, 3703 | children: [], 3704 | }, 3705 | { 3706 | type: 'element', 3707 | tagName: 'circle', 3708 | properties: { 3709 | cx: 12, 3710 | cy: 5.66666667, 3711 | r: 0.42, 3712 | fill: '#08d', 3713 | }, 3714 | children: [], 3715 | }, 3716 | { 3717 | type: 'element', 3718 | tagName: 'circle', 3719 | properties: { 3720 | cx: 12, 3721 | cy: 6.66666667, 3722 | r: 0.42, 3723 | fill: '#08d', 3724 | }, 3725 | children: [], 3726 | }, 3727 | { 3728 | type: 'element', 3729 | tagName: 'circle', 3730 | properties: { 3731 | cx: 12, 3732 | cy: 7.66666667, 3733 | r: 0.42, 3734 | fill: '#08d', 3735 | }, 3736 | children: [], 3737 | }, 3738 | { 3739 | type: 'element', 3740 | tagName: 'circle', 3741 | properties: { 3742 | cx: 12, 3743 | cy: 8.66666667, 3744 | r: 0.42, 3745 | fill: '#08d', 3746 | }, 3747 | children: [], 3748 | }, 3749 | { 3750 | type: 'element', 3751 | tagName: 'circle', 3752 | properties: { 3753 | cx: 12, 3754 | cy: 9.66666667, 3755 | r: 0.42, 3756 | fill: '#08d', 3757 | }, 3758 | children: [], 3759 | }, 3760 | { 3761 | type: 'element', 3762 | tagName: 'circle', 3763 | properties: { 3764 | cx: 13, 3765 | cy: 1.66666667, 3766 | r: 0.42, 3767 | fill: '#08d', 3768 | }, 3769 | children: [], 3770 | }, 3771 | { 3772 | type: 'element', 3773 | tagName: 'circle', 3774 | properties: { 3775 | cx: 13, 3776 | cy: 2.66666667, 3777 | r: 0.42, 3778 | fill: '#08d', 3779 | }, 3780 | children: [], 3781 | }, 3782 | { 3783 | type: 'element', 3784 | tagName: 'circle', 3785 | properties: { 3786 | cx: 13, 3787 | cy: 3.66666667, 3788 | r: 0.42, 3789 | fill: '#08d', 3790 | }, 3791 | children: [], 3792 | }, 3793 | { 3794 | type: 'element', 3795 | tagName: 'circle', 3796 | properties: { 3797 | cx: 13, 3798 | cy: 4.66666667, 3799 | r: 0.42, 3800 | fill: '#08d', 3801 | }, 3802 | children: [], 3803 | }, 3804 | { 3805 | type: 'element', 3806 | tagName: 'circle', 3807 | properties: { 3808 | cx: 13, 3809 | cy: 5.66666667, 3810 | r: 0.42, 3811 | fill: '#08d', 3812 | }, 3813 | children: [], 3814 | }, 3815 | { 3816 | type: 'element', 3817 | tagName: 'circle', 3818 | properties: { 3819 | cx: 13, 3820 | cy: 6.66666667, 3821 | r: 0.42, 3822 | fill: '#08d', 3823 | }, 3824 | children: [], 3825 | }, 3826 | { 3827 | type: 'element', 3828 | tagName: 'circle', 3829 | properties: { 3830 | cx: 13, 3831 | cy: 7.66666667, 3832 | r: 0.42, 3833 | fill: '#08d', 3834 | }, 3835 | children: [], 3836 | }, 3837 | { 3838 | type: 'element', 3839 | tagName: 'circle', 3840 | properties: { 3841 | cx: 13, 3842 | cy: 8.66666667, 3843 | r: 0.42, 3844 | fill: '#08d', 3845 | }, 3846 | children: [], 3847 | }, 3848 | { 3849 | type: 'element', 3850 | tagName: 'circle', 3851 | properties: { 3852 | cx: 13, 3853 | cy: 9.66666667, 3854 | r: 0.42, 3855 | fill: '#08d', 3856 | }, 3857 | children: [], 3858 | }, 3859 | { 3860 | type: 'element', 3861 | tagName: 'circle', 3862 | properties: { 3863 | cx: 14, 3864 | cy: 1.66666667, 3865 | r: 0.42, 3866 | fill: '#08d', 3867 | }, 3868 | children: [], 3869 | }, 3870 | { 3871 | type: 'element', 3872 | tagName: 'circle', 3873 | properties: { 3874 | cx: 14, 3875 | cy: 2.66666667, 3876 | r: 0.42, 3877 | fill: '#08d', 3878 | }, 3879 | children: [], 3880 | }, 3881 | { 3882 | type: 'element', 3883 | tagName: 'circle', 3884 | properties: { 3885 | cx: 14, 3886 | cy: 3.66666667, 3887 | r: 0.42, 3888 | fill: '#08d', 3889 | }, 3890 | children: [], 3891 | }, 3892 | { 3893 | type: 'element', 3894 | tagName: 'circle', 3895 | properties: { 3896 | cx: 14, 3897 | cy: 4.66666667, 3898 | r: 0.42, 3899 | fill: '#08d', 3900 | }, 3901 | children: [], 3902 | }, 3903 | { 3904 | type: 'element', 3905 | tagName: 'circle', 3906 | properties: { 3907 | cx: 14, 3908 | cy: 5.66666667, 3909 | r: 0.42, 3910 | fill: '#08d', 3911 | }, 3912 | children: [], 3913 | }, 3914 | { 3915 | type: 'element', 3916 | tagName: 'circle', 3917 | properties: { 3918 | cx: 14, 3919 | cy: 6.66666667, 3920 | r: 0.42, 3921 | fill: '#08d', 3922 | }, 3923 | children: [], 3924 | }, 3925 | { 3926 | type: 'element', 3927 | tagName: 'circle', 3928 | properties: { 3929 | cx: 14, 3930 | cy: 7.66666667, 3931 | r: 0.42, 3932 | fill: '#08d', 3933 | }, 3934 | children: [], 3935 | }, 3936 | { 3937 | type: 'element', 3938 | tagName: 'circle', 3939 | properties: { 3940 | cx: 14, 3941 | cy: 8.66666667, 3942 | r: 0.42, 3943 | fill: '#08d', 3944 | }, 3945 | children: [], 3946 | }, 3947 | { 3948 | type: 'element', 3949 | tagName: 'circle', 3950 | properties: { 3951 | cx: 14, 3952 | cy: 9.66666667, 3953 | r: 0.42, 3954 | fill: '#08d', 3955 | }, 3956 | children: [], 3957 | }, 3958 | { 3959 | type: 'element', 3960 | tagName: 'circle', 3961 | properties: { 3962 | cx: 15, 3963 | cy: 1.66666667, 3964 | r: 0.42, 3965 | fill: '#08d', 3966 | }, 3967 | children: [], 3968 | }, 3969 | { 3970 | type: 'element', 3971 | tagName: 'circle', 3972 | properties: { 3973 | cx: 15, 3974 | cy: 2.66666667, 3975 | r: 0.42, 3976 | fill: '#08d', 3977 | }, 3978 | children: [], 3979 | }, 3980 | { 3981 | type: 'element', 3982 | tagName: 'circle', 3983 | properties: { 3984 | cx: 15, 3985 | cy: 3.66666667, 3986 | r: 0.42, 3987 | fill: '#08d', 3988 | }, 3989 | children: [], 3990 | }, 3991 | { 3992 | type: 'element', 3993 | tagName: 'circle', 3994 | properties: { 3995 | cx: 15, 3996 | cy: 4.66666667, 3997 | r: 0.42, 3998 | fill: '#08d', 3999 | }, 4000 | children: [], 4001 | }, 4002 | { 4003 | type: 'element', 4004 | tagName: 'circle', 4005 | properties: { 4006 | cx: 15, 4007 | cy: 5.66666667, 4008 | r: 0.42, 4009 | fill: '#08d', 4010 | }, 4011 | children: [], 4012 | }, 4013 | { 4014 | type: 'element', 4015 | tagName: 'circle', 4016 | properties: { 4017 | cx: 15, 4018 | cy: 6.66666667, 4019 | r: 0.42, 4020 | fill: '#08d', 4021 | }, 4022 | children: [], 4023 | }, 4024 | { 4025 | type: 'element', 4026 | tagName: 'circle', 4027 | properties: { 4028 | cx: 15, 4029 | cy: 7.66666667, 4030 | r: 0.42, 4031 | fill: '#08d', 4032 | }, 4033 | children: [], 4034 | }, 4035 | { 4036 | type: 'element', 4037 | tagName: 'circle', 4038 | properties: { 4039 | cx: 15, 4040 | cy: 8.66666667, 4041 | r: 0.42, 4042 | fill: '#08d', 4043 | }, 4044 | children: [], 4045 | }, 4046 | { 4047 | type: 'element', 4048 | tagName: 'circle', 4049 | properties: { 4050 | cx: 15, 4051 | cy: 9.66666667, 4052 | r: 0.42, 4053 | fill: '#08d', 4054 | }, 4055 | children: [], 4056 | }, 4057 | { 4058 | type: 'element', 4059 | tagName: 'circle', 4060 | properties: { 4061 | cx: 16, 4062 | cy: 1.66666667, 4063 | r: 0.42, 4064 | fill: '#08d', 4065 | }, 4066 | children: [], 4067 | }, 4068 | { 4069 | type: 'element', 4070 | tagName: 'circle', 4071 | properties: { 4072 | cx: 16, 4073 | cy: 2.66666667, 4074 | r: 0.42, 4075 | fill: '#08d', 4076 | }, 4077 | children: [], 4078 | }, 4079 | { 4080 | type: 'element', 4081 | tagName: 'circle', 4082 | properties: { 4083 | cx: 16, 4084 | cy: 3.66666667, 4085 | r: 0.42, 4086 | fill: '#08d', 4087 | }, 4088 | children: [], 4089 | }, 4090 | { 4091 | type: 'element', 4092 | tagName: 'circle', 4093 | properties: { 4094 | cx: 16, 4095 | cy: 4.66666667, 4096 | r: 0.42, 4097 | fill: '#08d', 4098 | }, 4099 | children: [], 4100 | }, 4101 | { 4102 | type: 'element', 4103 | tagName: 'circle', 4104 | properties: { 4105 | cx: 16, 4106 | cy: 5.66666667, 4107 | r: 0.42, 4108 | fill: '#08d', 4109 | }, 4110 | children: [], 4111 | }, 4112 | { 4113 | type: 'element', 4114 | tagName: 'circle', 4115 | properties: { 4116 | cx: 16, 4117 | cy: 6.66666667, 4118 | r: 0.42, 4119 | fill: '#08d', 4120 | }, 4121 | children: [], 4122 | }, 4123 | { 4124 | type: 'element', 4125 | tagName: 'circle', 4126 | properties: { 4127 | cx: 16, 4128 | cy: 7.66666667, 4129 | r: 0.42, 4130 | fill: '#08d', 4131 | }, 4132 | children: [], 4133 | }, 4134 | { 4135 | type: 'element', 4136 | tagName: 'circle', 4137 | properties: { 4138 | cx: 16, 4139 | cy: 8.66666667, 4140 | r: 0.42, 4141 | fill: '#08d', 4142 | }, 4143 | children: [], 4144 | }, 4145 | { 4146 | type: 'element', 4147 | tagName: 'circle', 4148 | properties: { 4149 | cx: 16, 4150 | cy: 9.66666667, 4151 | r: 0.42, 4152 | fill: '#08d', 4153 | }, 4154 | children: [], 4155 | }, 4156 | { 4157 | type: 'element', 4158 | tagName: 'circle', 4159 | properties: { 4160 | cx: 17, 4161 | cy: 1.66666667, 4162 | r: 0.42, 4163 | fill: '#08d', 4164 | }, 4165 | children: [], 4166 | }, 4167 | { 4168 | type: 'element', 4169 | tagName: 'circle', 4170 | properties: { 4171 | cx: 17, 4172 | cy: 2.66666667, 4173 | r: 0.42, 4174 | fill: '#08d', 4175 | }, 4176 | children: [], 4177 | }, 4178 | { 4179 | type: 'element', 4180 | tagName: 'circle', 4181 | properties: { 4182 | cx: 17, 4183 | cy: 3.66666667, 4184 | r: 0.42, 4185 | fill: '#08d', 4186 | }, 4187 | children: [], 4188 | }, 4189 | { 4190 | type: 'element', 4191 | tagName: 'circle', 4192 | properties: { 4193 | cx: 17, 4194 | cy: 4.66666667, 4195 | r: 0.42, 4196 | fill: '#08d', 4197 | }, 4198 | children: [], 4199 | }, 4200 | { 4201 | type: 'element', 4202 | tagName: 'circle', 4203 | properties: { 4204 | cx: 17, 4205 | cy: 5.66666667, 4206 | r: 0.42, 4207 | fill: '#08d', 4208 | }, 4209 | children: [], 4210 | }, 4211 | { 4212 | type: 'element', 4213 | tagName: 'circle', 4214 | properties: { 4215 | cx: 17, 4216 | cy: 6.66666667, 4217 | r: 0.42, 4218 | fill: '#08d', 4219 | }, 4220 | children: [], 4221 | }, 4222 | { 4223 | type: 'element', 4224 | tagName: 'circle', 4225 | properties: { 4226 | cx: 17, 4227 | cy: 7.66666667, 4228 | r: 0.42, 4229 | fill: '#08d', 4230 | }, 4231 | children: [], 4232 | }, 4233 | { 4234 | type: 'element', 4235 | tagName: 'circle', 4236 | properties: { 4237 | cx: 17, 4238 | cy: 8.66666667, 4239 | r: 0.42, 4240 | fill: '#08d', 4241 | }, 4242 | children: [], 4243 | }, 4244 | { 4245 | type: 'element', 4246 | tagName: 'circle', 4247 | properties: { 4248 | cx: 17, 4249 | cy: 9.66666667, 4250 | r: 0.42, 4251 | fill: '#08d', 4252 | }, 4253 | children: [], 4254 | }, 4255 | { 4256 | type: 'element', 4257 | tagName: 'circle', 4258 | properties: { 4259 | cx: 18, 4260 | cy: 1.66666667, 4261 | r: 0.42, 4262 | fill: '#08d', 4263 | }, 4264 | children: [], 4265 | }, 4266 | { 4267 | type: 'element', 4268 | tagName: 'circle', 4269 | properties: { 4270 | cx: 18, 4271 | cy: 2.66666667, 4272 | r: 0.42, 4273 | fill: '#08d', 4274 | }, 4275 | children: [], 4276 | }, 4277 | { 4278 | type: 'element', 4279 | tagName: 'circle', 4280 | properties: { 4281 | cx: 18, 4282 | cy: 3.66666667, 4283 | r: 0.42, 4284 | fill: '#08d', 4285 | }, 4286 | children: [], 4287 | }, 4288 | { 4289 | type: 'element', 4290 | tagName: 'circle', 4291 | properties: { 4292 | cx: 18, 4293 | cy: 4.66666667, 4294 | r: 0.42, 4295 | fill: '#08d', 4296 | }, 4297 | children: [], 4298 | }, 4299 | { 4300 | type: 'element', 4301 | tagName: 'circle', 4302 | properties: { 4303 | cx: 18, 4304 | cy: 5.66666667, 4305 | r: 0.42, 4306 | fill: '#08d', 4307 | }, 4308 | children: [], 4309 | }, 4310 | { 4311 | type: 'element', 4312 | tagName: 'circle', 4313 | properties: { 4314 | cx: 18, 4315 | cy: 6.66666667, 4316 | r: 0.42, 4317 | fill: '#08d', 4318 | }, 4319 | children: [], 4320 | }, 4321 | { 4322 | type: 'element', 4323 | tagName: 'circle', 4324 | properties: { 4325 | cx: 18, 4326 | cy: 7.66666667, 4327 | r: 0.42, 4328 | fill: '#08d', 4329 | }, 4330 | children: [], 4331 | }, 4332 | { 4333 | type: 'element', 4334 | tagName: 'circle', 4335 | properties: { 4336 | cx: 18, 4337 | cy: 8.66666667, 4338 | r: 0.42, 4339 | fill: '#08d', 4340 | }, 4341 | children: [], 4342 | }, 4343 | { 4344 | type: 'element', 4345 | tagName: 'circle', 4346 | properties: { 4347 | cx: 18, 4348 | cy: 9.66666667, 4349 | r: 0.42, 4350 | fill: '#08d', 4351 | }, 4352 | children: [], 4353 | }, 4354 | { 4355 | type: 'element', 4356 | tagName: 'circle', 4357 | properties: { 4358 | cx: 19, 4359 | cy: 1.66666667, 4360 | r: 0.42, 4361 | fill: '#08d', 4362 | }, 4363 | children: [], 4364 | }, 4365 | { 4366 | type: 'element', 4367 | tagName: 'circle', 4368 | properties: { 4369 | cx: 19, 4370 | cy: 2.66666667, 4371 | r: 0.42, 4372 | fill: '#08d', 4373 | }, 4374 | children: [], 4375 | }, 4376 | { 4377 | type: 'element', 4378 | tagName: 'circle', 4379 | properties: { 4380 | cx: 19, 4381 | cy: 3.66666667, 4382 | r: 0.42, 4383 | fill: '#08d', 4384 | }, 4385 | children: [], 4386 | }, 4387 | { 4388 | type: 'element', 4389 | tagName: 'circle', 4390 | properties: { 4391 | cx: 19, 4392 | cy: 4.66666667, 4393 | r: 0.42, 4394 | fill: '#08d', 4395 | }, 4396 | children: [], 4397 | }, 4398 | { 4399 | type: 'element', 4400 | tagName: 'circle', 4401 | properties: { 4402 | cx: 19, 4403 | cy: 5.66666667, 4404 | r: 0.42, 4405 | fill: '#08d', 4406 | }, 4407 | children: [], 4408 | }, 4409 | { 4410 | type: 'element', 4411 | tagName: 'circle', 4412 | properties: { 4413 | cx: 19, 4414 | cy: 6.66666667, 4415 | r: 0.42, 4416 | fill: '#08d', 4417 | }, 4418 | children: [], 4419 | }, 4420 | { 4421 | type: 'element', 4422 | tagName: 'circle', 4423 | properties: { 4424 | cx: 19, 4425 | cy: 7.66666667, 4426 | r: 0.42, 4427 | fill: '#08d', 4428 | }, 4429 | children: [], 4430 | }, 4431 | { 4432 | type: 'element', 4433 | tagName: 'circle', 4434 | properties: { 4435 | cx: 19, 4436 | cy: 8.66666667, 4437 | r: 0.42, 4438 | fill: '#08d', 4439 | }, 4440 | children: [], 4441 | }, 4442 | { 4443 | type: 'element', 4444 | tagName: 'circle', 4445 | properties: { 4446 | cx: 19, 4447 | cy: 9.66666667, 4448 | r: 0.42, 4449 | fill: '#08d', 4450 | }, 4451 | children: [], 4452 | }, 4453 | { 4454 | type: 'element', 4455 | tagName: 'circle', 4456 | properties: { 4457 | cx: 20, 4458 | cy: 1.66666667, 4459 | r: 0.42, 4460 | fill: '#08d', 4461 | }, 4462 | children: [], 4463 | }, 4464 | { 4465 | type: 'element', 4466 | tagName: 'circle', 4467 | properties: { 4468 | cx: 20, 4469 | cy: 2.66666667, 4470 | r: 0.42, 4471 | fill: '#08d', 4472 | }, 4473 | children: [], 4474 | }, 4475 | { 4476 | type: 'element', 4477 | tagName: 'circle', 4478 | properties: { 4479 | cx: 20, 4480 | cy: 3.66666667, 4481 | r: 0.42, 4482 | fill: '#08d', 4483 | }, 4484 | children: [], 4485 | }, 4486 | { 4487 | type: 'element', 4488 | tagName: 'circle', 4489 | properties: { 4490 | cx: 20, 4491 | cy: 4.66666667, 4492 | r: 0.42, 4493 | fill: '#08d', 4494 | }, 4495 | children: [], 4496 | }, 4497 | { 4498 | type: 'element', 4499 | tagName: 'circle', 4500 | properties: { 4501 | cx: 20, 4502 | cy: 5.66666667, 4503 | r: 0.42, 4504 | fill: '#08d', 4505 | }, 4506 | children: [], 4507 | }, 4508 | { 4509 | type: 'element', 4510 | tagName: 'circle', 4511 | properties: { 4512 | cx: 20, 4513 | cy: 6.66666667, 4514 | r: 0.42, 4515 | fill: '#08d', 4516 | }, 4517 | children: [], 4518 | }, 4519 | { 4520 | type: 'element', 4521 | tagName: 'circle', 4522 | properties: { 4523 | cx: 20, 4524 | cy: 7.66666667, 4525 | r: 0.42, 4526 | fill: '#08d', 4527 | }, 4528 | children: [], 4529 | }, 4530 | { 4531 | type: 'element', 4532 | tagName: 'circle', 4533 | properties: { 4534 | cx: 20, 4535 | cy: 8.66666667, 4536 | r: 0.42, 4537 | fill: '#08d', 4538 | }, 4539 | children: [], 4540 | }, 4541 | { 4542 | type: 'element', 4543 | tagName: 'circle', 4544 | properties: { 4545 | cx: 20, 4546 | cy: 9.66666667, 4547 | r: 0.42, 4548 | fill: '#08d', 4549 | }, 4550 | children: [], 4551 | }, 4552 | { 4553 | type: 'element', 4554 | tagName: 'circle', 4555 | properties: { 4556 | cx: 21, 4557 | cy: 1.66666667, 4558 | r: 0.42, 4559 | fill: '#08d', 4560 | }, 4561 | children: [], 4562 | }, 4563 | { 4564 | type: 'element', 4565 | tagName: 'circle', 4566 | properties: { 4567 | cx: 21, 4568 | cy: 2.66666667, 4569 | r: 0.42, 4570 | fill: '#08d', 4571 | }, 4572 | children: [], 4573 | }, 4574 | { 4575 | type: 'element', 4576 | tagName: 'circle', 4577 | properties: { 4578 | cx: 21, 4579 | cy: 3.66666667, 4580 | r: 0.42, 4581 | fill: '#08d', 4582 | }, 4583 | children: [], 4584 | }, 4585 | { 4586 | type: 'element', 4587 | tagName: 'circle', 4588 | properties: { 4589 | cx: 21, 4590 | cy: 4.66666667, 4591 | r: 0.42, 4592 | fill: '#08d', 4593 | }, 4594 | children: [], 4595 | }, 4596 | { 4597 | type: 'element', 4598 | tagName: 'circle', 4599 | properties: { 4600 | cx: 21, 4601 | cy: 5.66666667, 4602 | r: 0.42, 4603 | fill: '#08d', 4604 | }, 4605 | children: [], 4606 | }, 4607 | { 4608 | type: 'element', 4609 | tagName: 'circle', 4610 | properties: { 4611 | cx: 21, 4612 | cy: 6.66666667, 4613 | r: 0.42, 4614 | fill: '#08d', 4615 | }, 4616 | children: [], 4617 | }, 4618 | { 4619 | type: 'element', 4620 | tagName: 'circle', 4621 | properties: { 4622 | cx: 21, 4623 | cy: 7.66666667, 4624 | r: 0.42, 4625 | fill: '#08d', 4626 | }, 4627 | children: [], 4628 | }, 4629 | { 4630 | type: 'element', 4631 | tagName: 'circle', 4632 | properties: { 4633 | cx: 21, 4634 | cy: 8.66666667, 4635 | r: 0.42, 4636 | fill: '#08d', 4637 | }, 4638 | children: [], 4639 | }, 4640 | { 4641 | type: 'element', 4642 | tagName: 'circle', 4643 | properties: { 4644 | cx: 21, 4645 | cy: 9.66666667, 4646 | r: 0.42, 4647 | fill: '#08d', 4648 | }, 4649 | children: [], 4650 | }, 4651 | { 4652 | type: 'element', 4653 | tagName: 'circle', 4654 | properties: { 4655 | cx: 22, 4656 | cy: 1.66666667, 4657 | r: 0.42, 4658 | fill: '#08d', 4659 | }, 4660 | children: [], 4661 | }, 4662 | { 4663 | type: 'element', 4664 | tagName: 'circle', 4665 | properties: { 4666 | cx: 22, 4667 | cy: 2.66666667, 4668 | r: 0.42, 4669 | fill: '#08d', 4670 | }, 4671 | children: [], 4672 | }, 4673 | { 4674 | type: 'element', 4675 | tagName: 'circle', 4676 | properties: { 4677 | cx: 22, 4678 | cy: 3.66666667, 4679 | r: 0.42, 4680 | fill: '#08d', 4681 | }, 4682 | children: [], 4683 | }, 4684 | { 4685 | type: 'element', 4686 | tagName: 'circle', 4687 | properties: { 4688 | cx: 22, 4689 | cy: 4.66666667, 4690 | r: 0.42, 4691 | fill: '#08d', 4692 | }, 4693 | children: [], 4694 | }, 4695 | { 4696 | type: 'element', 4697 | tagName: 'circle', 4698 | properties: { 4699 | cx: 22, 4700 | cy: 5.66666667, 4701 | r: 0.42, 4702 | fill: '#08d', 4703 | }, 4704 | children: [], 4705 | }, 4706 | { 4707 | type: 'element', 4708 | tagName: 'circle', 4709 | properties: { 4710 | cx: 22, 4711 | cy: 6.66666667, 4712 | r: 0.42, 4713 | fill: '#08d', 4714 | }, 4715 | children: [], 4716 | }, 4717 | { 4718 | type: 'element', 4719 | tagName: 'circle', 4720 | properties: { 4721 | cx: 22, 4722 | cy: 7.66666667, 4723 | r: 0.42, 4724 | fill: '#08d', 4725 | }, 4726 | children: [], 4727 | }, 4728 | { 4729 | type: 'element', 4730 | tagName: 'circle', 4731 | properties: { 4732 | cx: 22, 4733 | cy: 8.66666667, 4734 | r: 0.42, 4735 | fill: '#08d', 4736 | }, 4737 | children: [], 4738 | }, 4739 | { 4740 | type: 'element', 4741 | tagName: 'circle', 4742 | properties: { 4743 | cx: 22, 4744 | cy: 9.66666667, 4745 | r: 0.42, 4746 | fill: '#08d', 4747 | }, 4748 | children: [], 4749 | }, 4750 | { 4751 | type: 'element', 4752 | tagName: 'circle', 4753 | properties: { 4754 | cx: 23, 4755 | cy: 1.66666667, 4756 | r: 0.42, 4757 | fill: '#08d', 4758 | }, 4759 | children: [], 4760 | }, 4761 | { 4762 | type: 'element', 4763 | tagName: 'circle', 4764 | properties: { 4765 | cx: 23, 4766 | cy: 2.66666667, 4767 | r: 0.42, 4768 | fill: '#08d', 4769 | }, 4770 | children: [], 4771 | }, 4772 | { 4773 | type: 'element', 4774 | tagName: 'circle', 4775 | properties: { 4776 | cx: 23, 4777 | cy: 3.66666667, 4778 | r: 0.42, 4779 | fill: '#ff0', 4780 | }, 4781 | children: [], 4782 | }, 4783 | { 4784 | type: 'element', 4785 | tagName: 'circle', 4786 | properties: { 4787 | cx: 23, 4788 | cy: 4.66666667, 4789 | r: 0.42, 4790 | fill: '#ff0', 4791 | }, 4792 | children: [], 4793 | }, 4794 | { 4795 | type: 'element', 4796 | tagName: 'circle', 4797 | properties: { 4798 | cx: 23, 4799 | cy: 5.66666667, 4800 | r: 0.42, 4801 | fill: '#ff0', 4802 | }, 4803 | children: [], 4804 | }, 4805 | { 4806 | type: 'element', 4807 | tagName: 'circle', 4808 | properties: { 4809 | cx: 23, 4810 | cy: 6.66666667, 4811 | r: 0.42, 4812 | fill: '#ff0', 4813 | }, 4814 | children: [], 4815 | }, 4816 | { 4817 | type: 'element', 4818 | tagName: 'circle', 4819 | properties: { 4820 | cx: 23, 4821 | cy: 7.66666667, 4822 | r: 0.42, 4823 | fill: '#ff0', 4824 | }, 4825 | children: [], 4826 | }, 4827 | { 4828 | type: 'element', 4829 | tagName: 'circle', 4830 | properties: { 4831 | cx: 23, 4832 | cy: 8.66666667, 4833 | r: 0.42, 4834 | fill: '#ff0', 4835 | }, 4836 | children: [], 4837 | }, 4838 | { 4839 | type: 'element', 4840 | tagName: 'circle', 4841 | properties: { 4842 | cx: 23, 4843 | cy: 9.66666667, 4844 | r: 0.42, 4845 | fill: '#ff0', 4846 | }, 4847 | children: [], 4848 | }, 4849 | { 4850 | type: 'element', 4851 | tagName: 'circle', 4852 | properties: { 4853 | cx: 24, 4854 | cy: 1.66666667, 4855 | r: 0.42, 4856 | fill: '#ff0', 4857 | }, 4858 | children: [], 4859 | }, 4860 | { 4861 | type: 'element', 4862 | tagName: 'circle', 4863 | properties: { 4864 | cx: 24, 4865 | cy: 2.66666667, 4866 | r: 0.42, 4867 | fill: '#ff0', 4868 | }, 4869 | children: [], 4870 | }, 4871 | { 4872 | type: 'element', 4873 | tagName: 'circle', 4874 | properties: { 4875 | cx: 24, 4876 | cy: 3.66666667, 4877 | r: 0.42, 4878 | fill: '#ff0', 4879 | }, 4880 | children: [], 4881 | }, 4882 | { 4883 | type: 'element', 4884 | tagName: 'circle', 4885 | properties: { 4886 | cx: 24, 4887 | cy: 4.66666667, 4888 | r: 0.42, 4889 | fill: '#ff0', 4890 | }, 4891 | children: [], 4892 | }, 4893 | { 4894 | type: 'element', 4895 | tagName: 'circle', 4896 | properties: { 4897 | cx: 24, 4898 | cy: 5.66666667, 4899 | r: 0.42, 4900 | fill: '#ff0', 4901 | }, 4902 | children: [], 4903 | }, 4904 | { 4905 | type: 'element', 4906 | tagName: 'circle', 4907 | properties: { 4908 | cx: 24, 4909 | cy: 6.66666667, 4910 | r: 0.42, 4911 | fill: '#ff0', 4912 | }, 4913 | children: [], 4914 | }, 4915 | { 4916 | type: 'element', 4917 | tagName: 'circle', 4918 | properties: { 4919 | cx: 24, 4920 | cy: 7.66666667, 4921 | r: 0.42, 4922 | fill: '#ff0', 4923 | }, 4924 | children: [], 4925 | }, 4926 | { 4927 | type: 'element', 4928 | tagName: 'circle', 4929 | properties: { 4930 | cx: 24, 4931 | cy: 8.66666667, 4932 | r: 0.42, 4933 | fill: '#ff0', 4934 | }, 4935 | children: [], 4936 | }, 4937 | { 4938 | type: 'element', 4939 | tagName: 'circle', 4940 | properties: { 4941 | cx: 24, 4942 | cy: 9.66666667, 4943 | r: 0.42, 4944 | fill: '#ff0', 4945 | }, 4946 | children: [], 4947 | }, 4948 | { 4949 | type: 'element', 4950 | tagName: 'circle', 4951 | properties: { 4952 | cx: 25, 4953 | cy: 1.66666667, 4954 | r: 0.42, 4955 | fill: '#ff0', 4956 | }, 4957 | children: [], 4958 | }, 4959 | { 4960 | type: 'element', 4961 | tagName: 'circle', 4962 | properties: { 4963 | cx: 25, 4964 | cy: 2.66666667, 4965 | r: 0.42, 4966 | fill: '#ff0', 4967 | }, 4968 | children: [], 4969 | }, 4970 | { 4971 | type: 'element', 4972 | tagName: 'circle', 4973 | properties: { 4974 | cx: 25, 4975 | cy: 3.66666667, 4976 | r: 0.42, 4977 | fill: '#ff0', 4978 | }, 4979 | children: [], 4980 | }, 4981 | { 4982 | type: 'element', 4983 | tagName: 'circle', 4984 | properties: { 4985 | cx: 25, 4986 | cy: 4.66666667, 4987 | r: 0.42, 4988 | fill: '#ff0', 4989 | }, 4990 | children: [], 4991 | }, 4992 | { 4993 | type: 'element', 4994 | tagName: 'circle', 4995 | properties: { 4996 | cx: 25, 4997 | cy: 5.66666667, 4998 | r: 0.42, 4999 | fill: '#ff0', 5000 | }, 5001 | children: [], 5002 | }, 5003 | { 5004 | type: 'element', 5005 | tagName: 'circle', 5006 | properties: { 5007 | cx: 25, 5008 | cy: 6.66666667, 5009 | r: 0.42, 5010 | fill: '#ff0', 5011 | }, 5012 | children: [], 5013 | }, 5014 | { 5015 | type: 'element', 5016 | tagName: 'circle', 5017 | properties: { 5018 | cx: 25, 5019 | cy: 7.66666667, 5020 | r: 0.42, 5021 | fill: '#ff0', 5022 | }, 5023 | children: [], 5024 | }, 5025 | { 5026 | type: 'element', 5027 | tagName: 'circle', 5028 | properties: { 5029 | cx: 25, 5030 | cy: 8.66666667, 5031 | r: 0.42, 5032 | fill: '#ff0', 5033 | }, 5034 | children: [], 5035 | }, 5036 | { 5037 | type: 'element', 5038 | tagName: 'circle', 5039 | properties: { 5040 | cx: 25, 5041 | cy: 9.66666667, 5042 | r: 0.42, 5043 | fill: '#ff0', 5044 | }, 5045 | children: [], 5046 | }, 5047 | { 5048 | type: 'element', 5049 | tagName: 'circle', 5050 | properties: { 5051 | cx: 26, 5052 | cy: 1.66666667, 5053 | r: 0.42, 5054 | fill: '#ff0', 5055 | }, 5056 | children: [], 5057 | }, 5058 | { 5059 | type: 'element', 5060 | tagName: 'circle', 5061 | properties: { 5062 | cx: 26, 5063 | cy: 2.66666667, 5064 | r: 0.42, 5065 | fill: '#ff0', 5066 | }, 5067 | children: [], 5068 | }, 5069 | { 5070 | type: 'element', 5071 | tagName: 'circle', 5072 | properties: { 5073 | cx: 26, 5074 | cy: 3.66666667, 5075 | r: 0.42, 5076 | fill: '#ff0', 5077 | }, 5078 | children: [], 5079 | }, 5080 | { 5081 | type: 'element', 5082 | tagName: 'circle', 5083 | properties: { 5084 | cx: 26, 5085 | cy: 4.66666667, 5086 | r: 0.42, 5087 | fill: '#ff0', 5088 | }, 5089 | children: [], 5090 | }, 5091 | { 5092 | type: 'element', 5093 | tagName: 'circle', 5094 | properties: { 5095 | cx: 26, 5096 | cy: 5.66666667, 5097 | r: 0.42, 5098 | fill: '#ff0', 5099 | }, 5100 | children: [], 5101 | }, 5102 | { 5103 | type: 'element', 5104 | tagName: 'circle', 5105 | properties: { 5106 | cx: 26, 5107 | cy: 6.66666667, 5108 | r: 0.42, 5109 | fill: '#ff0', 5110 | }, 5111 | children: [], 5112 | }, 5113 | { 5114 | type: 'element', 5115 | tagName: 'circle', 5116 | properties: { 5117 | cx: 26, 5118 | cy: 7.66666667, 5119 | r: 0.42, 5120 | fill: '#ff0', 5121 | }, 5122 | children: [], 5123 | }, 5124 | { 5125 | type: 'element', 5126 | tagName: 'circle', 5127 | properties: { 5128 | cx: 26, 5129 | cy: 8.66666667, 5130 | r: 0.42, 5131 | fill: '#ff0', 5132 | }, 5133 | children: [], 5134 | }, 5135 | { 5136 | type: 'element', 5137 | tagName: 'circle', 5138 | properties: { 5139 | cx: 26, 5140 | cy: 9.66666667, 5141 | r: 0.42, 5142 | fill: '#ff0', 5143 | }, 5144 | children: [], 5145 | }, 5146 | { 5147 | type: 'element', 5148 | tagName: 'circle', 5149 | properties: { 5150 | cx: 27, 5151 | cy: 1.66666667, 5152 | r: 0.42, 5153 | fill: '#ff0', 5154 | }, 5155 | children: [], 5156 | }, 5157 | { 5158 | type: 'element', 5159 | tagName: 'circle', 5160 | properties: { 5161 | cx: 27, 5162 | cy: 2.66666667, 5163 | r: 0.42, 5164 | fill: '#ff0', 5165 | }, 5166 | children: [], 5167 | }, 5168 | { 5169 | type: 'element', 5170 | tagName: 'circle', 5171 | properties: { 5172 | cx: 27, 5173 | cy: 3.66666667, 5174 | r: 0.42, 5175 | fill: '#ff0', 5176 | }, 5177 | children: [], 5178 | }, 5179 | { 5180 | type: 'element', 5181 | tagName: 'circle', 5182 | properties: { 5183 | cx: 27, 5184 | cy: 4.66666667, 5185 | r: 0.42, 5186 | fill: '#ff0', 5187 | }, 5188 | children: [], 5189 | }, 5190 | { 5191 | type: 'element', 5192 | tagName: 'circle', 5193 | properties: { 5194 | cx: 27, 5195 | cy: 5.66666667, 5196 | r: 0.42, 5197 | fill: '#ff0', 5198 | }, 5199 | children: [], 5200 | }, 5201 | { 5202 | type: 'element', 5203 | tagName: 'circle', 5204 | properties: { 5205 | cx: 27, 5206 | cy: 6.66666667, 5207 | r: 0.42, 5208 | fill: '#ff0', 5209 | }, 5210 | children: [], 5211 | }, 5212 | { 5213 | type: 'element', 5214 | tagName: 'circle', 5215 | properties: { 5216 | cx: 27, 5217 | cy: 7.66666667, 5218 | r: 0.42, 5219 | fill: '#ff0', 5220 | }, 5221 | children: [], 5222 | }, 5223 | { 5224 | type: 'element', 5225 | tagName: 'circle', 5226 | properties: { 5227 | cx: 27, 5228 | cy: 8.66666667, 5229 | r: 0.42, 5230 | fill: '#ff0', 5231 | }, 5232 | children: [], 5233 | }, 5234 | { 5235 | type: 'element', 5236 | tagName: 'circle', 5237 | properties: { 5238 | cx: 27, 5239 | cy: 9.66666667, 5240 | r: 0.42, 5241 | fill: '#ff0', 5242 | }, 5243 | children: [], 5244 | }, 5245 | { 5246 | type: 'element', 5247 | tagName: 'circle', 5248 | properties: { 5249 | cx: 28, 5250 | cy: 1.66666667, 5251 | r: 0.42, 5252 | fill: '#ff0', 5253 | }, 5254 | children: [], 5255 | }, 5256 | { 5257 | type: 'element', 5258 | tagName: 'circle', 5259 | properties: { 5260 | cx: 28, 5261 | cy: 2.66666667, 5262 | r: 0.42, 5263 | fill: '#ff0', 5264 | }, 5265 | children: [], 5266 | }, 5267 | { 5268 | type: 'element', 5269 | tagName: 'circle', 5270 | properties: { 5271 | cx: 28, 5272 | cy: 3.66666667, 5273 | r: 0.42, 5274 | fill: '#ff0', 5275 | }, 5276 | children: [], 5277 | }, 5278 | { 5279 | type: 'element', 5280 | tagName: 'circle', 5281 | properties: { 5282 | cx: 28, 5283 | cy: 4.66666667, 5284 | r: 0.42, 5285 | fill: '#ff0', 5286 | }, 5287 | children: [], 5288 | }, 5289 | { 5290 | type: 'element', 5291 | tagName: 'circle', 5292 | properties: { 5293 | cx: 28, 5294 | cy: 5.66666667, 5295 | r: 0.42, 5296 | fill: '#ff0', 5297 | }, 5298 | children: [], 5299 | }, 5300 | { 5301 | type: 'element', 5302 | tagName: 'circle', 5303 | properties: { 5304 | cx: 28, 5305 | cy: 6.66666667, 5306 | r: 0.42, 5307 | fill: '#ff0', 5308 | }, 5309 | children: [], 5310 | }, 5311 | { 5312 | type: 'element', 5313 | tagName: 'circle', 5314 | properties: { 5315 | cx: 28, 5316 | cy: 7.66666667, 5317 | r: 0.42, 5318 | fill: '#ff0', 5319 | }, 5320 | children: [], 5321 | }, 5322 | { 5323 | type: 'element', 5324 | tagName: 'circle', 5325 | properties: { 5326 | cx: 28, 5327 | cy: 8.66666667, 5328 | r: 0.42, 5329 | fill: '#ff0', 5330 | }, 5331 | children: [], 5332 | }, 5333 | { 5334 | type: 'element', 5335 | tagName: 'circle', 5336 | properties: { 5337 | cx: 28, 5338 | cy: 9.66666667, 5339 | r: 0.42, 5340 | fill: '#ff0', 5341 | }, 5342 | children: [], 5343 | }, 5344 | { 5345 | type: 'element', 5346 | tagName: 'circle', 5347 | properties: { 5348 | cx: 29, 5349 | cy: 1.66666667, 5350 | r: 0.42, 5351 | fill: '#ff0', 5352 | }, 5353 | children: [], 5354 | }, 5355 | { 5356 | type: 'element', 5357 | tagName: 'circle', 5358 | properties: { 5359 | cx: 29, 5360 | cy: 2.66666667, 5361 | r: 0.42, 5362 | fill: '#ff0', 5363 | }, 5364 | children: [], 5365 | }, 5366 | { 5367 | type: 'element', 5368 | tagName: 'circle', 5369 | properties: { 5370 | cx: 29, 5371 | cy: 3.66666667, 5372 | r: 0.42, 5373 | fill: '#ff0', 5374 | }, 5375 | children: [], 5376 | }, 5377 | { 5378 | type: 'element', 5379 | tagName: 'circle', 5380 | properties: { 5381 | cx: 29, 5382 | cy: 4.66666667, 5383 | r: 0.42, 5384 | fill: '#ff0', 5385 | }, 5386 | children: [], 5387 | }, 5388 | { 5389 | type: 'element', 5390 | tagName: 'circle', 5391 | properties: { 5392 | cx: 29, 5393 | cy: 5.66666667, 5394 | r: 0.42, 5395 | fill: '#ff0', 5396 | }, 5397 | children: [], 5398 | }, 5399 | { 5400 | type: 'element', 5401 | tagName: 'circle', 5402 | properties: { 5403 | cx: 29, 5404 | cy: 6.66666667, 5405 | r: 0.42, 5406 | fill: '#ff0', 5407 | }, 5408 | children: [], 5409 | }, 5410 | { 5411 | type: 'element', 5412 | tagName: 'circle', 5413 | properties: { 5414 | cx: 29, 5415 | cy: 7.66666667, 5416 | r: 0.42, 5417 | fill: '#ff0', 5418 | }, 5419 | children: [], 5420 | }, 5421 | { 5422 | type: 'element', 5423 | tagName: 'circle', 5424 | properties: { 5425 | cx: 29, 5426 | cy: 8.66666667, 5427 | r: 0.42, 5428 | fill: '#ff0', 5429 | }, 5430 | children: [], 5431 | }, 5432 | { 5433 | type: 'element', 5434 | tagName: 'circle', 5435 | properties: { 5436 | cx: 31, 5437 | cy: -7, 5438 | r: 0.42, 5439 | fill: '#d64', 5440 | }, 5441 | children: [], 5442 | }, 5443 | { 5444 | type: 'element', 5445 | tagName: 'circle', 5446 | properties: { 5447 | cx: 32, 5448 | cy: -7, 5449 | r: 0.42, 5450 | fill: '#d64', 5451 | }, 5452 | children: [], 5453 | }, 5454 | { 5455 | type: 'element', 5456 | tagName: 'circle', 5457 | properties: { 5458 | cx: 31, 5459 | cy: -6, 5460 | r: 0.42, 5461 | fill: '#d64', 5462 | }, 5463 | children: [], 5464 | }, 5465 | { 5466 | type: 'element', 5467 | tagName: 'circle', 5468 | properties: { 5469 | cx: 32, 5470 | cy: -6, 5471 | r: 0.42, 5472 | fill: '#d64', 5473 | }, 5474 | children: [], 5475 | }, 5476 | { 5477 | type: 'element', 5478 | tagName: 'circle', 5479 | properties: { 5480 | cx: 31, 5481 | cy: -5, 5482 | r: 0.42, 5483 | fill: '#d64', 5484 | }, 5485 | children: [], 5486 | }, 5487 | { 5488 | type: 'element', 5489 | tagName: 'circle', 5490 | properties: { 5491 | cx: 32, 5492 | cy: -5, 5493 | r: 0.42, 5494 | fill: '#d64', 5495 | }, 5496 | children: [], 5497 | }, 5498 | { 5499 | type: 'element', 5500 | tagName: 'circle', 5501 | properties: { 5502 | cx: 31, 5503 | cy: -4, 5504 | r: 0.42, 5505 | fill: '#d64', 5506 | }, 5507 | children: [], 5508 | }, 5509 | { 5510 | type: 'element', 5511 | tagName: 'circle', 5512 | properties: { 5513 | cx: 32, 5514 | cy: -4, 5515 | r: 0.42, 5516 | fill: '#d64', 5517 | }, 5518 | children: [], 5519 | }, 5520 | { 5521 | type: 'element', 5522 | tagName: 'circle', 5523 | properties: { 5524 | cx: 31, 5525 | cy: -3, 5526 | r: 0.42, 5527 | fill: '#d64', 5528 | }, 5529 | children: [], 5530 | }, 5531 | { 5532 | type: 'element', 5533 | tagName: 'circle', 5534 | properties: { 5535 | cx: 32, 5536 | cy: -3, 5537 | r: 0.42, 5538 | fill: '#d64', 5539 | }, 5540 | children: [], 5541 | }, 5542 | { 5543 | type: 'element', 5544 | tagName: 'circle', 5545 | properties: { 5546 | cx: 31, 5547 | cy: -2, 5548 | r: 0.42, 5549 | fill: '#d64', 5550 | }, 5551 | children: [], 5552 | }, 5553 | { 5554 | type: 'element', 5555 | tagName: 'circle', 5556 | properties: { 5557 | cx: 32, 5558 | cy: -2, 5559 | r: 0.42, 5560 | fill: '#d64', 5561 | }, 5562 | children: [], 5563 | }, 5564 | { 5565 | type: 'element', 5566 | tagName: 'circle', 5567 | properties: { 5568 | cx: 31, 5569 | cy: -1, 5570 | r: 0.42, 5571 | fill: '#d64', 5572 | }, 5573 | children: [], 5574 | }, 5575 | { 5576 | type: 'element', 5577 | tagName: 'circle', 5578 | properties: { 5579 | cx: 32, 5580 | cy: -1, 5581 | r: 0.42, 5582 | fill: '#d64', 5583 | }, 5584 | children: [], 5585 | }, 5586 | { 5587 | type: 'element', 5588 | tagName: 'circle', 5589 | properties: { 5590 | cx: 31, 5591 | cy: 0, 5592 | r: 0.42, 5593 | fill: '#d64', 5594 | }, 5595 | children: [], 5596 | }, 5597 | { 5598 | type: 'element', 5599 | tagName: 'circle', 5600 | properties: { 5601 | cx: 32, 5602 | cy: 0, 5603 | r: 0.42, 5604 | fill: '#d64', 5605 | }, 5606 | children: [], 5607 | }, 5608 | { 5609 | type: 'element', 5610 | tagName: 'circle', 5611 | properties: { 5612 | cx: 31, 5613 | cy: 1, 5614 | r: 0.42, 5615 | fill: '#d64', 5616 | }, 5617 | children: [], 5618 | }, 5619 | { 5620 | type: 'element', 5621 | tagName: 'circle', 5622 | properties: { 5623 | cx: 32, 5624 | cy: 1, 5625 | r: 0.42, 5626 | fill: '#d64', 5627 | }, 5628 | children: [], 5629 | }, 5630 | { 5631 | type: 'element', 5632 | tagName: 'circle', 5633 | properties: { 5634 | cx: 31, 5635 | cy: 2, 5636 | r: 0.42, 5637 | fill: '#d64', 5638 | }, 5639 | children: [], 5640 | }, 5641 | { 5642 | type: 'element', 5643 | tagName: 'circle', 5644 | properties: { 5645 | cx: 32, 5646 | cy: 2, 5647 | r: 0.42, 5648 | fill: '#d64', 5649 | }, 5650 | children: [], 5651 | }, 5652 | { 5653 | type: 'element', 5654 | tagName: 'circle', 5655 | properties: { 5656 | cx: 31, 5657 | cy: 3, 5658 | r: 0.42, 5659 | fill: '#d64', 5660 | }, 5661 | children: [], 5662 | }, 5663 | { 5664 | type: 'element', 5665 | tagName: 'circle', 5666 | properties: { 5667 | cx: 32, 5668 | cy: 3, 5669 | r: 0.42, 5670 | fill: '#d64', 5671 | }, 5672 | children: [], 5673 | }, 5674 | { 5675 | type: 'element', 5676 | tagName: 'circle', 5677 | properties: { 5678 | cx: 31, 5679 | cy: 4, 5680 | r: 0.42, 5681 | fill: '#d64', 5682 | }, 5683 | children: [], 5684 | }, 5685 | { 5686 | type: 'element', 5687 | tagName: 'circle', 5688 | properties: { 5689 | cx: 32, 5690 | cy: 4, 5691 | r: 0.42, 5692 | fill: '#d64', 5693 | }, 5694 | children: [], 5695 | }, 5696 | { 5697 | type: 'element', 5698 | tagName: 'circle', 5699 | properties: { 5700 | cx: 31, 5701 | cy: 5, 5702 | r: 0.42, 5703 | fill: '#d64', 5704 | }, 5705 | children: [], 5706 | }, 5707 | { 5708 | type: 'element', 5709 | tagName: 'circle', 5710 | properties: { 5711 | cx: 32, 5712 | cy: 5, 5713 | r: 0.42, 5714 | fill: '#d64', 5715 | }, 5716 | children: [], 5717 | }, 5718 | { 5719 | type: 'element', 5720 | tagName: 'circle', 5721 | properties: { 5722 | cx: 31, 5723 | cy: 6, 5724 | r: 0.42, 5725 | fill: '#d64', 5726 | }, 5727 | children: [], 5728 | }, 5729 | { 5730 | type: 'element', 5731 | tagName: 'circle', 5732 | properties: { 5733 | cx: 32, 5734 | cy: 6, 5735 | r: 0.42, 5736 | fill: '#d64', 5737 | }, 5738 | children: [], 5739 | }, 5740 | { 5741 | type: 'element', 5742 | tagName: 'circle', 5743 | properties: { 5744 | cx: 31, 5745 | cy: 7, 5746 | r: 0.42, 5747 | fill: '#d64', 5748 | }, 5749 | children: [], 5750 | }, 5751 | { 5752 | type: 'element', 5753 | tagName: 'circle', 5754 | properties: { 5755 | cx: 32, 5756 | cy: 7, 5757 | r: 0.42, 5758 | fill: '#d64', 5759 | }, 5760 | children: [], 5761 | }, 5762 | ], 5763 | } 5764 | -------------------------------------------------------------------------------- /test/simple.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | 3 | import chart from '../src/index.js' 4 | import tape from 'tape' 5 | import { normalize as n } from './util.js' 6 | 7 | import expected from './data/simple.js' 8 | 9 | const parliament = { 10 | headBench: { 11 | speaker: { 12 | seats: 3, 13 | colour: '#abc', 14 | }, 15 | }, 16 | left: { 17 | labour: { 18 | seats: 200, 19 | colour: '#d21', 20 | }, 21 | snp: { 22 | seats: 30, 23 | colour: '#ff0', 24 | }, 25 | }, 26 | crossBench: { 27 | dup: { 28 | seats: 30, 29 | colour: '#d64', 30 | }, 31 | }, 32 | right: { 33 | conservative: { 34 | seats: 200, 35 | colour: '#08d', 36 | }, 37 | libdems: { 38 | seats: 60, 39 | colour: '#ff0', 40 | }, 41 | }, 42 | } 43 | 44 | tape('Simple example', t => { 45 | const svg = chart(parliament) 46 | t.deepEqual(n(svg), n(expected)) 47 | t.end() 48 | }) 49 | -------------------------------------------------------------------------------- /test/uk-2017-virtual-dom.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | 3 | import hFunction from 'virtual-hyperscript-svg' 4 | import chart from '../src/index.js' 5 | import tape from 'tape' 6 | import { normalize as n } from './util.js' 7 | 8 | import expected from './data/uk-2017-virtual-dom.js' 9 | 10 | const parliament = { 11 | headBench: { 12 | speaker: { 13 | seats: 1, 14 | colour: '#000', 15 | }, 16 | }, 17 | left: { 18 | labour: { 19 | seats: 262, 20 | colour: '#dc241f', 21 | }, 22 | snp: { 23 | seats: 35, 24 | colour: '#ff0', 25 | }, 26 | libdems: { 27 | seats: 12, 28 | colour: '#faa61a', 29 | }, 30 | sinnfein: { 31 | seats: 7, 32 | colour: '#080', 33 | }, 34 | plaidcymru: { 35 | seats: 4, 36 | colour: '#008142', 37 | }, 38 | green: { 39 | seats: 1, 40 | colour: '#6ab023', 41 | }, 42 | independent: { 43 | seats: 1, 44 | colour: '#aadfff', 45 | }, 46 | }, 47 | crossBench: { 48 | dup: { 49 | seats: 10, 50 | colour: '#d46a4c', 51 | }, 52 | }, 53 | right: { 54 | conservative: { 55 | seats: 317, 56 | colour: '#0087dc', 57 | }, 58 | }, 59 | } 60 | 61 | tape('2017 UK general election, custom h function', t => { 62 | const svg = chart(parliament, { hFunction }) 63 | t.deepEqual(n(svg), n(expected)) 64 | t.end() 65 | }) 66 | -------------------------------------------------------------------------------- /test/uk-2017.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | 3 | import chart from '../src/index.js' 4 | import tape from 'tape' 5 | import { normalize as n } from './util.js' 6 | 7 | import expected from './data/uk-2017.js' 8 | 9 | const parliament = { 10 | headBench: { 11 | speaker: { 12 | seats: 1, 13 | colour: '#000', 14 | }, 15 | }, 16 | left: { 17 | labour: { 18 | seats: 262, 19 | colour: '#dc241f', 20 | }, 21 | snp: { 22 | seats: 35, 23 | colour: '#ff0', 24 | }, 25 | libdems: { 26 | seats: 12, 27 | colour: '#faa61a', 28 | }, 29 | sinnfein: { 30 | seats: 7, 31 | colour: '#080', 32 | }, 33 | plaidcymru: { 34 | seats: 4, 35 | colour: '#008142', 36 | }, 37 | green: { 38 | seats: 1, 39 | colour: '#6ab023', 40 | }, 41 | independent: { 42 | seats: 1, 43 | colour: '#aadfff', 44 | }, 45 | }, 46 | crossBench: { 47 | dup: { 48 | seats: 10, 49 | colour: '#d46a4c', 50 | }, 51 | }, 52 | right: { 53 | conservative: { 54 | seats: 317, 55 | colour: '#0087dc', 56 | }, 57 | }, 58 | } 59 | 60 | tape('2017 UK general election', t => { 61 | const svg = chart(parliament) 62 | t.deepEqual(n(svg), n(expected)) 63 | t.end() 64 | }) 65 | -------------------------------------------------------------------------------- /test/util.js: -------------------------------------------------------------------------------- 1 | export const normalize = x => JSON.parse(JSON.stringify(x)) 2 | -------------------------------------------------------------------------------- /webpack.config.js: -------------------------------------------------------------------------------- 1 | import { dirname, resolve } from 'path' 2 | import { fileURLToPath } from 'url' 3 | 4 | export default { 5 | mode: 'production', 6 | entry: './docs/index.js', 7 | output: { 8 | path: resolve(dirname(fileURLToPath(import.meta.url)), 'docs/bundle'), 9 | filename: 'index.js', 10 | }, 11 | } 12 | --------------------------------------------------------------------------------