Tutorial 8: WebApp Layer Mesh Data

Introduction

This tutorial demonstrates how to asynchronously load a CSV file containing mesh data in a 2D array format (also known as grid data or raster data) into a web application, convert it to an SVGMap DOM element, and display it.

To actually do it, click on mesh1.html.

Source Code

• Source code directory
• Determine the format of the mesh data you will be using in this tutorial.
• Container.svg: Specifies a clickable layer.
• ArrayMesh.svg: Layer associated with webApp
• ArrayMesh.html:
• ArrayMesh.js: Reads mesh data and visualizes each individual mesh as an SVG rect element.

Tutorial

• Click here to see how it works.
• The file used is a ZIP archive file.

What is mesh data?

Mesh data has a data structure in which data is arranged on an equally spaced grid, and is also called grid data. In a program, it can be treated as two-dimensional array data and its metadata (such as information about the origin and grid spacing).

In Japan, regional standard meshes are commonly used for determining mesh intervals, origins, and numbering rules for each mesh. ( See References 1 , 2 , and 3. Note that regional standard meshes are not a data format for mesh data.)

10x8 meshData (X0=xx,Y0=yy,interval=ii)

---	---	---	---	---	---	---	---	---	---
Val0,0	Val1,0	Val2,0	Val3,0	Val4,0	Val5,0	Val6,0	Val7,0	Val8,0	Val9,0
Val0,1	Val1,1	Val2,1	Val3,1	Val4,1	Val5,1	Val6,1	Val7,1	Val8,1	Val9,1
Val0,2	Val1,2	Val2,2	Val3,2	Val4,2	Val5,2	Val6,2	Val7,2	Val8,2	Val9,2
Val0,3	Val1,3	Val2,3	Val3,3	Val4,3	Val5,3	Val6,3	Val7,3	Val8,3	Val9,3
Val0,4	Val1,4	Val2,4	Val3,4	Val4,4	Val5,4	Val6,4	Val7,4	Val8,4	Val9,4
Val0,5	Val1,5	Val2,5	Val3,5	Val4,5	Val5,5	Val6,5	Val7,5	Val8,5	Val9.5
Val0,6	Val1,6	Val2,6	Val3,6	Val4,6	Val5,6	Val6,6	Val7,6	Val8,6	Val9,6
Val0,7	Val1,7	Val2,7	Val3,7	Val4,7	Val5,7	Val6,7	Val7,7	Val8,7	Val9,7

In the diagram above, each square represents a single mesh, the number inside the square is the mesh number (the number in the two-dimensional array), and each square contains a value. The metadata X0, Y0, and interval in parentheses represent the coordinates of the origin and the mesh interval. (Metadata may also include data units, coordinate systems, and descriptions.)

Types of mesh data formats

There are two main types of data format structures that are known:

Raster

• The mesh data shown in the diagram above has been directly converted into data.
• Commonly used ASCII (text) encoding formats: AAIGrid (Wikipedia - GDAL explanation)
• Because the data is easily compressed, differential encoding and binary encoding are frequently used. Sometimes, the bit image data format (however, a lossless format) is used as is.
  • Rough TIFF
  • Example of elevation tiles from the Geospatial Information Authority of Japan (encoded in PNG format)
  • List of GDAL raster drivers

Gridded XYZ

• The data is encoded using the Point feature format, but with the constraint that the Point coordinates must always lie on the grid.
• The difference from a Raster is that each record contains coordinate values ​​​​(X,Y).

X0,Y0,interval
Value00,Value10,Value20
Value01,Value11,Value21
Value02,Value12,Value22

This type of raster data can be described using Gridded XYZ as follows:

X0,Y0,Value00
X1,Y0,Value10
X2,Y0,Value20
X0,Y1,Value01
....
X2,Y2,Value22
</code>

Note that in Gridded XYZ, the order of the records does not matter. Additionally, if there is no data at a grid point, that record can be omitted. Depending on the data, records with duplicate X and Y values (i.e., unnormalized data) may be swapped. A key feature of this format is that it allows for such representation even when the data is not normalized.

• Please also refer to the following:

Example of a data format conversion tool: https://gdal.org/programs/gdal_grid.html

Data formats used in this tutorial

We will use a text-encoded raster format.

• Header row (first row)
• Comma-separated, two-dimensional array data (second row onwards)
  • Each mesh cell contains a single value [real number] (multiple values, such as temperature and humidity, are not allowed)
  • Column (row) direction: X-direction
    • The direction in which the number of columns increases is the same as the direction in which the X grid coordinates increase
  • Row direction: Y-direction
    • The direction in which the number of rows increases is the same as the direction in which the Y grid coordinates decrease

Header row

• List pairs of [attribute name]:[attribute value] separated by commas.
• Attribute Name
  • minX : Minimum X (longitude) value of the mesh area [real number] (coordinate of the left edge of the rectangle enclosing the entire area in the figure above)
  • maxX : Maximum X (longitude) value of the mesh area [real number] (coordinate of the right edge of the rectangle enclosing the entire area in the figure above)
  • minY: Minimum Y (latitude) value of the mesh area [real number] (the bottom-left coordinate of the rectangle enclosing the entire area shown above)
  • maxY: Maximum Y (latitude) value of the mesh area [real number] (the top-right coordinate of the rectangle enclosing the entire area shown above)
  • partX: Number of meshes in the X (longitude) direction of the mesh area [natural number]
  • partY: Number of meshes in the Y (latitude) direction of the mesh area [natural number]
  • valName: Unit of the mesh value [string]
  • minVal: Minimum value of the mesh [real number]
  • maxVal: Maximum value of the mesh [real number]

Sample data for practical use

Click here for the sample data (density of shrines and temples in Japan)

minX:124.1539312,maxX:145.7870748,minY:24.33444293,maxY:45.51431213,partX:100,partY:98,valName:count/km2,minVal:1.95645299200927E-03,maxVal:2.86870067881484
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,1.97412404320488E-02,2.4676550540061E-03,2.4676550540061E-03,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,7.37480244978236E-03,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,4.89797155921526E-03,,4.89797155921526E-03,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,2.43980848573941E-03,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,7.29220251762907E-03,,,1.21536708627151E-02,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,9.68704575374383E-03,9.68704575374383E-03,,,2.17958529459236E-02,4.84352287687192E-03,,,2.17958529459236E-02,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,2.41288890872148E-03,2.65417779959363E-02,,,1.44773334523289E-02,,7.23866672616444E-03,,,1.68902223610504E-02,9.65155563488592E-03,,,,4.82577781744296E-03,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,2.40411523496203E-02,4.80823046992406E-03,1.44246914097722E-02,2.40411523496203E-03,9.37604941635191E-02,1.92329218796962E-02,1.20205761748101E-02,,,1.20205761748101E-02,7.21234570488609E-03,3.12534980545064E-02,1.20205761748101E-02,4.80823046992406E-03,1.68288066447342E-02,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,2.39543909437019E-03,,2.39543909437019E-03,5.74905382648847E-02,0.011977195471851,0.150912662945322,4.79087818874039E-03,2.39543909437019E-03,,,7.18631728311058E-03,7.18631728311058E-03,4.79087818874039E-03,2.39543909437019E-03,,,,4.79087818874039E-03,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,2.38685918921668E-03,,,,2.38685918921668E-03,,9.54743675686673E-03,7.87663532441505E-02,4.05766062166836E-02,1.67080143245168E-02,,,,,,,,,9.54743675686673E-03,,7.16057756765004E-03,7.16057756765004E-03,2.38685918921668E-03,,2.38685918921668E-03
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,2.37837424625475E-03,2.37837424625475E-03,4.28107364325854E-02,0.152215951760304,0.019026993970038,3.56756136938212E-02,1.66486197237832E-02,7.84863501264066E-02,3.32972394475665E-02,,1.66486197237832E-02,,,4.75674849250949E-03,2.37837424625475E-03,2.37837424625475E-03,,,,2.37837424625475E-03,2.37837424625475E-03,,,2.37837424625475E-03,,2.61621167088022E-02
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,0.021329847145445,4.7399660323211E-03,4.7399660323211E-03,2.36998301616055E-02,0.350757486391762,8.76893715979404E-02,7.10994904848165E-02,5.68795923878532E-02,,,,1.65898811131239E-02,1.42198980969633E-02,3.79197282585688E-02,2.84397961939266E-02,,,1.18499150808028E-02,8.53193885817798E-02,,0.021329847145445,1.42198980969633E-02,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,2.59785270028783E-02,9.44673709195576E-03,4.25103169138009E-02,1.88934741839115E-02,,,3.54252640948341E-02,2.36168427298894E-02,2.36168427298894E-03,7.08505281896682E-03,,,,2.83402112758673E-02,4.25103169138009E-02,7.08505281896682E-03,4.72336854597788E-03,2.36168427298894E-03,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,1.64743376955089E-02,2.35347681364414E-03,2.82417217637296E-02,7.06043044093241E-03,9.41390725457654E-03,7.06043044093241E-03,0.035302152204662,,2.11812913227972E-02,4.70695362728827E-03,,,,4.70695362728827E-03,1.17673840682207E-02,,4.70695362728827E-03,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,1.40721567441894E-02,4.69071891472979E-03,2.34535945736489E-03,,,9.85050972093256E-02,3.98711107752032E-02,,,,2.34535945736489E-03,9.38143782945958E-03,4.69071891472979E-03,,,,4.69071891472979E-03,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,2.33733104522365E-03,2.33733104522365E-03,1.40239862713419E-02,1.16866552261183E-02,2.10359794070129E-02,2.57106414974602E-02,4.6746620904473E-03,,,,,,,,,1.16866552261183E-02,2.10359794070129E-02,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,2.56232948360314E-02,1.16469521981961E-02,,5.12465896720628E-02,1.39763426378353E-02,,,,,,,,,,1.16469521981961E-02,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,4.64307304780522E-03,,6.96460957170783E-03,0.176436775816598,1.62507556673183E-02,1.85722921912209E-02,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,1.85101456137249E-02,9.25507280686246E-03,4.62753640343123E-03,,2.08239138154405E-02,2.31376820171562E-03,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,2.30608439674165E-03,,1.15304219837082E-02,3.68973503478663E-02,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,1.60893883651801E-02,6.89545215650575E-03,1.14924202608429E-02,2.29848405216858E-03,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,3.20735258239644E-02,0.107675408123309,8.70567129507605E-02,1.83277290422654E-02,6.87289839084951E-03,4.58193226056634E-03,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,9.13411844822654E-03,2.28352961205663E-03,6.8505888361699E-03,0.2580388461624,3.19694145687929E-02,,4.11035330170194E-02,4.11035330170194E-02,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,2.27617349674119E-03,,9.10469398696478E-03,4.55234699348239E-03,,0.011380867483706,6.14566844120122E-02,0.106980154346836,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,6.80669040443137E-02,3.85712456251111E-02,7.94113880516994E-02,6.57980072428366E-02,2.26889680147712E-03,2.26889680147712E-03,5.89913168384052E-02,4.53779360295425E-03,4.08401424265882E-02,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,3.84488755354706E-02,8.36828467536713E-02,4.52339712182007E-03,9.04679424364014E-03,2.26169856091003E-03,,1.35701913654602E-02,2.26169856091003E-03,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,1.80366226145447E-02,0.24800356094999,1.12728891340905E-02,2.25457782681809E-03,,,0.137529247435904,,,4.50915565363619E-03,2.25457782681809E-03,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,4.04556060194795E-02,5.16932743582237E-02,8.31587457067078E-02,6.74260100324658E-03,,7.64161447034612E-02,6.74260100324658E-03,,2.24753366774886E-03,0.047198207022726,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,8.96226067466189E-03,0.116509388770605,6.72169550599642E-03,0.255424429227864,6.72169550599642E-03,6.72169550599642E-03,0.177004648324572,1.79245213493238E-02,5.37735640479714E-02,3.58490426986476E-02,1.79245213493238E-02,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,3.35050714590285E-02,1.78693714448152E-02,4.46734286120379E-03,0.125085600113706,2.2336714306019E-03,,0.154123328711531,0.022336714306019,0.022336714306019,3.35050714590285E-02,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,0.273902743150215,3.11759219845773E-02,1.33611094219617E-02,,,2.00416641329426E-02,0.104662023805367,4.45370314065391E-02,8.46203596724242E-02,8.90740628130781E-03,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,5.32825132804057E-02,0.419599792083195,3.10814660802366E-02,9.54645029607268E-02,3.55216755202704E-02,1.11005236000845E-02,9.32443982407099E-02,0.104344921840794,5.55026180004226E-02,1.77608377601352E-02,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,4.4268600538726E-03,3.32014504040445E-02,6.64029008080891E-03,4.4268600538726E-03,0.159366961939414,9.96043512121336E-02,1.10671501346815E-02,0.150513241831669,0.11952522145456,0.152726671858605,8.85372010774521E-03,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,4.41365330625383E-03,4.41365330625383E-03,,,,0.139030079146996,0.024275093184396,,5.51706663281728E-02,0.518604263484825,5.51706663281728E-02,7.50321062063151E-02,0.470054077116033,0.024275093184396,4.41365330625383E-03,8.82730661250765E-03,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,0.171622914458144,4.62061692771927E-02,,,2.42032315261486E-02,9.24123385543855E-02,1.32017626506265E-02,1.32017626506265E-02,0.215628789960233,0.132017626506265,6.60088132531325E-03,0.134217920281369,0.101213513654803,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,4.38766116712541E-03,2.19383058356271E-03,,,,,,3.29074587534406E-02,8.77532233425083E-03,1.75506446685017E-02,0.482642728383795,0.361982046287847,0.118466851512386,,2.19383058356271E-03,0.23473987244121,8.77532233425083E-03,0.263259670027525,6.58149175068812E-02,6.36210869233185E-02,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,0.209993883176214,0.441862129183284,0.120308995569706,1.74994902646845E-02,3.06241079631979E-02,0.109371814154278,1.53120539815989E-02,4.37487256617113E-03,0.201244138043872,2.84366716801123E-02,5.46859070771391E-02,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,8.07010733990224E-02,8.07010733990224E-02,0.148315486246852,,,,,,0.185394357808565,0.377332045892726,0.170126587165507,,6.54333027559641E-03,1.52677706430583E-02,0.174488807349238,1.30866605511928E-02,8.72444036746188E-02,0.141772155971256,0.037078871561713,3.92599816535785E-02,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,1.52239586900056E-02,0.154414438141486,0.121791669520045,,,,8.6994049657175E-03,3.69724711042994E-02,0.45019420697588,8.91689008986043E-02,7.17700909671694E-02,8.26443471743162E-02,,2.17485124142937E-03,1.30491074485762E-02,0.017398809931435,8.6994049657175E-03,0.143540181934339,7.39449422085987E-02,2.17485124142937E-02,8.48191984157456E-02,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,0.279757007951887,0.201685284802523,,0.134456856535016,2.38552487400834E-02,0.117107584724046,2.16865897637122E-02,0.17783003606244,3.68672025983107E-02,3.90358615746819E-02,1.30119538582273E-02,,,2.16865897637122E-03,6.50597692911366E-03,8.24090411021063E-02,2.16865897637122E-02,3.68672025983107E-02,4.77104974801668E-02,0.210359920708008,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,2.37878580950012E-02,0.363305469087291,0.899613542501863,0.635784570902759,0.183815267097736,,1.08126627704551E-02,0.155702343894553,0.348167741208654,2.16253255409102E-03,,5.62258464063664E-02,1.73002604327281E-02,2.16253255409102E-03,0.116776757920915,5.40633138522754E-02,0.118939290475006,2.81129232031832E-02,1.29751953245461E-02,5.19007812981844E-02,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,2.37211836899434E-02,1.02216736991211,0.295436560502023,0.204864768231329,0.183300055785926,2.15647124454031E-03,,4.52858961353465E-02,0.338565985392829,0.090571792270693,1.29388274672419E-02,0.028034126179024,0.174674170807765,3.01905974235643E-02,0.034503539912645,5.39117811135078E-02,0.232898894410354,0.116449447205177,4.31294248908062E-02,9.91976772488543E-02,0.034503539912645,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,2.15047432997382E-03,,,,,,,,,,,,,7.74170758790576E-02,0.217197907327356,2.79561662896597E-02,1.29028459798429E-02,2.15047432997382E-02,6.66647042291885E-02,2.15047432997382E-03,,0.154834151758115,4.08590122695026E-02,0.217197907327356,0.103222767838743,9.03199218589006E-02,0.462351980944372,0.408590122695026,0.550521428473299,0.339774944135864,0.249455022276963,0.165586523407984,0.111824665158639,0.133329408458377,4.30094865994765E-03,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,4.28908220941427E-03,6.4336233141214E-03,4.28908220941427E-03,,,,,,,,,,,,0.032168116570607,0.604760591527412,0.177996911690692,9.00707263976997E-02,,4.28908220941427E-03,0.137250630701257,6.4336233141214E-03,2.14454110470713E-03,9.22152675024068E-02,0.111516137444771,1.07227055235357E-02,3.64571987800213E-02,0.032168116570607,7.07698564553354E-02,0.300235754658999,0.482521748559105,0.529701652862662,0.216598651575421,0.195153240528349,0.167274206167156,8.57816441882854E-02,4.28908220941427E-03,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,3.84960757478439E-02,0.650155945963586,0.10265620199425,0.115488227243532,5.77441136217658E-02,3.84960757478439E-02,2.56640504985626E-02,,2.13867087488022E-02,9.19628476198493E-02,8.55468349952087E-02,8.12694932454482E-02,1.92480378739219E-02,2.13867087488022E-03,3.63574048729637E-02,0.160400315616016,0.530390376970294,0.780614869331279,0.970956577195618,0.303691264232991,0.134736265117454,0.160400315616016,6.62987971212867E-02,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,8.5314518329066E-03,2.13286295822665E-03,,,,2.13286295822665E-03,4.47901221227596E-02,3.83915332480797E-02,7.25173405797061E-02,0.138636092284732,6.18530257885728E-02,,,6.61187517050261E-02,0.191957666240398,1.49300407075865E-02,8.5314518329066E-03,0.042657259164533,7.46502035379327E-02,2.13286295822665E-02,1.49300407075865E-02,2.13286295822665E-02,6.18530257885728E-02,2.13286295822665E-03,1.91957666240398E-02,0.531082876598436,0.279405047527691,9.81116960784258E-02,0.296467951193504,0.897935305413419,2.26296759867847,2.86870067881484,0.499089932225036,0.245279240196065,0.219684884697345,7.03844776214794E-02,4.47901221227596E-02,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,0.189313384862506,0.176550684759416,0.295669219054925,0.176550684759416,4.89236837285128E-02,0.136135467766297,7.65762006185418E-02,0.195694734914051,4.25423336769677E-02,0.082957550670087,0.246745535326413,0.110610067560116,0.229728601855626,0.104228717508571,0.242491301958716,0.163787984656326,0.336084436048045,0.323321735944954,0.431804686821222,0.60622825489679,0.357355602886529,0.102101600824722,0.125499884347055,1.48898167869387E-02,0.112737184243964,2.12711668384838E-03,0.027652516890029,0.14464393450169,0.114864300927813,0.104228717508571,0.193567618230203,0.687058688883028,1.2528717267867,0.146771051185539,0.238237068591019,0.2637624687972,5.10508004123612E-02,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,0.152743060223704,0.120921589343766,0.146378766047716,4.03071964479218E-02,5.51572161918931E-02,1.69714511359671E-02,1.27285883519753E-02,2.33357453119548E-02,3.60643336639301E-02,3.60643336639301E-02,4.24286278399177E-02,0.171835942751667,0.273664649567469,0.163350217183683,9.12215498558231E-02,3.18214708799383E-02,0.112435863775782,0.642793711774754,0.286393237919445,0.352157611071317,1.77139521231657,0.948279832222161,0.116678726559774,5.30357847998972E-02,1.06071569599794E-02,0.019092882527963,,1.48500197439712E-02,0.239721747295535,0.214264570591585,0.1548644916157,0.473079200415083,0.267300355391482,0.56217931887891,0.163350217183683,8.27358242878396E-02,0.201535982239609,0.038185765055926,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,8.46322573541403E-03,0.131179998898918,0.118485160295796,7.40532251848728E-02,1.90422579046816E-02,2.32738707723886E-02,4.65477415447772E-02,0.112137740994236,8.88638702218474E-02,0.184075159745255,6.98216123171658E-02,8.88638702218474E-02,9.09796766557009E-02,0.192538385480669,0.139643224634332,0.190422579046816,0.296212900739491,2.13273288532434,0.768037735488824,0.693984510303951,9.94429023911149E-02,0.389308383829046,0.421045480336848,0.738416445414875,0.44643515754309,6.55899994494588E-02,5.28951608463377E-02,4.02003222432167E-02,1.69264514708281E-02,0.39777160956446,0.32583419081344,0.141759031068185,0.514140963426403,8.04006444864333E-02,,6.34741930156053E-03,0.181959353311402,0.148106450369746,2.53896772062421E-02,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,2.11024117132996E-03,,,2.95433763986194E-02,0.168819293706397,4.43150645979291E-02,6.75277174825587E-02,4.43150645979291E-02,0.149827123164427,5.90867527972389E-02,8.01891645105385E-02,0.111842782080488,6.11969939685688E-02,6.75277174825587E-02,6.75277174825587E-02,0.253228940559595,0.316536175699494,0.314425934528164,0.179370499563047,0.576095839773079,1.51937364335757,0.835655503846664,8.22994056818684E-02,0.293323522814864,0.208913875961666,0.225795805332306,0.151937364335757,0.51278860463318,0.183590981905706,0.346079552098113,0.215244599475656,0.379843410839393,0.240567493531615,0.346079552098113,,6.33072351398988E-02,7.38584409965486E-02,2.32126528846296E-02,6.33072351398988E-03,,1.89921705419696E-02,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,2.10473497685373E-03,1.26284098611224E-02,,,,,,,,,4.20946995370746E-03,3.36757596296596E-02,0.092608338981564,1.89426147916836E-02,5.47231093981969E-02,7.99799291204417E-02,0.069456254236173,7.99799291204417E-02,0.134703038518639,0.311500776574352,0.23152084745391,0.328338656389182,0.319919716481767,5.05136394444895E-02,4.20946995370746E-03,,8.62941340510028E-02,0.420946995370746,0.092608338981564,2.23943801537237,1.03763434358889,0.250463462245594,0.151540918333468,0.229416112477056,0.383061765787378,3.36757596296596E-02,1.89426147916836E-02,4.41994345139283E-02,1.26284098611224E-02,8.20846640972954E-02,0.113655688750101,0.105236748842686,,,2.10473497685373E-02,4.84089044676357E-02,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,4.19857446634665E-03,6.29786169951998E-03,,,,,,2.09928723317333E-03,5.87800425288531E-02,8.18722020937597E-02,0.151148680788479,3.35885957307732E-02,3.56878829639465E-02,3.98864574302932E-02,0.104964361658666,0.371573840271679,0.140652244622613,0.117560085057706,0.304396648810132,0.172141553120213,2.51914467980799E-02,0.163744404187519,0.327488808375039,0.138552957389439,6.29786169951998E-03,2.30921595649066E-02,0.201531574384639,2.30921595649066E-02,0.354779542406292,0.272907340312532,0.329588095608212,0.188935850985599,3.35885957307732E-02,4.40850318966398E-02,0.224623733949546,0.083971489326933,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,3.14084599974333E-02,,,,,,,,0.123539942656571,6.90986119943532E-02,0.213577527982546,0.096319277325462,8.79436879928131E-02,8.16619959933265E-02,0.140291121321869,0.127727737322895,0.048159638662731,0.13191553198922,0.048159638662731,,9.21314826591376E-02,0.364338135970226,0.161230094653491,0.11307045599076,0.274300550644251,0.22614091198152,1.46572813321355E-02,0.303615113308522,0.280582242643737,0.077474201327002,1.25633839989733E-02,8.37558933264887E-03,3.97840493300821E-02,3.35023573305955E-02,1.25633839989733E-02,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,4.17712935925664E-03,,,,2.71513408351681E-02,0.304930443225735,0.486635570353398,0.142022398214726,4.80369876314513E-02,8.56311518647611E-02,0.139933833535097,0.240184938157257,7.72768931462478E-02,3.13284701944248E-02,0.18588225648692,8.14540225055044E-02,0.162908045011009,0.104428233981416,7.10111991073629E-02,2.29742114759115E-02,0.045948422951823,4.38598582721947E-02,0.100251104622159,0.169173739049894,,0.167085174370266,6.89226344277345E-02,8.35425871851328E-03,6.26569403888496E-03,3.55055995536814E-02,6.89226344277345E-02,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,3.33326189620469E-02,2.08328868512793E-03,,4.37490623876865E-02,0.329159612250213,0.564571233669669,0.324993034879957,,4.16657737025586E-03,5.62487944984541E-02,,2.08328868512793E-02,,2.08328868512793E-03,0.177079538235874,7.29151039794776E-02,,,4.16657737025586E-03,8.33315474051172E-03,,8.33315474051172E-03,2.70827529066631E-02,2.08328868512793E-02,,2.08328868512793E-03,0.127080609792804,4.99989284430703E-02,6.24986605538379E-03,0.108331011626652,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,8.31227508713599E-03,0.004156137543568,0.132996401394176,0.147542882796664,0.583937324871303,0.536141743120271,0.274305077875488,0.039483306663896,0.243134046298728,0.253524390157648,0.16624550174272,0.004156137543568,,6.23420631535199E-03,0.147542882796664,6.44201319253039E-02,0.012468412630704,0.002078068771784,4.36394442074639E-02,0.14546481402488,0.02078068771784,5.19517192945999E-02,0.012468412630704,0.014546481402488,,,,0.002078068771784,0.014546481402488,0.027014894033192,0.01039034385892,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,1.45103305977601E-02,4.14580874221717E-03,0.049749704906606,9.74265054421035E-02,0.122301357895406,0.27776918572855,0.737953956114656,0.493351240323843,0.124374262266515,0.114009740410972,7.66974617310176E-02,0.153394923462035,0.223873672079727,2.69477568244116E-02,2.07290437110858E-03,2.07290437110858E-03,0.140957497235384,4.56038961643889E-02,8.29161748443434E-03,6.21871311332575E-03,1.86561393399773E-02,,,8.29161748443434E-03,3.31664699377374E-02,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,2.27457441621238E-02,4.13558984765887E-03,,0.113728720810619,6.61694375625418E-02,0.248135390859532,0.163355798982525,0.479728422328428,0.128203285277425,2.27457441621238E-02,1.24067695429766E-02,7.44406172578596E-02,7.85762071055184E-02,0.10752533603913,1.03389746191472E-02,,2.48135390859532E-02,4.13558984765887E-03,3.10169238574415E-02,2.06779492382943E-03,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,1.03389746191472E-02,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,2.06273987972052E-03,2.06273987972052E-03,1.23764392783231E-02,,,1.03136993986026E-02,8.25095951888208E-02,0.109325213625188,6.60076761510567E-02,0.136140832061554,0.360979478951091,3.30038380755283E-02,4.33175374741309E-02,7.83841154293798E-02,2.06273987972052E-02,4.95057571132925E-02,1.03136993986026E-02,,2.06273987972052E-02,4.53802773538515E-02,1.85646589174847E-02,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,6.17321609230951E-03,4.11547739487301E-02,,,,8.23095478974602E-03,0.160503618400047,2.88083417641111E-02,3.90970352512936E-02,4.52702513436031E-02,0.228408995415452,2.67506030666746E-02,2.26351256718015E-02,6.17321609230951E-03,8.84827639897697E-02,8.23095478974602E-03,,,,,2.0577386974365E-03,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,0.100586751373196,2.66862809765621E-02,0.166276058392426,1.64223267548075E-02,,,2.05279084435093E-03,5.74781436418262E-02,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,3.27663327423708E-02,3.07184369459726E-02,2.86705411495744E-02,6.34847696883434E-02,4.30058117243616E-02,,2.04789579639817E-02,3.27663327423708E-02,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,2.45166364550266E-02,2.45166364550266E-02,3.06457955687832E-02,1.63444243033511E-02,2.45166364550266E-02,1.22583182275133E-02,0.116454023161376,2.04305303791888E-03,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,4.07652412301805E-03,2.03826206150903E-03,5.29948135992347E-02,2.03826206150903E-02,2.85356688611264E-02,3.87269791686715E-02,1.83443585535812E-02,3.05739309226354E-02,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,4.06704473574453E-03,,,0.030502835518084,8.33744170827628E-02,1.62681789429781E-02,1.62681789429781E-02,1.83017013108504E-02,4.06704473574453E-02,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,4.05766693135136E-03,0.056807337038919,2.23171681224325E-02,2.63748350537838E-02,8.11533386270271E-03,8.11533386270271E-03,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,1.61935589712698E-02,1.61935589712698E-02,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,0.014105466976364,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,6.03172864662474E-03,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,3.93652918053998E-03,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,1.95645299200927E-03,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,7.75050212040696E-03,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,1.93398562085494E-02,5.80195686256481E-03,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,4.43988958422274E-02,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,9.54818937423838E-03,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
1.14182140267032E-02,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,

Container.svg

• The theme layer displaying GeoJSON and the background map (OpenStreetMap) are loaded using the animation element.
• As in Tutorial 6, the layer is set to be clickable.
  • As described later, the clickable class attribute is specified to visualize the mesh data as vector data and enable interactivity.

<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="122.9800817, -45.398095, 21.97626, 21.0533039" >
 <globalCoordinateSystem srsName="http://purl.org/crs/84" transform="matrix(1,0,0,-1,0,0)" />

<!-- OpenStretMap背景地図を表示状態として読み込む -->
<animation xlink:href="./dynamicOSM_r11.svg" x="-3000" y="-3000" width="6000" height="6000" title="Japan Coastline" class="basemap" visibility="visible"/>

<!-- CSVのメッシュデータレイヤーを表示状態として読み込む -->
<animation xlink:href="ArrayMesh.svg" x="-3000" y="-3000" width="6000" height="6000" title="ArrayMesh" class="Mesh clickable" visibility="visible" opacity="0.6"/>
</svg>

ArrayMesh.svg

• The data-controller attribute of the document root element (the svg element) specifies the web app that will control this layer.
  • data-controller="ArrayMesh.html#exec=appearOnLayerLoad
  • The exec=appearOnLayerLoad setting causes the web app window to appear when the layer is displayed. (For more details, click here)

<?xml version="1.0" encoding="UTF-8"?>
<svg
  xmlns="http://www.w3.org/2000/svg"
  xmlns:xlink="http://www.w3.org/1999/xlink"
  viewBox="-42.8202042942663, -49.9999999999999, 513.842451531196, 600"
  data-controller="ArrayMesh.html#exec=appearOnLayerLoad"
>

<globalCoordinateSystem srsName="http://purl.org/crs/84" transform="matrix(100,0,0,-100,0,0)" />
</svg>

ArrayMesh.html, ArrayMesh.js

Load the mesh data and visualize each individual mesh as an SVG rect element.

• addEventListener(“load”, async function(){.. : Load mesh data via the fetch API after the web app loads
  • The mesh data is stored in csvLines[] as strings separated by line breaks
• getCsvProps(headerLine): Load the header row
• getRange(): Calculate the minimum and maximum values of the visualization data (for heatmap color mapping)
• drawMesh(): Load the mesh data line by line, split it by column, and visualize each mesh individually
  • setMesh(...): Function that visualizes each individual mesh
    • xd, yd: Calculate the geographic coordinates of the mesh (xd: longitude, yd: latitude)
      • Note: Be careful with the y-coordinate: The orientation of the SVG content coordinates and the geographic coordinates (latitude axis) are reversed. Therefore, north (the side with larger latitude values) becomes the origin in SVG coordinates (the side with smaller SVG y-coordinate values).
    • cl = document.createElement(“rect”);: Visualizes the mesh as a rect element
      • cl.setAttribute - x,y,width,height: Converts the geographic coordinate values to SVG coordinate values and sets them to the SVG rect element
      • In ArrayMesh.svg, the globalCoordinateSystem element is hardcoded based on the specified transformation coefficients (100, 0, 0, -100, 0, 0).
    • getColor(val, minVal, maxVal): Converts the value to be visualized into a color code.
      • HSVtoRGB(h, s, v): A function that converts HSV values into RGB values (color information that can be set in SVG, etc.).
      • In this tutorial, we perform a heatmap-style visualization by mapping values to the hue (H value) of the HSV (Hue, Saturation, Value) color space. (S and V are set to their maximum values (the most vivid colors).)
  • svgMap.refreshScreen() If DOM redrawing is required at times other than when zooming or scrolling, you must explicitly trigger the redraw.
    • Reference Information

<!DOCTYPE html>
<html>
<head>
<title>CSV Mesh Data Visualizer Controller</title>
<meta charset="UTF-8">
</head>
<script src="https://cdn.jsdelivr.net/gh/svgmap/svgmapjs@latest/svgMapLayerLib.js"></script>
<script src="ArrayMesh.js"></script>

<body>
<h3>Mesh Data Controller</h3>

<div id="gui">
  <form>
      <span >min</span>
	  <input id="vminI" type="text" name="min" style="width :80px;font-size:80%">
      <span >max</span>
	  <input id="vmaxI" type="text" name="max" style="width :80px;font-size:80%">
	  <input id="vset" type="button" onclick="setRange( )" value="setRange"/>
  </form>
  <table border="0">
  <tr><td colspan="3">
  <img src="hsvBar.png" width="200" height="10"/>
  </td></tr>
  <tr style="font-size:60%"><td>
  <span id="scalemin">min</span>
  </td><td align="center">
  <span id="scalemid">mid</span>
  </td><td align="right">
  <span id="scalemax">max</span>
  </td><tr>
  </table>
</body>
</html>

var csvPath = "mesh.csv";

var csvLines, csvProps;

addEventListener("load",async function(){
	csvLines = await getText(csvPath);
	csvLines = csvLines.split("\n");
	csvProps=getCsvProps(csvLines[0]);
	vminI.value=csvProps.minVal;
	vmaxI.value=csvProps.maxVal;
	getRange();
	drawMesh(csvLines, csvProps);
});

function drawMesh(csvLines, csvProps, minVal, maxVal){
	if (!minVal){
		minVal = csvProps.minVal;
	}
	if (!maxVal){
		maxVal = csvProps.maxVal;
	}
	for ( var i = 1 ; i < csvProps.partY + 1 ; i++ ){
		var strTxt = csvLines[i].split(",");
		for ( var j = 0 ; j < csvProps.partX ; j++ ){
			if ( strTxt[j].replace(/\s+/g, "") !=""){
				var val = Number(strTxt[j]);
				setMesh( j , i-1 , val, csvProps, minVal, maxVal );
			}
		}
	}
	svgMap.refreshScreen();
}

function setMesh( xp , yp , value, csvProps, minVal, maxVal ){
//		console.log("call getMesh:");
	var color = getColor(value, minVal, maxVal);
	var cl = svgImage.getElementById(xp+":"+yp);
	if ( cl ){
		cl.setAttribute("fill" , color);
	} else {
		var xd = csvProps.minX + xp * csvProps.twd; // rectの西
		var yd = csvProps.maxY - yp * csvProps.thd; // rectの北
		
		cl = document.createElement("rect"); // Should be used NS ( for Firefox!!)
		cl.setAttribute("x" ,  100 * xd );
		cl.setAttribute("y" , -100 * yd );
		cl.setAttribute("width" , 100 * csvProps.twd );
		cl.setAttribute("height" , 100 * csvProps.thd );
		cl.setAttribute("content" , value);
		cl.setAttribute("fill" , color);
		cl.setAttribute("id", xp+":"+yp);
		svgImage.getElementsByTagName("svg")[0].appendChild(cl);
	}
}

function getCsvProps(headerLine){
	var hp = getHeaderParams( headerLine );
	console.log("sc_param:",hp);
	svgImage.documentElement.setAttribute("property", hp.valName);
	
	csvProps={
		minX: Number(hp.minX),
		maxX: Number(hp.maxX),
		minY: Number(hp.minY),
		maxY: Number(hp.maxY),
		minVal: Number(hp.minVal),
		maxVal: Number(hp.maxVal),
		partX: Number(hp.partX),
		partY: Number(hp.partY),
	}
	
	csvProps.twd = ( csvProps.maxX - csvProps.minX ) / csvProps.partX;
	csvProps.thd = ( csvProps.maxY - csvProps.minY ) / csvProps.partY;
	
	return ( csvProps );
	updateTile();
}

function getHeaderParams( hash ){
	hash = hash.split(",");
	for ( var i = 0 ; i < hash.length ; i++ ){
		hash[i] = hash[i].split(":");
		if ( hash[i][1] ){
			hash[hash[i][0]] = hash[i][1];
		} else {
			hash[hash[i][0]] = true;
		}
	}
	return ( hash );
}

async function getText(path){
	var response = await fetch(path);
	var txt = await response.text();
	return ( txt );
}

function getColor( val, minVal, maxVal ){
	
	// value clip
	if ( val > maxVal ){
		val = maxVal;
	}
	if ( val < minVal ){
		val = minVal;
	}
	
	// Hue値の算出(最大値:H=0(赤) , 最小値:H=270(青紫) 逆周り)
	var h = 270 - 270 * (val - minVal) / (maxVal - minVal);
	
	var ans = HSVtoRGB (h, 255, 255);
	
	return ("#"+ pad16(ans.r) + pad16(ans.g) + pad16(ans.b));
}

function pad16( val ){
	var bv =  "00" + val.toString(16);
	bv = bv.substr(bv.length - 2, 2);
	return ( bv );
}

function HSVtoRGB (h, s, v) { // from http://d.hatena.ne.jp/ja9/20100903/1283504341
	var r, g, b; // 0..255
	while (h < 0) {
		h += 360;
	}
	h = h % 360;
	
	// 特別な場合 saturation = 0
	if (s == 0) {
		// → RGB は V に等しい
		v = Math.round(v);
		return {'r': v, 'g': v, 'b': v};
	}
	s = s / 255;
	
	var i = Math.floor(h / 60) % 6,
	f = (h / 60) - i,
	p = v * (1 - s),
	q = v * (1 - f * s),
	t = v * (1 - (1 - f) * s);

	switch (i) {
	case 0 :
		r = v;  g = t;  b = p;  break;
	case 1 :
		r = q;  g = v;  b = p;  break;
	case 2 :
		r = p;  g = v;  b = t;  break;
	case 3 :
		r = p;  g = q;  b = v;  break;
	case 4 :
		r = t;  g = p;  b = v;  break;
	case 5 :
		r = v;  g = p;  b = q;  break;
	}
	return {'r': Math.round(r), 'g': Math.round(g), 'b': Math.round(b)};
}


function getRange(){
	if ( isNaN(vminI.value) || isNaN(vmaxI.value) ){return}
	var minVal = Number(vminI.value);
	var maxVal = Number(vmaxI.value);
	if ( minVal > maxVal){[minVal, maxVal] = [maxVal, minVal]}
	
	document.getElementById("scalemin").innerHTML = minVal.toPrecision(5);
	document.getElementById("scalemax").innerHTML = maxVal.toPrecision(5);
	document.getElementById("scalemid").innerHTML = ((maxVal + minVal)/2.0).toPrecision(5);
	return{minVal,maxVal}
}

function setRange(){
	var range=getRange();
	drawMesh(csvLines, csvProps, range.minVal, range.maxVal);
}