2023-12-20 12:02:41 +00:00
|
|
|
<svg width="100%" height="100%" viewBox="0 0 1500 1192" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;">
|
2023-12-21 10:59:01 +00:00
|
|
|
<g id="base" transform="matrix(1,0,0,1,83.2784,66.1766)">
|
|
|
|
|
<path d="M957.929,785.895L1332.94,785.895L1332.94,1020.16L960.275,1020.16L957.929,785.895Z" style="fill:rgb(226,218,208);fill-rule:nonzero;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M2.294,33.225L26.685,18.498C27.448,18.037 28.391,17.993 29.193,18.378L87.632,46.466C87.731,46.514 87.827,46.568 87.92,46.628L159.149,92.616C159.817,93.048 160.644,93.155 161.4,92.908L338.367,35.169C338.656,35.075 338.958,35.031 339.261,35.04L386.52,36.379C388.133,36.425 389.409,35.025 389.215,33.423L386.164,8.242C385.984,6.76 387.069,5.423 388.557,5.295L441.208,0.748C442.75,0.614 444.075,1.83 444.075,3.378L444.075,23.067C444.075,24.199 444.796,25.204 445.868,25.567L467.084,32.756C468.449,33.218 469.191,34.69 468.751,36.062L464.27,50.034C464.241,50.126 464.216,50.22 464.197,50.314L453.105,104.915C453.076,105.057 453.035,105.197 452.983,105.333L447.994,118.354C447.902,118.592 447.846,118.842 447.827,119.097L446.316,138.879L443.769,177.129C443.765,177.188 443.763,177.246 443.763,177.305L443.763,185.82C443.763,187.278 444.945,188.46 446.403,188.46L448.649,188.46C449.929,188.46 451.024,189.378 451.248,190.638L457.054,223.292C457.1,223.551 457.107,223.815 457.075,224.075L448.534,293.875C448.522,293.974 448.516,294.074 448.515,294.174L448.288,321.069C448.284,321.627 448.102,322.168 447.771,322.617L432.299,343.537C431.874,344.112 431.234,344.489 430.526,344.584L405.824,347.878C404.497,348.055 403.513,349.197 403.533,350.535L404.197,393.225C404.199,393.369 404.213,393.512 404.238,393.653L416.044,459.042C416.065,459.156 416.093,459.268 416.128,459.378L427.451,494.751C427.527,494.989 427.637,495.214 427.776,495.421L442.538,517.345C442.712,517.604 442.93,517.829 443.183,518.012L456.001,527.26C456.411,527.556 456.897,527.728 457.402,527.755L490.358,529.541C490.428,529.545 490.498,529.546 490.568,529.544L730.342,523.375L820.431,524.221C821.751,524.234 822.878,523.268 823.068,521.961L827.988,488.108C828.15,486.995 828.999,486.107 830.103,485.895L904.653,471.607C904.998,471.541 905.353,471.544 905.697,471.617L1023.08,496.446C1024.59,496.765 1025.51,498.31 1025.06,499.79L990.641,613.969L975.527,656.283C975.497,656.366 975.471,656.451 975.45,656.537L964.848,699.361C964.658,700.131 964.823,700.945 965.299,701.579L967.687,704.764C968.159,705.393 968.326,706.2 968.142,706.964L967.83,708.267C967.663,708.961 967.785,709.693 968.167,710.296L975.371,721.659C975.445,721.776 975.509,721.898 975.564,722.024L984.56,742.81C984.682,743.092 984.852,743.35 985.063,743.574L992.872,751.848C993.122,752.112 993.314,752.426 993.437,752.769L1004.9,784.759C1004.91,784.771 1004.92,784.795 1004.93,784.829C1012.44,806.382 1005.39,830.33 987.444,844.431C972.8,856.943 959.043,864.464 958.944,861.772C958.375,846.22 956.718,815.529 952.135,793.644C945.755,763.18 935.831,747.397 911.019,748.199C887.222,748.969 776.992,748.262 768.022,748.203C767.632,748.2 767.252,748.283 766.899,748.447C764.134,749.732 751.632,755.743 749.106,760.587C748.693,761.378 747.969,761.957 747.086,762.082L658.144,774.672C658.036,774.687 657.926,774.696 657.816,774.698L535.104,776.652C534.821,776.657 534.541,776.707 534.274,776.8L494.794,790.616C494.259,790.803 493.678,790.813 493.136,790.644L463.324,781.34C462.783,781.171 462.201,781.181 461.665,781.369L418.741,796.404C418.059,796.643 417.501,797.146 417.209,797.808C415.764,801.071 409.881,812.181 390.603,830.134C390.375,830.346 390.108,830.519 389.822,830.64L362.069,842.363C361.888,842.439 361.716,842.536 361.557,842.651L307.962,881.141C307.832,881.235 307.693,881.317 307.547,881.385L264.429,901.685C264.179,901.803 263.948,901.96 263.746,902.149L210.069,952.585C209.879,952.764 209.663,952.914 209.428,953.029L165.257,974.793C164.948,974.946 164.672,975.157 164.444,975.416L159.361,981.183C158.585,982.063 158.484,983.35 159.112,984.341L194.975,1040.94C195.726,1042.13 195.418,1043.69 194.274,1044.51L175.87,1057.58C174.68,1058.42 173.029,1058.14 172.186,1056.95L132.667,1001.02C131.786,999.777 130.035,999.535 128.85,1000.5L105.149,1019.69C104.793,1019.97 104.368,1020.16 103.917,1020.24L77.027,1024.67C76.854,1024.7 76.677,1024.71 76.501,1024.7L56.492,1023.97C56.104,1023.95 55.724,1023.86 55.379,1023.68L26.063,1008.55C25.266,1008.14 24.732,1007.36 24.645,1006.46L22.533,984.635C22.505,984.345 22.429,984.062 22.309,983.797L11.96,961.
|
|
|
|
|
<path d="M727.555,666.4L715.772,670.658L463.67,707.196L418.419,707.196L361.384,694.521C361.384,694.521 352.471,687.924 352.471,682.725C352.471,677.526 351.733,617.822 372.08,607.333C372.08,607.333 402.895,602.552 417.615,601.861C432.335,601.17 496.764,597.757 496.764,597.757L624.972,590.552L718.346,585.7C718.346,585.7 740.514,587.668 746.661,601.861C752.808,616.054 752.808,637.388 752.808,637.388C752.808,637.388 748.406,656.811 727.555,666.4M341.6,487.604L287.89,489.772L225.672,492.274L185.305,495.11L174.964,494.276L164.79,489.772L160.963,485.374C160.963,485.374 163.995,422.793 169.46,415.545C174.925,408.297 173.065,405.294 194.382,404.936C215.699,404.577 322.751,407.372 322.751,407.372C322.751,407.372 343.765,418.362 346.493,426.971C349.222,435.581 352.632,479.235 352.632,479.235C352.632,479.235 353.077,485.741 341.6,487.604M340.227,615.859C339.316,626.483 324.438,679.221 324.438,679.221C324.438,679.221 323.448,689.914 291.343,709.137C259.238,728.359 158.052,801.072 158.052,801.072C158.052,801.072 141.032,810.788 132.839,791.659L121.43,693.283C121.43,693.283 125.958,679.113 133.453,673.437C140.95,667.762 234.892,607.989 234.892,607.989L269.574,599.572L327.332,599.862C327.332,599.862 341.137,605.235 340.227,615.859M154.086,522.605C154.086,522.605 156.701,512.881 164.747,510.594L196.315,508.788L225.461,508.819C225.461,508.819 233.724,508.308 234.392,514.989C235.06,521.67 235.728,552.135 235.728,552.135L231.009,562.331L237.649,590.498L153.214,640.691C153.214,640.691 145.172,646.534 135.599,640.691L132.839,638.187L154.086,522.605ZM133.974,385.323C133.974,385.323 106.203,370.354 111.219,346.836C116.236,323.319 148.305,326.739 154.292,325.884C160.279,325.029 215.305,314.339 215.305,314.339C215.305,314.339 254.444,307.019 290.694,314.339L317.831,319.043L322.764,325.884C322.764,325.884 372.281,361.573 372.964,364.68C373.647,367.788 348.604,397.292 348.604,397.292L339.65,392.125L234.626,388.838L133.974,385.323ZM960.812,750.174C955.959,736.695 945.715,730.764 930.617,724.294C915.52,717.823 884.517,695.447 881.282,690.595C878.047,685.742 876.16,662.018 876.16,662.018L941.132,665.617C947.332,656.814 952.185,649.886 965.664,650.156C979.144,650.426 980.329,642.838 980.329,642.838L1025.9,497.041L905.176,471.507L828.258,486.25L822.737,524.244C822.737,524.244 824.938,539.354 828.442,548.79C831.947,558.225 844.348,557.686 844.348,557.686L864.568,559.573C864.568,559.573 920.104,560.113 934.392,560.851C948.68,561.59 964.586,567.931 971.595,576.194C978.605,584.458 976.265,593.811 976.265,593.811C974.734,638.294 915.251,637.388 915.251,637.388L853.245,635.868C853.245,635.868 815.772,639.911 792.683,637.388C769.595,634.864 769.46,626.68 769.46,626.68L769.46,613.127L766.457,591.227C761.626,571.39 741.203,569.328 741.203,569.328L694.863,571.271L433.782,585.617L411.785,581.951L400.975,572.174L403.141,560.907L392.185,545.854L384.477,551.306L370.847,480.146L364.528,430.979C365.485,418.631 360.257,408.031 359.295,406.218C358.334,404.405 354.325,400.534 354.325,400.534L385.835,364.904L326.945,321.659L328.868,319.03L329.695,307.93L339,305.655L345.41,301.106L363.209,291.106L385.835,262.439L397.868,243.11L397.776,237.58L393.261,232.973L400.524,204.266L401.323,189.08L396.341,176.799C396.341,176.799 389.864,166.628 387.657,161.427C385.45,156.225 369.3,140.815 369.3,140.815L369.3,136.71L388.413,124.833L388.595,120.844L395.394,120.663L393.557,110.37L387.135,110.509L387.362,113.89L380.951,121.507L381.886,124.471C381.886,124.471 369.284,131.452 366.654,132.267C364.025,133.083 361.116,136.53 361.116,136.53L346.012,140.568C346.012,140.568 286.897,159.839 282.991,160.906C279.084,161.972 247.053,163.745 247.053,163.745L247.313,160.906L291.324,150.985L297.289,147.659L290.434,135.599L271.518,134.583L263.691,123.525L232.839,136.53L224.917,126.245L211.757,132.755C198.597,139.266 189.24,133.016 189.24,133.016L160.073,116.214L151.492,128.762C151.492,128.762 156.688,134.318 166.844,147.659C177,161.001 197.094,179.122 197.094,179.122L205.938,186.113L231.466,191.686L253.742,190.781L349.995,169.171L359.373,169.171C371.511,171.415 375.363,180.585 378.615,191.686C3
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
<g id="eines" transform="matrix(1,0,0,1,83.2784,66.1766)">
|
|
|
|
|
<path d="M11.541,925.361L38.913,909.5L51.009,939.291L89.29,969.419L103.048,961.658L131.041,998.72L104.606,1020.12L76.766,1024.71L55.903,1023.95L24.785,1007.89L22.491,984.196L11.025,958.97L27.62,948.085C27.62,948.085 16.461,939.674 11.541,925.361Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g id="edifici-camping" transform="matrix(1,0,0,1,83.2784,66.1766)">
|
|
|
|
|
<g transform="matrix(0.825088,-0.565004,0.565004,0.825088,-456.158,258.83)">
|
|
|
|
|
<rect x="148.497" y="822.888" width="82.927" height="86.544" style="fill:rgb(255,174,138);stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-13 22:23:28 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g transform="matrix(0.825085,-0.565008,0.565008,0.825085,-482.232,279.177)">
|
|
|
|
|
<rect x="192.19" y="907.607" width="35.182" height="21.665" style="fill:rgb(255,174,138);stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M165.511,830.458L214.409,901.864" style="fill:none;fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<path d="M203.661,909.502L215.901,927.378" style="fill:none;fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g id="edifici_serveis" transform="matrix(1,0,0,1,83.2784,66.1766)">
|
|
|
|
|
<g id="area" transform="matrix(0.998857,-0.0478064,0.0478064,0.998857,-25.5781,15.1025)">
|
|
|
|
|
<rect x="247.224" y="511.984" width="111.428" height="60.589" style="fill:rgb(255,174,138);stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M301.493,512.086L304.383,572.471" style="fill:none;fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g id="casa" transform="matrix(1,0,0,1,83.2784,66.1766)">
|
|
|
|
|
<path id="area-casa" d="M40.815,828.643L110.756,820.085C110.756,820.085 118.883,816.662 117.718,808.532C116.552,800.402 102.432,697.672 102.432,697.672L104.606,688.729L58.076,681.303L22.963,676.871L21.019,697.672L17.471,742.81L15.968,770.224L15.516,787.805L15.755,800.932L16.114,805.656L16.61,812.931L16.569,827.21L15.753,841.483L40.815,828.643Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M68.267,793.594L34.288,787.828L47.634,715.186L81.613,720.951L68.267,793.594Z" style="fill:rgb(255,174,138);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M88.481,781.861L71.198,778.928L77.227,746.449L94.511,749.382L88.481,781.861Z" style="fill:rgb(255,174,138);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g id="piscina" transform="matrix(1,0,0,1,83.2784,66.1766)">
|
|
|
|
|
<path id="area_piscina" d="M207.628,789.553L322.781,713.2L336.288,709.884L367.652,714.506L364.904,729.115L404.053,786.348C404.053,786.348 351.398,815.995 273.332,880.897L238.534,853.311L207.628,789.553Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g id="piscina_gran" transform="matrix(0.839238,-0.543765,0.543765,0.839238,-386.747,279.154)">
|
|
|
|
|
<rect x="240.233" y="772.46" width="77.002" height="42.372" style="fill:rgb(189,246,255);stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g id="piscina_petita" transform="matrix(0.839249,-0.543747,0.543747,0.839249,-355.504,301.993)">
|
|
|
|
|
<rect x="318.189" y="736.298" width="29.624" height="31.906" style="fill:rgb(189,246,255);stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
<g id="parc" transform="matrix(1,0,0,1,83.2784,66.1766)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<path id="area-parc" d="M447.63,723.62L459.242,769.925L447.63,771.238L404.053,786.348L364.905,729.114L367.652,714.506L407.311,721.834C407.311,721.834 430.208,726.045 447.629,723.62L447.63,723.62Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g id="jocs_parc">
|
|
|
|
|
<g transform="matrix(0.960697,-0.277599,0.277599,0.960697,-192.821,147.731)">
|
|
|
|
|
<rect x="415.097" y="744.61" width="20.415" height="20.415" style="fill:none;stroke:rgb(0,170,125);stroke-width:1px;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(0.738319,-0.674452,0.674452,0.738319,-391.168,447.356)">
|
|
|
|
|
<rect x="377.217" y="724.069" width="7.405" height="7.407" style="fill:none;stroke:rgb(0,170,125);stroke-width:1px;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<path d="M378.497,725.123L383.339,730.424" style="fill:none;fill-rule:nonzero;stroke:rgb(0,170,125);stroke-width:1px;"/>
|
|
|
|
|
<path d="M378.267,730.194L383.568,725.352" style="fill:none;fill-rule:nonzero;stroke:rgb(0,170,125);stroke-width:1px;"/>
|
|
|
|
|
<g transform="matrix(0.707107,-0.707107,0.707107,0.707107,-401.832,496.758)">
|
|
|
|
|
<rect x="397.344" y="725.959" width="2.759" height="14.948" style="fill:none;stroke:rgb(0,170,125);stroke-width:1px;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<path d="M384.727,738.989L390.11,746.243" style="fill:none;fill-rule:nonzero;stroke:rgb(0,170,125);stroke-width:1px;"/>
|
|
|
|
|
<path d="M381.561,741.318L386.944,748.572" style="fill:none;fill-rule:nonzero;stroke:rgb(0,170,125);stroke-width:1px;"/>
|
|
|
|
|
<path d="M413.133,733.944L428.418,733.407" style="fill:none;fill-rule:nonzero;stroke:rgb(0,170,125);stroke-width:1px;"/>
|
|
|
|
|
<path d="M420.649,731.305L420.9,736.049" style="fill:none;fill-rule:nonzero;stroke:rgb(0,170,125);stroke-width:1px;"/>
|
|
|
|
|
<path d="M394.354,761.663L407.311,758.469" style="fill:none;fill-rule:nonzero;stroke:rgb(0,170,125);stroke-width:1px;"/>
|
|
|
|
|
<path d="M406.9,755.595L408.177,761.389" style="fill:none;fill-rule:nonzero;stroke:rgb(0,170,125);stroke-width:1px;"/>
|
|
|
|
|
<path d="M393.487,758.766L394.764,764.56" style="fill:none;fill-rule:nonzero;stroke:rgb(0,170,125);stroke-width:1px;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
<g id="parceles" transform="matrix(1,0,0,1,83.2784,66.1766)">
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_B2">
|
2024-01-14 20:36:03 +00:00
|
|
|
<path id="safaritent" d="M878.654,667.2C878.654,667.2 936.203,672.236 941.383,669.214C946.562,666.193 950.159,660.294 950.159,660.294C950.159,660.294 954.188,652.237 964.115,652.525C974.042,652.813 975.481,656.41 975.481,656.41L964.547,700.579L968.431,705.758L967.568,709.355L948.433,709.355C948.433,709.355 919.514,708.779 901.119,699.244C884.922,690.847 878.51,675.401 878.654,667.2Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,87.8359,-0.933839)">
|
|
|
|
|
<path d="M832.408,692.336L832.408,683.934L836.211,683.934C836.996,683.934 837.637,684.143 838.133,684.561C838.629,684.979 838.877,685.498 838.877,686.12C838.877,686.53 838.763,686.903 838.534,687.239C838.306,687.575 837.998,687.83 837.611,688.006C838.111,688.17 838.497,688.426 838.769,688.774C839.04,689.121 839.176,689.553 839.176,690.069C839.176,690.713 838.916,691.252 838.396,691.686C837.877,692.12 837.232,692.336 836.463,692.336L832.408,692.336ZM833.51,687.526L836.258,687.526C836.734,687.526 837.107,687.412 837.377,687.183C837.646,686.954 837.781,686.637 837.781,686.231C837.781,685.852 837.637,685.549 837.348,685.323C837.059,685.096 836.695,684.983 836.258,684.983L833.51,684.983L833.51,687.526ZM833.51,691.293L836.428,691.293C836.896,691.293 837.279,691.167 837.576,690.915C837.873,690.663 838.021,690.332 838.021,689.922C838.021,689.512 837.874,689.174 837.579,688.909C837.284,688.643 836.9,688.51 836.428,688.51L833.51,688.51L833.51,691.293Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-32.2703,87.3233)">
|
|
|
|
|
<path d="M875.649,601.715C876.29,601.383 876.733,601.135 876.979,600.971C877.315,600.748 877.569,600.5 877.741,600.227C877.913,599.954 877.999,599.629 877.999,599.254C877.999,598.727 877.825,598.303 877.477,597.983C877.13,597.663 876.661,597.502 876.071,597.502C875.536,597.502 875.09,597.667 874.732,597.997C874.375,598.328 874.196,598.725 874.196,599.19C874.196,599.674 874.352,600.112 874.665,600.502L873.774,601.077C873.352,600.526 873.142,599.922 873.142,599.266C873.142,598.508 873.418,597.869 873.971,597.347C874.523,596.826 875.239,596.565 876.118,596.565C877.02,596.565 877.734,596.808 878.26,597.294C878.785,597.781 879.048,598.416 879.048,599.202C879.048,599.87 878.881,600.426 878.547,600.871C878.213,601.317 877.694,601.717 876.991,602.073C876.507,602.33 876.091,602.559 875.743,602.758C875.454,602.922 875.205,603.121 874.996,603.356C874.787,603.59 874.661,603.842 874.618,604.112L879.06,604.112L879.06,605.084L873.323,605.084C873.323,604.534 873.419,604.044 873.61,603.617C873.802,603.189 874.062,602.828 874.393,602.533C874.723,602.238 875.142,601.965 875.649,601.715Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_B1">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M813.768,665.617L864.843,665.617L873.763,701.01L806.287,707.772L813.768,665.617Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M832.408,692.336L832.408,683.934L836.211,683.934C836.996,683.934 837.637,684.143 838.133,684.561C838.629,684.979 838.877,685.498 838.877,686.12C838.877,686.53 838.763,686.903 838.534,687.239C838.306,687.575 837.998,687.83 837.611,688.006C838.111,688.17 838.497,688.426 838.769,688.774C839.04,689.121 839.176,689.553 839.176,690.069C839.176,690.713 838.916,691.252 838.396,691.686C837.877,692.12 837.232,692.336 836.463,692.336L832.408,692.336ZM833.51,687.526L836.258,687.526C836.734,687.526 837.107,687.412 837.377,687.183C837.646,686.954 837.781,686.637 837.781,686.231C837.781,685.852 837.637,685.549 837.348,685.323C837.059,685.096 836.695,684.983 836.258,684.983L833.51,684.983L833.51,687.526ZM833.51,691.293L836.428,691.293C836.896,691.293 837.279,691.167 837.576,690.915C837.873,690.663 838.021,690.332 838.021,689.922C838.021,689.512 837.874,689.174 837.579,688.909C837.284,688.643 836.9,688.51 836.428,688.51L833.51,688.51L833.51,691.293Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M842.281,692.336L842.281,685.58C842.109,685.971 841.826,686.291 841.432,686.541C841.029,686.795 840.625,686.94 840.219,686.975L840.014,685.903C840.639,685.836 841.158,685.634 841.572,685.296C841.986,684.958 842.264,684.504 842.404,683.934L843.324,683.934L843.324,692.336L842.281,692.336Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_D4">
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M917.96,572.56L935.453,574.332L948.61,577.229L960.458,581.325L969.08,585.833L976.5,592.808L973.912,602.139L970.309,609.734L965.299,617.102L958.574,622.964L951.456,626.556L944.732,628.413L917.856,629.765L917.96,572.56Z" style="fill:rgb(239,237,236);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g>
|
|
|
|
|
<path d="M932.565,605.688L932.565,597.286L935.683,597.286C936.554,597.286 937.304,597.466 937.935,597.828C938.565,598.189 939.04,598.687 939.358,599.322C939.677,599.956 939.837,600.69 939.837,601.522C939.837,602.123 939.743,602.678 939.556,603.186C939.368,603.694 939.099,604.133 938.749,604.504C938.399,604.875 937.962,605.165 937.436,605.374C936.911,605.583 936.327,605.688 935.683,605.688L932.565,605.688ZM933.667,598.293L933.667,604.68L935.683,604.68C936.319,604.68 936.87,604.542 937.335,604.267C937.8,603.992 938.147,603.619 938.38,603.148C938.612,602.677 938.729,602.135 938.729,601.522C938.729,600.526 938.462,599.739 937.929,599.161C937.395,598.582 936.647,598.293 935.683,598.293L933.667,598.293Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M944.571,605.688L944.571,603.538L940.792,603.538L940.792,602.448C941.171,602.077 941.474,601.733 941.702,601.416C941.931,601.1 942.112,600.757 942.245,600.388C942.378,600.019 942.466,599.644 942.511,599.263C942.556,598.882 942.583,598.405 942.591,597.83L942.591,597.286L943.634,597.286L943.634,597.83C943.634,598.842 943.507,599.729 943.253,600.491C943.003,601.245 942.55,601.95 941.893,602.606L944.571,602.606L944.571,599.881L945.614,599.881L945.614,602.606L947.044,602.606L947.044,603.538L945.614,603.538L945.614,605.688L944.571,605.688Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_D3">
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M889.451,571.921L917.97,572.642L918.216,629.854L886.106,630.048L889.451,571.921Z" style="fill:rgb(239,237,236);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M898.028,605.261L898.028,596.859L901.145,596.859C902.017,596.859 902.768,597.039 903.398,597.401C904.029,597.762 904.504,598.26 904.822,598.895C905.141,599.53 905.3,600.263 905.3,601.095C905.3,601.697 905.206,602.251 905.019,602.759C904.831,603.267 904.562,603.706 904.213,604.078C903.863,604.449 903.426,604.739 902.9,604.948C902.375,605.157 901.79,605.261 901.145,605.261L898.028,605.261ZM899.13,597.867L899.13,604.253L901.145,604.253C901.782,604.253 902.333,604.116 902.798,603.84C903.263,603.565 903.611,603.192 903.844,602.721C904.076,602.25 904.192,601.708 904.192,601.095C904.192,600.099 903.926,599.312 903.393,598.734C902.859,598.156 902.11,597.867 901.145,597.867L899.13,597.867Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M906.085,602.958L907.081,602.513C907.155,603.091 907.379,603.552 907.752,603.896C908.125,604.24 908.601,604.412 909.179,604.412C909.722,604.412 910.182,604.239 910.559,603.893C910.935,603.547 911.124,603.099 911.124,602.548C911.124,601.958 910.951,601.496 910.605,601.16C910.26,600.824 909.798,600.656 909.22,600.656C908.989,600.656 908.767,600.693 908.552,600.767C908.337,600.841 908.159,600.943 908.019,601.072L907.415,600.328L910.251,597.831L906.442,597.831L906.442,596.859L911.833,596.859L911.833,597.656L909.208,599.923C909.345,599.896 909.491,599.882 909.647,599.882C910.085,599.882 910.492,599.984 910.869,600.187C911.246,600.39 911.555,600.693 911.795,601.095C912.035,601.497 912.155,601.958 912.155,602.478C912.155,603.337 911.874,604.036 911.311,604.573C910.749,605.11 910.038,605.378 909.179,605.378C908.366,605.378 907.686,605.158 907.137,604.716C906.588,604.275 906.237,603.689 906.085,602.958Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_D2">
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M857.397,571.297L853.493,629.727L886.522,629.833L889.4,571.851L857.397,571.297Z" style="fill:rgb(239,237,236);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M864.868,605.084L864.868,596.682L867.985,596.682C868.856,596.682 869.607,596.863 870.238,597.224C870.869,597.585 871.344,598.083 871.662,598.718C871.98,599.353 872.14,600.086 872.14,600.918C872.14,601.52 872.046,602.075 871.858,602.582C871.671,603.09 871.402,603.53 871.053,603.901C870.703,604.272 870.266,604.562 869.74,604.771C869.215,604.98 868.63,605.084 867.985,605.084L864.868,605.084ZM865.97,597.69L865.97,604.077L867.985,604.077C868.622,604.077 869.173,603.939 869.638,603.663C870.102,603.388 870.451,603.015 870.684,602.544C870.916,602.074 871.032,601.532 871.032,600.918C871.032,599.922 870.766,599.135 870.232,598.557C869.699,597.979 868.95,597.69 867.985,597.69L865.97,597.69Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M875.649,601.715C876.29,601.383 876.733,601.135 876.979,600.971C877.315,600.748 877.569,600.5 877.741,600.227C877.913,599.954 877.999,599.629 877.999,599.254C877.999,598.727 877.825,598.303 877.477,597.983C877.13,597.663 876.661,597.502 876.071,597.502C875.536,597.502 875.09,597.667 874.732,597.997C874.375,598.328 874.196,598.725 874.196,599.19C874.196,599.674 874.352,600.112 874.665,600.502L873.774,601.077C873.352,600.526 873.142,599.922 873.142,599.266C873.142,598.508 873.418,597.869 873.971,597.347C874.523,596.826 875.239,596.565 876.118,596.565C877.02,596.565 877.734,596.808 878.26,597.294C878.785,597.781 879.048,598.416 879.048,599.202C879.048,599.87 878.881,600.426 878.547,600.871C878.213,601.317 877.694,601.717 876.991,602.073C876.507,602.33 876.091,602.559 875.743,602.758C875.454,602.922 875.205,603.121 874.996,603.356C874.787,603.59 874.661,603.842 874.618,604.112L879.06,604.112L879.06,605.084L873.323,605.084C873.323,604.534 873.419,604.044 873.61,603.617C873.802,603.189 874.062,602.828 874.393,602.533C874.723,602.238 875.142,601.965 875.649,601.715Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_D1">
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M824.97,560.947L836.245,568.847L840.836,570.792L846.252,571.206L857.417,571.363L853.529,629.795L825.329,628.95L820.655,629.978L824.97,560.947Z" style="fill:rgb(239,237,236);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M834.154,604.763L834.154,596.361L837.271,596.361C838.143,596.361 838.894,596.541 839.524,596.903C840.155,597.264 840.63,597.762 840.948,598.397C841.267,599.032 841.426,599.765 841.426,600.597C841.426,601.199 841.332,601.753 841.144,602.261C840.957,602.769 840.688,603.208 840.339,603.58C839.989,603.951 839.552,604.241 839.026,604.45C838.501,604.659 837.916,604.763 837.271,604.763L834.154,604.763ZM835.256,597.369L835.256,603.755L837.271,603.755C837.908,603.755 838.459,603.618 838.924,603.342C839.389,603.067 839.737,602.694 839.97,602.223C840.202,601.752 840.318,601.21 840.318,600.597C840.318,599.601 840.052,598.814 839.518,598.236C838.985,597.658 838.236,597.369 837.271,597.369L835.256,597.369Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M844.478,604.763L844.478,598.007C844.307,598.398 844.023,598.718 843.629,598.968C843.227,599.222 842.822,599.367 842.416,599.402L842.211,598.329C842.836,598.263 843.355,598.061 843.769,597.723C844.184,597.385 844.461,596.931 844.602,596.361L845.521,596.361L845.521,604.763L844.478,604.763Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path id="limit_D" d="M820.675,630.258L824.914,560.852C824.914,560.852 837.099,570.918 842.751,571.095C848.402,571.272 911.096,572.41 911.096,572.41C911.096,572.41 959.311,571.801 976.265,592.641C976.265,592.641 972.026,625.843 941.901,628.623C913.075,631.282 833.744,629.198 833.744,629.198C833.744,629.198 823.677,627.962 820.675,630.258Z" style="fill:none;fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_97">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M385.775,90.277L387.362,113.89L380.951,121.507L345.658,125.824L342.992,126.84L327.377,96.117L385.775,90.277Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M350.153,110.319L351.173,110.014C351.224,110.604 351.419,111.054 351.759,111.365C352.099,111.675 352.56,111.83 353.142,111.83C353.817,111.83 354.353,111.542 354.75,110.966C355.146,110.39 355.347,109.573 355.351,108.514L355.339,108.086C355.151,108.575 354.856,108.962 354.454,109.249C354.052,109.537 353.587,109.68 353.06,109.68C352.231,109.68 351.562,109.422 351.053,108.907C350.543,108.391 350.288,107.752 350.288,106.991C350.288,106.577 350.36,106.193 350.505,105.839C350.649,105.486 350.847,105.187 351.097,104.943C351.347,104.699 351.643,104.507 351.984,104.369C352.326,104.23 352.692,104.161 353.083,104.161C354.2,104.161 355.017,104.561 355.532,105.362C356.052,106.159 356.311,107.19 356.311,108.455C356.311,108.928 356.274,109.375 356.2,109.797C356.126,110.219 356.005,110.615 355.837,110.984C355.669,111.353 355.462,111.67 355.216,111.936C354.97,112.202 354.665,112.412 354.302,112.566C353.938,112.72 353.532,112.797 353.083,112.797C352.27,112.797 351.602,112.562 351.076,112.091C350.551,111.621 350.243,111.03 350.153,110.319ZM354.964,106.92C354.964,106.393 354.792,105.957 354.448,105.614C354.116,105.27 353.681,105.098 353.142,105.098C352.61,105.098 352.175,105.274 351.835,105.625C351.499,105.973 351.331,106.416 351.331,106.955C351.331,107.498 351.499,107.932 351.835,108.256C352.171,108.58 352.606,108.743 353.142,108.743C353.673,108.743 354.109,108.574 354.451,108.236C354.793,107.898 354.964,107.459 354.964,106.92Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M356.862,104.278L362.335,104.278L362.335,105.133C360.491,106.399 359.569,108.262 359.569,110.723C359.569,111.301 359.618,111.954 359.716,112.68L358.573,112.68C358.503,112.129 358.468,111.561 358.468,110.975C358.468,108.584 359.276,106.676 360.894,105.25L356.862,105.25L356.862,104.278Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_98">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M457.123,80.882L453.061,105.13L447.855,118.714L395.424,120.111L389.584,89.642L457.123,80.882Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M413.52,104.609L414.54,104.304C414.591,104.894 414.786,105.344 415.126,105.655C415.466,105.965 415.927,106.121 416.509,106.121C417.185,106.121 417.721,105.832 418.117,105.256C418.514,104.68 418.714,103.863 418.718,102.804L418.706,102.376C418.519,102.865 418.224,103.252 417.821,103.539C417.419,103.827 416.954,103.97 416.427,103.97C415.599,103.97 414.93,103.712 414.42,103.197C413.91,102.681 413.655,102.042 413.655,101.281C413.655,100.867 413.727,100.483 413.872,100.129C414.017,99.776 414.214,99.477 414.464,99.233C414.714,98.989 415.01,98.797 415.352,98.659C415.693,98.52 416.06,98.451 416.45,98.451C417.567,98.451 418.384,98.851 418.899,99.652C419.419,100.449 419.679,101.48 419.679,102.746C419.679,103.218 419.642,103.665 419.567,104.087C419.493,104.509 419.372,104.905 419.204,105.274C419.036,105.643 418.829,105.96 418.583,106.226C418.337,106.492 418.032,106.702 417.669,106.856C417.306,107.01 416.899,107.087 416.45,107.087C415.638,107.087 414.969,106.852 414.443,106.381C413.918,105.911 413.61,105.32 413.52,104.609ZM418.331,101.21C418.331,100.683 418.159,100.247 417.815,99.904C417.483,99.56 417.048,99.388 416.509,99.388C415.977,99.388 415.542,99.564 415.202,99.915C414.866,100.263 414.698,100.706 414.698,101.246C414.698,101.788 414.866,102.222 415.202,102.546C415.538,102.871 415.974,103.033 416.509,103.033C417.04,103.033 417.477,102.864 417.818,102.526C418.16,102.188 418.331,101.749 418.331,101.21Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M420.669,104.568C420.669,104.04 420.814,103.572 421.105,103.162C421.396,102.751 421.8,102.464 422.315,102.3C421.53,101.941 421.138,101.369 421.138,100.583C421.138,99.982 421.371,99.476 421.838,99.066C422.305,98.656 422.911,98.451 423.657,98.451C424.399,98.451 425.005,98.656 425.474,99.066C425.942,99.476 426.177,99.982 426.177,100.583C426.177,101.369 425.784,101.941 424.999,102.3C425.515,102.464 425.918,102.751 426.209,103.162C426.5,103.572 426.645,104.04 426.645,104.568C426.645,104.908 426.579,105.229 426.446,105.532C426.313,105.834 426.123,106.102 425.875,106.334C425.627,106.567 425.312,106.75 424.932,106.885C424.551,107.02 424.126,107.087 423.657,107.087C423.188,107.087 422.763,107.02 422.38,106.885C421.997,106.75 421.683,106.567 421.436,106.334C421.19,106.102 421.001,105.834 420.868,105.532C420.735,105.229 420.669,104.908 420.669,104.568ZM425.614,104.451C425.614,103.962 425.434,103.564 425.072,103.255C424.711,102.947 424.239,102.792 423.657,102.792C423.075,102.792 422.603,102.947 422.242,103.255C421.881,103.564 421.7,103.962 421.7,104.451C421.7,104.955 421.876,105.359 422.227,105.663C422.579,105.968 423.056,106.121 423.657,106.121C424.259,106.121 424.735,105.968 425.087,105.663C425.438,105.359 425.614,104.955 425.614,104.451ZM425.169,100.636C425.169,100.269 425.029,99.969 424.75,99.737C424.471,99.504 424.106,99.388 423.657,99.388C423.208,99.388 422.844,99.504 422.564,99.737C422.285,99.969 422.145,100.269 422.145,100.636C422.145,101.027 422.283,101.338 422.559,101.571C422.834,101.803 423.2,101.919 423.657,101.919C424.114,101.919 424.48,101.803 424.756,101.571C425.031,101.338 425.169,101.027 425.169,100.636Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_96">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M323.696,96.878L338.803,129.124L297.29,147.659L290.434,135.599L271.518,134.583L264.536,122.903L280.659,113.128L323.696,96.878Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M303.963,123.429L304.983,123.124C305.034,123.714 305.229,124.164 305.569,124.475C305.909,124.785 306.37,124.94 306.952,124.94C307.627,124.94 308.164,124.652 308.56,124.076C308.957,123.5 309.157,122.683 309.161,121.624L309.149,121.196C308.961,121.684 308.666,122.072 308.264,122.359C307.862,122.646 307.397,122.79 306.87,122.79C306.041,122.79 305.373,122.532 304.863,122.017C304.353,121.501 304.098,120.862 304.098,120.1C304.098,119.686 304.17,119.303 304.315,118.949C304.459,118.596 304.657,118.297 304.907,118.053C305.157,117.808 305.453,117.617 305.794,117.478C306.136,117.34 306.502,117.27 306.893,117.27C308.01,117.27 308.827,117.671 309.342,118.472C309.862,119.268 310.122,120.3 310.122,121.565C310.122,122.038 310.084,122.485 310.01,122.907C309.936,123.329 309.815,123.725 309.647,124.094C309.479,124.463 309.272,124.78 309.026,125.046C308.78,125.311 308.475,125.521 308.112,125.676C307.748,125.83 307.342,125.907 306.893,125.907C306.081,125.907 305.412,125.672 304.886,125.201C304.361,124.73 304.053,124.14 303.963,123.429ZM308.774,120.03C308.774,119.503 308.602,119.067 308.258,118.724C307.926,118.38 307.491,118.208 306.952,118.208C306.42,118.208 305.985,118.384 305.645,118.735C305.309,119.083 305.141,119.526 305.141,120.065C305.141,120.608 305.309,121.042 305.645,121.366C305.981,121.69 306.416,121.852 306.952,121.852C307.483,121.852 307.919,121.683 308.261,121.346C308.603,121.008 308.774,120.569 308.774,120.03Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M311.1,121.647C311.1,121.03 311.17,120.459 311.311,119.933C311.452,119.408 311.655,118.946 311.92,118.548C312.186,118.149 312.529,117.837 312.949,117.61C313.369,117.384 313.844,117.27 314.375,117.27C315.157,117.27 315.786,117.47 316.262,117.868C316.739,118.267 317.026,118.811 317.124,119.503L316.139,119.802C315.983,118.739 315.375,118.208 314.317,118.208C314.016,118.208 313.736,118.277 313.476,118.416C313.216,118.555 312.986,118.758 312.785,119.025C312.583,119.293 312.424,119.645 312.307,120.083C312.19,120.52 312.131,121.018 312.131,121.577L312.131,121.747C312.331,121.345 312.644,121.018 313.072,120.766C313.499,120.514 313.954,120.388 314.434,120.388C314.957,120.388 315.427,120.509 315.843,120.751C316.259,120.993 316.579,121.316 316.801,121.721C317.024,122.125 317.135,122.569 317.135,123.054C317.135,123.893 316.871,124.579 316.341,125.11C315.812,125.642 315.141,125.907 314.329,125.907C313.805,125.907 313.337,125.802 312.925,125.591C312.513,125.38 312.174,125.085 311.909,124.706C311.643,124.327 311.442,123.879 311.305,123.361C311.168,122.844 311.1,122.272 311.1,121.647ZM316.104,123.147C316.104,122.6 315.929,122.16 315.58,121.826C315.23,121.492 314.78,121.325 314.229,121.325C313.733,121.325 313.309,121.495 312.957,121.835C312.606,122.175 312.43,122.6 312.43,123.112C312.43,123.655 312.606,124.096 312.957,124.433C313.309,124.771 313.758,124.94 314.305,124.94C314.832,124.94 315.264,124.773 315.6,124.439C315.936,124.105 316.104,123.675 316.104,123.147Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_95">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M201.851,187.52L191.658,219.595L187.716,218.236L149.797,171.89L177.455,164.823L180.037,167.813L177.591,170.123L192.133,184.394L195.395,181.54L201.851,187.52Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,0,0.0364755)">
|
|
|
|
|
<path d="M175.938,194.019L176.958,193.714C177.009,194.304 177.204,194.754 177.544,195.065C177.884,195.375 178.345,195.531 178.927,195.531C179.602,195.531 180.139,195.243 180.535,194.666C180.932,194.09 181.132,193.273 181.136,192.214L181.124,191.787C180.936,192.275 180.642,192.663 180.239,192.95C179.837,193.237 179.372,193.38 178.845,193.38C178.017,193.38 177.348,193.122 176.838,192.607C176.328,192.091 176.073,191.453 176.073,190.691C176.073,190.277 176.145,189.893 176.29,189.539C176.435,189.186 176.632,188.887 176.882,188.643C177.132,188.399 177.428,188.207 177.769,188.069C178.111,187.93 178.478,187.861 178.868,187.861C179.985,187.861 180.802,188.261 181.317,189.062C181.837,189.859 182.097,190.89 182.097,192.156C182.097,192.628 182.06,193.076 181.985,193.497C181.911,193.919 181.79,194.315 181.622,194.684C181.454,195.053 181.247,195.371 181.001,195.636C180.755,195.902 180.45,196.112 180.087,196.266C179.724,196.42 179.317,196.497 178.868,196.497C178.056,196.497 177.387,196.262 176.861,195.791C176.336,195.321 176.028,194.73 175.938,194.019ZM180.749,190.621C180.749,190.093 180.577,189.658 180.233,189.314C179.901,188.97 179.466,188.798 178.927,188.798C178.395,188.798 177.96,188.974 177.62,189.326C177.284,189.673 177.116,190.117 177.116,190.656C177.116,191.199 177.284,191.632 177.62,191.956C177.956,192.281 178.392,192.443 178.927,192.443C179.458,192.443 179.894,192.274 180.236,191.936C180.578,191.598 180.749,191.16 180.749,190.621Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.156349,-164.614)">
|
|
|
|
|
<path d="M186.728,361.03L186.728,358.88L182.949,358.88L182.949,357.79C183.328,357.419 183.631,357.075 183.86,356.759C184.088,356.442 184.269,356.1 184.402,355.73C184.535,355.361 184.623,354.986 184.668,354.605C184.713,354.225 184.74,353.747 184.748,353.173L184.748,352.628L185.79,352.628L185.79,353.173C185.79,354.184 185.664,355.071 185.41,355.833C185.16,356.587 184.706,357.292 184.05,357.948L186.728,357.948L186.728,355.224L187.771,355.224L187.771,357.948L189.201,357.948L189.201,358.88L187.771,358.88L187.771,361.03L186.728,361.03Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_93">
|
Add a polygon around each accommodation on the public map
I can not use <a> in that map because Leaflet handles the mouse over
before the anchors sees it, thus it is impossible to click on them; i
have to use a Leaflet layer.
Fortunately, i can just use the <path>’s coordinates as
the polygon points, because with CRS.Simple the coordinates map to
pixel, except for the reversed Y/latitude coordinate. Unfortunately,
<path> coordinates are not straightforward to get: I have to follow the
drawing coordinates, taking into account the current transformation
(CTM), and keeping the last point around for relative coordinates.
Bézier curves are simplified to a straight line from start to end.
There is one single accommodation that started with a relative move
command (m), which apparently have to be treated as an absolute
move (M), but subsequent pairs are treated as relative coordinates[0].
It was easier for me to convert that relative move to absolute and add
a relative lineto command (l) to the next pair.
For now, all i do is highlight the accommodation and zoom it on click,
because i do not know how i should the accommodation’s information.
[0]: https://www.w3.org/TR/SVG11/paths.html#PathDataMovetoCommands
2024-01-25 03:28:51 +00:00
|
|
|
<path d="M 205.22991,189.4224 l 10.03493,3.534 18.2341,2.351 30.94188,-4.546 -0.70438,28.184 -30.99376,-0.648 -35.62613,1.214 z" style="fill:rgb(239,237,236);stroke:rgb(82,84,83);stroke-width:1px;stroke-miterlimit:2;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,-13.4495,0.21286)">
|
|
|
|
|
<path d="M240.23,208.399L241.25,208.094C241.301,208.684 241.496,209.134 241.836,209.445C242.176,209.755 242.637,209.911 243.219,209.911C243.894,209.911 244.431,209.622 244.827,209.046C245.224,208.47 245.424,207.653 245.428,206.594L245.416,206.166C245.228,206.655 244.934,207.042 244.531,207.33C244.129,207.617 243.664,207.76 243.137,207.76C242.309,207.76 241.64,207.502 241.13,206.987C240.62,206.471 240.365,205.832 240.365,205.071C240.365,204.657 240.437,204.273 240.582,203.919C240.727,203.566 240.924,203.267 241.174,203.023C241.424,202.779 241.72,202.587 242.061,202.449C242.403,202.31 242.769,202.241 243.16,202.241C244.277,202.241 245.094,202.641 245.609,203.442C246.129,204.239 246.389,205.27 246.389,206.536C246.389,207.008 246.352,207.455 246.277,207.877C246.203,208.299 246.082,208.695 245.914,209.064C245.746,209.433 245.539,209.75 245.293,210.016C245.047,210.282 244.742,210.492 244.379,210.646C244.016,210.8 243.609,210.877 243.16,210.877C242.348,210.877 241.679,210.642 241.153,210.171C240.628,209.701 240.32,209.11 240.23,208.399ZM245.041,205C245.041,204.473 244.869,204.038 244.525,203.694C244.193,203.35 243.758,203.178 243.219,203.178C242.687,203.178 242.252,203.354 241.912,203.705C241.576,204.053 241.408,204.496 241.408,205.036C241.408,205.579 241.576,206.012 241.912,206.336C242.248,206.661 242.684,206.823 243.219,206.823C243.75,206.823 244.186,206.654 244.528,206.316C244.87,205.978 245.041,205.539 245.041,205Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M247.139,208.457L248.135,208.012C248.209,208.59 248.433,209.051 248.806,209.395C249.179,209.739 249.654,209.911 250.232,209.911C250.775,209.911 251.235,209.738 251.612,209.392C251.989,209.046 252.178,208.598 252.178,208.047C252.178,207.457 252.005,206.995 251.659,206.659C251.313,206.323 250.852,206.155 250.273,206.155C250.043,206.155 249.82,206.192 249.605,206.266C249.391,206.34 249.213,206.442 249.072,206.571L248.469,205.827L251.305,203.33L247.496,203.33L247.496,202.358L252.887,202.358L252.887,203.155L250.262,205.422C250.398,205.395 250.545,205.381 250.701,205.381C251.139,205.381 251.546,205.483 251.923,205.686C252.3,205.889 252.608,206.192 252.849,206.594C253.089,206.996 253.209,207.457 253.209,207.977C253.209,208.836 252.928,209.535 252.365,210.072C251.803,210.609 251.092,210.877 250.232,210.877C249.42,210.877 248.739,210.657 248.19,210.215C247.642,209.774 247.291,209.188 247.139,208.457Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_92">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M276.195,188.471L305.688,182.763L308.678,184.258L308.678,212.392L272.525,218.915L263.691,218.915L264.371,194.043L276.195,190.781L276.195,188.471Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M277.425,203.359L278.445,203.054C278.496,203.644 278.691,204.094 279.031,204.405C279.371,204.715 279.831,204.871 280.414,204.871C281.089,204.871 281.625,204.582 282.022,204.006C282.418,203.43 282.619,202.613 282.623,201.554L282.611,201.126C282.423,201.615 282.128,202.002 281.726,202.289C281.324,202.577 280.859,202.72 280.331,202.72C279.503,202.72 278.834,202.462 278.325,201.947C277.815,201.431 277.56,200.792 277.56,200.031C277.56,199.617 277.632,199.233 277.777,198.879C277.921,198.526 278.119,198.227 278.369,197.983C278.619,197.739 278.914,197.547 279.256,197.409C279.598,197.27 279.964,197.201 280.355,197.201C281.472,197.201 282.289,197.601 282.804,198.402C283.324,199.199 283.583,200.23 283.583,201.496C283.583,201.968 283.546,202.415 283.472,202.837C283.398,203.259 283.277,203.655 283.109,204.024C282.941,204.393 282.734,204.71 282.488,204.976C282.242,205.242 281.937,205.452 281.574,205.606C281.21,205.76 280.804,205.837 280.355,205.837C279.542,205.837 278.873,205.602 278.348,205.131C277.823,204.661 277.515,204.07 277.425,203.359ZM282.236,199.96C282.236,199.433 282.064,198.997 281.72,198.654C281.388,198.31 280.953,198.138 280.414,198.138C279.882,198.138 279.447,198.314 279.107,198.665C278.771,199.013 278.603,199.456 278.603,199.996C278.603,200.538 278.771,200.972 279.107,201.296C279.443,201.621 279.878,201.783 280.414,201.783C280.945,201.783 281.381,201.614 281.723,201.276C282.065,200.938 282.236,200.499 282.236,199.96Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M287.058,202.351C287.699,202.019 288.142,201.771 288.388,201.607C288.724,201.384 288.978,201.136 289.15,200.863C289.322,200.589 289.408,200.265 289.408,199.89C289.408,199.363 289.234,198.939 288.886,198.619C288.539,198.298 288.07,198.138 287.48,198.138C286.945,198.138 286.498,198.303 286.141,198.633C285.784,198.963 285.605,199.361 285.605,199.826C285.605,200.31 285.761,200.747 286.074,201.138L285.183,201.712C284.761,201.162 284.55,200.558 284.55,199.902C284.55,199.144 284.827,198.504 285.379,197.983C285.932,197.461 286.648,197.201 287.527,197.201C288.429,197.201 289.143,197.444 289.668,197.93C290.194,198.416 290.457,199.052 290.457,199.837C290.457,200.505 290.29,201.062 289.956,201.507C289.622,201.953 289.103,202.353 288.4,202.708C287.915,202.966 287.499,203.195 287.152,203.394C286.863,203.558 286.614,203.757 286.405,203.992C286.196,204.226 286.07,204.478 286.027,204.747L290.468,204.747L290.468,205.72L284.732,205.72C284.732,205.169 284.828,204.68 285.019,204.252C285.21,203.825 285.471,203.463 285.801,203.168C286.131,202.873 286.55,202.601 287.058,202.351Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_91">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M308.678,212.392L349.995,212.392L339.938,172.57L316.289,178.006L311.532,184.394L308.678,184.258L308.678,212.392Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M323.591,198.339L324.611,198.034C324.662,198.624 324.857,199.074 325.197,199.385C325.537,199.695 325.998,199.85 326.58,199.85C327.255,199.85 327.791,199.562 328.188,198.986C328.584,198.41 328.785,197.593 328.789,196.534L328.777,196.106C328.589,196.595 328.294,196.982 327.892,197.269C327.49,197.557 327.025,197.7 326.498,197.7C325.669,197.7 325,197.442 324.491,196.927C323.981,196.411 323.726,195.772 323.726,195.011C323.726,194.597 323.798,194.213 323.943,193.859C324.087,193.506 324.285,193.207 324.535,192.963C324.785,192.719 325.081,192.527 325.422,192.389C325.764,192.25 326.13,192.181 326.521,192.181C327.638,192.181 328.455,192.581 328.97,193.382C329.49,194.179 329.749,195.21 329.749,196.475C329.749,196.948 329.712,197.395 329.638,197.817C329.564,198.239 329.443,198.635 329.275,199.004C329.107,199.373 328.9,199.69 328.654,199.956C328.408,200.222 328.103,200.432 327.74,200.586C327.376,200.74 326.97,200.817 326.521,200.817C325.708,200.817 325.04,200.582 324.514,200.111C323.989,199.641 323.681,199.05 323.591,198.339ZM328.402,194.94C328.402,194.413 328.23,193.977 327.886,193.634C327.554,193.29 327.119,193.118 326.58,193.118C326.048,193.118 325.613,193.294 325.273,193.645C324.937,193.993 324.769,194.436 324.769,194.975C324.769,195.518 324.937,195.952 325.273,196.276C325.609,196.6 326.044,196.763 326.58,196.763C327.111,196.763 327.547,196.594 327.889,196.256C328.231,195.918 328.402,195.479 328.402,194.94Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M332.767,200.7L332.767,193.944C332.595,194.335 332.312,194.655 331.917,194.905C331.515,195.159 331.111,195.304 330.705,195.339L330.499,194.266C331.124,194.2 331.644,193.998 332.058,193.66C332.472,193.322 332.749,192.868 332.89,192.298L333.81,192.298L333.81,200.7L332.767,200.7Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_90">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M339.938,172.569L349.995,212.391L359.373,212.391L371.47,208.042L372.965,194.587L371.741,183.714L366.985,173.255L359.373,169.171L349.995,169.171L339.938,172.569Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M352.455,193.179L353.474,192.874C353.525,193.464 353.72,193.914 354.06,194.225C354.4,194.535 354.861,194.69 355.443,194.69C356.119,194.69 356.655,194.402 357.051,193.826C357.448,193.25 357.648,192.433 357.652,191.374L357.64,190.946C357.453,191.434 357.158,191.822 356.755,192.109C356.353,192.396 355.888,192.54 355.361,192.54C354.533,192.54 353.864,192.282 353.354,191.767C352.844,191.251 352.589,190.612 352.589,189.85C352.589,189.436 352.662,189.053 352.806,188.699C352.951,188.346 353.148,188.047 353.398,187.803C353.648,187.559 353.944,187.367 354.286,187.228C354.627,187.09 354.994,187.02 355.384,187.02C356.501,187.02 357.318,187.421 357.833,188.222C358.353,189.018 358.613,190.05 358.613,191.315C358.613,191.788 358.576,192.235 358.501,192.657C358.427,193.079 358.306,193.475 358.138,193.844C357.97,194.213 357.763,194.53 357.517,194.796C357.271,195.061 356.966,195.271 356.603,195.426C356.24,195.58 355.833,195.657 355.384,195.657C354.572,195.657 353.903,195.422 353.377,194.951C352.852,194.48 352.544,193.89 352.455,193.179ZM357.265,189.78C357.265,189.253 357.093,188.817 356.749,188.474C356.417,188.13 355.982,187.958 355.443,187.958C354.912,187.958 354.476,188.134 354.136,188.485C353.8,188.833 353.632,189.276 353.632,189.815C353.632,190.358 353.8,190.792 354.136,191.116C354.472,191.44 354.908,191.602 355.443,191.602C355.974,191.602 356.411,191.434 356.752,191.096C357.094,190.758 357.265,190.319 357.265,189.78Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M360.505,194.482C359.896,193.699 359.591,192.651 359.591,191.339C359.591,190.026 359.896,188.978 360.505,188.195C361.115,187.412 361.929,187.02 362.949,187.02C363.976,187.02 364.795,187.411 365.407,188.192C366.018,188.974 366.324,190.022 366.324,191.339C366.324,192.655 366.018,193.704 365.407,194.485C364.795,195.267 363.976,195.657 362.949,195.657C361.929,195.657 361.115,195.266 360.505,194.482ZM365.281,191.339C365.281,190.35 365.076,189.538 364.665,188.901C364.275,188.272 363.703,187.958 362.949,187.958C362.21,187.958 361.64,188.272 361.238,188.901C360.828,189.538 360.623,190.35 360.623,191.339C360.623,192.327 360.828,193.14 361.238,193.776C361.644,194.409 362.214,194.725 362.949,194.725C363.699,194.725 364.271,194.409 364.665,193.776C365.076,193.14 365.281,192.327 365.281,191.339Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_89">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M444.223,173.255L405.333,172.794L396.578,163.855L379.989,151.69L369.299,140.816L399.711,141.461L446.316,138.88L444.223,173.255Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M418.825,155.948C418.825,155.42 418.971,154.952 419.262,154.541C419.553,154.131 419.956,153.844 420.472,153.68C419.686,153.321 419.294,152.748 419.294,151.963C419.294,151.362 419.527,150.856 419.994,150.446C420.461,150.036 421.067,149.83 421.813,149.83C422.556,149.83 423.161,150.036 423.63,150.446C424.099,150.856 424.333,151.362 424.333,151.963C424.333,152.748 423.94,153.321 423.155,153.68C423.671,153.844 424.074,154.131 424.365,154.541C424.656,154.952 424.802,155.42 424.802,155.948C424.802,156.288 424.735,156.609 424.603,156.912C424.47,157.214 424.279,157.482 424.031,157.714C423.783,157.947 423.469,158.13 423.088,158.265C422.707,158.4 422.282,158.467 421.813,158.467C421.345,158.467 420.919,158.4 420.536,158.265C420.153,158.13 419.839,157.947 419.593,157.714C419.347,157.482 419.157,157.214 419.024,156.912C418.892,156.609 418.825,156.288 418.825,155.948ZM423.77,155.83C423.77,155.342 423.59,154.944 423.228,154.635C422.867,154.327 422.395,154.172 421.813,154.172C421.231,154.172 420.76,154.327 420.398,154.635C420.037,154.944 419.856,155.342 419.856,155.83C419.856,156.334 420.032,156.739 420.384,157.043C420.735,157.348 421.212,157.5 421.813,157.5C422.415,157.5 422.892,157.348 423.243,157.043C423.595,156.739 423.77,156.334 423.77,155.83ZM423.325,152.016C423.325,151.649 423.186,151.349 422.906,151.117C422.627,150.884 422.263,150.768 421.813,150.768C421.364,150.768 421,150.884 420.721,151.117C420.441,151.349 420.302,151.649 420.302,152.016C420.302,152.407 420.439,152.718 420.715,152.951C420.99,153.183 421.356,153.299 421.813,153.299C422.27,153.299 422.637,153.183 422.912,152.951C423.187,152.718 423.325,152.407 423.325,152.016Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M425.804,155.989L426.823,155.684C426.874,156.274 427.069,156.724 427.409,157.035C427.749,157.345 428.21,157.5 428.792,157.5C429.468,157.5 430.004,157.212 430.4,156.636C430.797,156.06 430.997,155.243 431.001,154.184L430.989,153.756C430.802,154.245 430.507,154.632 430.104,154.919C429.702,155.206 429.237,155.35 428.71,155.35C427.882,155.35 427.213,155.092 426.703,154.577C426.193,154.061 425.938,153.422 425.938,152.661C425.938,152.246 426.011,151.863 426.155,151.509C426.3,151.156 426.497,150.857 426.747,150.613C426.997,150.369 427.293,150.177 427.635,150.038C427.977,149.9 428.343,149.83 428.733,149.83C429.851,149.83 430.667,150.231 431.183,151.032C431.702,151.829 431.962,152.86 431.962,154.125C431.962,154.598 431.925,155.045 431.851,155.467C431.776,155.889 431.655,156.285 431.487,156.654C431.319,157.023 431.112,157.34 430.866,157.606C430.62,157.871 430.315,158.081 429.952,158.236C429.589,158.39 429.183,158.467 428.733,158.467C427.921,158.467 427.252,158.232 426.727,157.761C426.201,157.29 425.894,156.7 425.804,155.989ZM430.614,152.59C430.614,152.063 430.442,151.627 430.099,151.284C429.767,150.94 429.331,150.768 428.792,150.768C428.261,150.768 427.825,150.944 427.485,151.295C427.149,151.643 426.981,152.086 426.981,152.625C426.981,153.168 427.149,153.602 427.485,153.926C427.821,154.25 428.257,154.413 428.792,154.413C429.323,154.413 429.76,154.244 430.102,153.906C430.443,153.568 430.614,153.129 430.614,152.59Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_86">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M116.558,173.075L138.911,198.835L98.225,239.446L78.267,228.771L76.178,211.598L60.862,182.763L116.558,173.075Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,41.704,-135.334)">
|
|
|
|
|
<path d="M59.712,335.198C59.712,334.58 59.783,334.009 59.923,333.484C60.064,332.958 60.267,332.496 60.533,332.098C60.798,331.7 61.141,331.387 61.561,331.161C61.981,330.934 62.457,330.821 62.988,330.821C63.769,330.821 64.398,331.02 64.874,331.418C65.351,331.817 65.638,332.362 65.736,333.053L64.751,333.352C64.595,332.289 63.988,331.758 62.929,331.758C62.628,331.758 62.348,331.828 62.088,331.966C61.829,332.105 61.598,332.308 61.397,332.576C61.196,332.843 61.037,333.196 60.919,333.633C60.802,334.071 60.744,334.569 60.744,335.127L60.744,335.297C60.943,334.895 61.256,334.568 61.684,334.316C62.112,334.064 62.566,333.938 63.046,333.938C63.57,333.938 64.039,334.059 64.456,334.301C64.872,334.543 65.191,334.867 65.414,335.271C65.636,335.675 65.747,336.12 65.747,336.604C65.747,337.444 65.483,338.129 64.954,338.661C64.424,339.192 63.753,339.457 62.941,339.457C62.417,339.457 61.95,339.352 61.538,339.141C61.125,338.93 60.787,338.635 60.521,338.256C60.255,337.877 60.054,337.429 59.917,336.912C59.781,336.394 59.712,335.823 59.712,335.198ZM64.716,336.698C64.716,336.151 64.541,335.71 64.192,335.376C63.842,335.042 63.392,334.875 62.841,334.875C62.345,334.875 61.921,335.045 61.57,335.385C61.218,335.725 61.042,336.151 61.042,336.662C61.042,337.205 61.218,337.646 61.57,337.984C61.921,338.322 62.371,338.491 62.917,338.491C63.445,338.491 63.876,338.324 64.212,337.99C64.548,337.656 64.716,337.225 64.716,336.698Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-110.319,-57.784)">
|
|
|
|
|
<g>
|
|
|
|
|
<g>
|
|
|
|
|
<path d="M204.67,259.388C204.67,258.86 204.815,258.392 205.106,257.981C205.397,257.571 205.801,257.284 206.316,257.12C205.531,256.761 205.139,256.188 205.139,255.403C205.139,254.802 205.372,254.296 205.839,253.886C206.306,253.475 206.912,253.27 207.658,253.27C208.4,253.27 209.006,253.475 209.475,253.886C209.943,254.296 210.178,254.802 210.178,255.403C210.178,256.188 209.785,256.761 209,257.12C209.516,257.284 209.919,257.571 210.21,257.981C210.501,258.392 210.646,258.86 210.646,259.388C210.646,259.727 210.58,260.049 210.447,260.351C210.314,260.654 210.124,260.922 209.876,261.154C209.628,261.387 209.313,261.57 208.933,261.705C208.552,261.84 208.127,261.907 207.658,261.907C207.189,261.907 206.764,261.84 206.381,261.705C205.998,261.57 205.684,261.387 205.437,261.154C205.191,260.922 205.002,260.654 204.869,260.351C204.736,260.049 204.67,259.727 204.67,259.388ZM209.615,259.27C209.615,258.782 209.435,258.384 209.073,258.075C208.712,257.767 208.24,257.612 207.658,257.612C207.076,257.612 206.604,257.767 206.243,258.075C205.882,258.384 205.701,258.782 205.701,259.27C205.701,259.774 205.877,260.179 206.228,260.483C206.58,260.788 207.057,260.94 207.658,260.94C208.26,260.94 208.736,260.788 209.088,260.483C209.439,260.179 209.615,259.774 209.615,259.27ZM209.17,255.456C209.17,255.089 209.03,254.789 208.751,254.557C208.472,254.324 208.107,254.208 207.658,254.208C207.209,254.208 206.845,254.324 206.565,254.557C206.286,254.789 206.146,255.089 206.146,255.456C206.146,255.847 206.284,256.158 206.56,256.391C206.835,256.623 207.201,256.739 207.658,256.739C208.115,256.739 208.481,256.623 208.757,256.391C209.032,256.158 209.17,255.847 209.17,255.456Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
2023-12-13 22:23:28 +00:00
|
|
|
</g>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_85">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M138.911,198.835L167.845,230.396L182.569,240.839L183.625,270.312L98.224,239.447L138.911,198.835Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-29.2663,-118.954)">
|
|
|
|
|
<path d="M181.642,352.628L181.642,353.601L177.347,353.601C177.347,354.409 177.248,355.309 177.048,356.302C177.302,356.009 177.622,355.775 178.006,355.601C178.391,355.428 178.808,355.341 179.257,355.341C180.054,355.341 180.715,355.589 181.241,356.085C181.766,356.581 182.029,357.249 182.029,358.089C182.029,358.995 181.749,359.731 181.188,360.298C180.627,360.864 179.878,361.147 178.941,361.147C178.152,361.147 177.476,360.936 176.914,360.515C176.355,360.085 176.023,359.474 175.917,358.681L176.925,358.388C177.019,358.966 177.236,359.409 177.576,359.718C177.915,360.026 178.371,360.181 178.941,360.181C179.574,360.181 180.072,359.999 180.435,359.636C180.798,359.272 180.98,358.798 180.98,358.212C180.98,357.626 180.81,357.157 180.47,356.806C180.13,356.454 179.646,356.278 179.017,356.278C178.611,356.278 178.229,356.385 177.872,356.598C177.514,356.81 177.263,357.075 177.119,357.392L176.017,357.14C176.255,355.581 176.374,354.077 176.374,352.628L181.642,352.628Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,-65.3229,-19.7515)">
|
|
|
|
|
<g>
|
|
|
|
|
<path d="M204.67,259.388C204.67,258.86 204.815,258.392 205.106,257.981C205.397,257.571 205.801,257.284 206.316,257.12C205.531,256.761 205.139,256.188 205.139,255.403C205.139,254.802 205.372,254.296 205.839,253.886C206.306,253.475 206.912,253.27 207.658,253.27C208.4,253.27 209.006,253.475 209.475,253.886C209.943,254.296 210.178,254.802 210.178,255.403C210.178,256.188 209.785,256.761 209,257.12C209.516,257.284 209.919,257.571 210.21,257.981C210.501,258.392 210.646,258.86 210.646,259.388C210.646,259.727 210.58,260.049 210.447,260.351C210.314,260.654 210.124,260.922 209.876,261.154C209.628,261.387 209.313,261.57 208.933,261.705C208.552,261.84 208.127,261.907 207.658,261.907C207.189,261.907 206.764,261.84 206.381,261.705C205.998,261.57 205.684,261.387 205.437,261.154C205.191,260.922 205.002,260.654 204.869,260.351C204.736,260.049 204.67,259.727 204.67,259.388ZM209.615,259.27C209.615,258.782 209.435,258.384 209.073,258.075C208.712,257.767 208.24,257.612 207.658,257.612C207.076,257.612 206.604,257.767 206.243,258.075C205.882,258.384 205.701,258.782 205.701,259.27C205.701,259.774 205.877,260.179 206.228,260.483C206.58,260.788 207.057,260.94 207.658,260.94C208.26,260.94 208.736,260.788 209.088,260.483C209.439,260.179 209.615,259.774 209.615,259.27ZM209.17,255.456C209.17,255.089 209.03,254.789 208.751,254.557C208.472,254.324 208.107,254.208 207.658,254.208C207.209,254.208 206.845,254.324 206.565,254.557C206.286,254.789 206.146,255.089 206.146,255.456C206.146,255.847 206.284,256.158 206.56,256.391C206.835,256.623 207.201,256.739 207.658,256.739C208.115,256.739 208.481,256.623 208.757,256.391C209.032,256.158 209.17,255.847 209.17,255.456Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
2023-12-13 22:23:28 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_83">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M182.569,240.839L183.625,270.312L197.094,274.953L220.988,274.953L226.557,277.506L240.946,274.953L240.946,241.767L182.569,240.839Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-13 22:23:28 +00:00
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M204.67,259.388C204.67,258.86 204.815,258.392 205.106,257.981C205.397,257.571 205.801,257.284 206.316,257.12C205.531,256.761 205.139,256.188 205.139,255.403C205.139,254.802 205.372,254.296 205.839,253.886C206.306,253.475 206.912,253.27 207.658,253.27C208.4,253.27 209.006,253.475 209.475,253.886C209.943,254.296 210.178,254.802 210.178,255.403C210.178,256.188 209.785,256.761 209,257.12C209.516,257.284 209.919,257.571 210.21,257.981C210.501,258.392 210.646,258.86 210.646,259.388C210.646,259.727 210.58,260.049 210.447,260.351C210.314,260.654 210.124,260.922 209.876,261.154C209.628,261.387 209.313,261.57 208.933,261.705C208.552,261.84 208.127,261.907 207.658,261.907C207.189,261.907 206.764,261.84 206.381,261.705C205.998,261.57 205.684,261.387 205.437,261.154C205.191,260.922 205.002,260.654 204.869,260.351C204.736,260.049 204.67,259.727 204.67,259.388ZM209.615,259.27C209.615,258.782 209.435,258.384 209.073,258.075C208.712,257.767 208.24,257.612 207.658,257.612C207.076,257.612 206.604,257.767 206.243,258.075C205.882,258.384 205.701,258.782 205.701,259.27C205.701,259.774 205.877,260.179 206.228,260.483C206.58,260.788 207.057,260.94 207.658,260.94C208.26,260.94 208.736,260.788 209.088,260.483C209.439,260.179 209.615,259.774 209.615,259.27ZM209.17,255.456C209.17,255.089 209.03,254.789 208.751,254.557C208.472,254.324 208.107,254.208 207.658,254.208C207.209,254.208 206.845,254.324 206.565,254.557C206.286,254.789 206.146,255.089 206.146,255.456C206.146,255.847 206.284,256.158 206.56,256.391C206.835,256.623 207.201,256.739 207.658,256.739C208.115,256.739 208.481,256.623 208.757,256.391C209.032,256.158 209.17,255.847 209.17,255.456Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M211.408,259.487L212.404,259.042C212.478,259.62 212.702,260.081 213.075,260.425C213.448,260.768 213.924,260.94 214.502,260.94C215.045,260.94 215.505,260.767 215.882,260.422C216.259,260.076 216.447,259.628 216.447,259.077C216.447,258.487 216.274,258.024 215.929,257.688C215.583,257.352 215.121,257.184 214.543,257.184C214.312,257.184 214.09,257.222 213.875,257.296C213.66,257.37 213.482,257.472 213.342,257.6L212.738,256.856L215.574,254.36L211.766,254.36L211.766,253.388L217.156,253.388L217.156,254.184L214.531,256.452C214.668,256.425 214.814,256.411 214.971,256.411C215.408,256.411 215.815,256.513 216.192,256.716C216.569,256.919 216.878,257.222 217.118,257.624C217.358,258.026 217.478,258.487 217.478,259.007C217.478,259.866 217.197,260.564 216.635,261.101C216.072,261.639 215.361,261.907 214.502,261.907C213.689,261.907 213.009,261.686 212.46,261.245C211.911,260.804 211.561,260.218 211.408,259.487Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_82">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M240.946,241.767L240.946,274.953L259.976,272.632L299.427,270.311L299.427,235.733L263.691,240.839L240.946,241.767Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M267.873,255.748C267.873,255.221 268.019,254.752 268.31,254.342C268.601,253.932 269.004,253.644 269.519,253.48C268.734,253.121 268.342,252.549 268.342,251.764C268.342,251.162 268.575,250.656 269.042,250.246C269.509,249.836 270.115,249.631 270.861,249.631C271.603,249.631 272.209,249.836 272.678,250.246C273.146,250.656 273.381,251.162 273.381,251.764C273.381,252.549 272.988,253.121 272.203,253.48C272.719,253.644 273.122,253.932 273.413,254.342C273.704,254.752 273.85,255.221 273.85,255.748C273.85,256.088 273.783,256.409 273.65,256.712C273.518,257.015 273.327,257.282 273.079,257.515C272.831,257.747 272.517,257.931 272.136,258.065C271.755,258.2 271.33,258.267 270.861,258.267C270.393,258.267 269.967,258.2 269.584,258.065C269.201,257.931 268.887,257.747 268.641,257.515C268.395,257.282 268.205,257.015 268.072,256.712C267.939,256.409 267.873,256.088 267.873,255.748ZM272.818,255.631C272.818,255.142 272.638,254.744 272.276,254.435C271.915,254.127 271.443,253.973 270.861,253.973C270.279,253.973 269.808,254.127 269.446,254.435C269.085,254.744 268.904,255.142 268.904,255.631C268.904,256.135 269.08,256.539 269.432,256.844C269.783,257.148 270.26,257.301 270.861,257.301C271.463,257.301 271.939,257.148 272.291,256.844C272.643,256.539 272.818,256.135 272.818,255.631ZM272.373,251.816C272.373,251.449 272.233,251.149 271.954,250.917C271.675,250.684 271.311,250.568 270.861,250.568C270.412,250.568 270.048,250.684 269.769,250.917C269.489,251.149 269.35,251.449 269.35,251.816C269.35,252.207 269.487,252.518 269.763,252.751C270.038,252.983 270.404,253.1 270.861,253.1C271.318,253.1 271.685,252.983 271.96,252.751C272.235,252.518 272.373,252.207 272.373,251.816Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M277.219,254.781C277.859,254.449 278.303,254.201 278.549,254.037C278.885,253.814 279.139,253.566 279.311,253.293C279.482,253.019 279.568,252.695 279.568,252.32C279.568,251.793 279.394,251.369 279.047,251.049C278.699,250.728 278.23,250.568 277.641,250.568C277.105,250.568 276.659,250.733 276.302,251.063C275.944,251.393 275.766,251.791 275.766,252.256C275.766,252.74 275.922,253.178 276.234,253.568L275.344,254.142C274.922,253.592 274.711,252.988 274.711,252.332C274.711,251.574 274.987,250.934 275.54,250.413C276.093,249.892 276.809,249.631 277.687,249.631C278.59,249.631 279.304,249.874 279.829,250.36C280.354,250.847 280.617,251.482 280.617,252.267C280.617,252.935 280.45,253.492 280.116,253.937C279.782,254.383 279.264,254.783 278.561,255.139C278.076,255.396 277.66,255.625 277.312,255.824C277.023,255.988 276.774,256.187 276.565,256.422C276.356,256.656 276.23,256.908 276.187,257.178L280.629,257.178L280.629,258.15L274.893,258.15C274.893,257.6 274.988,257.11 275.18,256.683C275.371,256.255 275.632,255.893 275.962,255.599C276.292,255.304 276.711,255.031 277.219,254.781Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_81">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M299.426,270.311L299.426,235.733L346.072,234.062L353.498,239.446L353.498,250.353L350.945,262.653L341.936,272.4L329.336,279.362L314.046,270.311L299.426,270.311Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M317.842,256.138C317.842,255.61 317.987,255.142 318.278,254.731C318.569,254.321 318.973,254.034 319.488,253.87C318.703,253.511 318.311,252.938 318.311,252.153C318.311,251.552 318.544,251.046 319.011,250.636C319.477,250.225 320.084,250.02 320.83,250.02C321.572,250.02 322.178,250.225 322.646,250.636C323.115,251.046 323.35,251.552 323.35,252.153C323.35,252.938 322.957,253.511 322.172,253.87C322.687,254.034 323.091,254.321 323.382,254.731C323.673,255.142 323.818,255.61 323.818,256.138C323.818,256.477 323.752,256.799 323.619,257.101C323.486,257.404 323.296,257.672 323.048,257.904C322.8,258.137 322.485,258.32 322.104,258.455C321.724,258.59 321.299,258.657 320.83,258.657C320.361,258.657 319.936,258.59 319.553,258.455C319.17,258.32 318.855,258.137 318.609,257.904C318.363,257.672 318.174,257.404 318.041,257.101C317.908,256.799 317.842,256.477 317.842,256.138ZM322.787,256.02C322.787,255.532 322.606,255.134 322.245,254.825C321.884,254.517 321.412,254.362 320.83,254.362C320.248,254.362 319.776,254.517 319.415,254.825C319.054,255.134 318.873,255.532 318.873,256.02C318.873,256.524 319.049,256.929 319.4,257.233C319.752,257.538 320.228,257.69 320.83,257.69C321.432,257.69 321.908,257.538 322.26,257.233C322.611,256.929 322.787,256.524 322.787,256.02ZM322.342,252.206C322.342,251.839 322.202,251.539 321.923,251.307C321.644,251.074 321.279,250.958 320.83,250.958C320.381,250.958 320.017,251.074 319.737,251.307C319.458,251.539 319.318,251.839 319.318,252.206C319.318,252.597 319.456,252.908 319.731,253.141C320.007,253.373 320.373,253.489 320.83,253.489C321.287,253.489 321.653,253.373 321.929,253.141C322.204,252.908 322.342,252.597 322.342,252.206Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M326.678,258.54L326.678,251.784C326.506,252.175 326.223,252.495 325.828,252.745C325.426,252.999 325.021,253.143 324.615,253.179L324.41,252.106C325.035,252.04 325.555,251.838 325.969,251.5C326.383,251.162 326.66,250.708 326.801,250.138L327.721,250.138L327.721,258.54L326.678,258.54Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_80">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M443.762,177.218L443.762,188.461L446.316,188.461L446.316,222.467L414.548,220.532L405.793,213.252L401.923,190.581L396.577,177.218L387.362,160.906L403.766,175.006L443.762,177.218Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M419.569,197.238C419.569,196.71 419.714,196.242 420.005,195.831C420.296,195.421 420.7,195.134 421.215,194.97C420.43,194.611 420.038,194.038 420.038,193.253C420.038,192.652 420.271,192.146 420.738,191.736C421.205,191.326 421.811,191.121 422.557,191.121C423.299,191.121 423.905,191.326 424.374,191.736C424.842,192.146 425.077,192.652 425.077,193.253C425.077,194.038 424.684,194.611 423.899,194.97C424.415,195.134 424.818,195.421 425.109,195.831C425.4,196.242 425.545,196.71 425.545,197.238C425.545,197.578 425.479,197.899 425.346,198.202C425.213,198.504 425.023,198.772 424.775,199.004C424.527,199.237 424.212,199.42 423.832,199.555C423.451,199.69 423.026,199.757 422.557,199.757C422.088,199.757 421.663,199.69 421.28,199.555C420.897,199.42 420.582,199.237 420.336,199.004C420.09,198.772 419.901,198.504 419.768,198.202C419.635,197.899 419.569,197.578 419.569,197.238ZM424.514,197.121C424.514,196.632 424.333,196.234 423.972,195.925C423.611,195.617 423.139,195.462 422.557,195.462C421.975,195.462 421.503,195.617 421.142,195.925C420.781,196.234 420.6,196.632 420.6,197.121C420.6,197.624 420.776,198.029 421.127,198.333C421.479,198.638 421.956,198.79 422.557,198.79C423.159,198.79 423.635,198.638 423.987,198.333C424.338,198.029 424.514,197.624 424.514,197.121ZM424.069,193.306C424.069,192.939 423.929,192.639 423.65,192.407C423.371,192.174 423.006,192.058 422.557,192.058C422.108,192.058 421.744,192.174 421.464,192.407C421.185,192.639 421.045,192.939 421.045,193.306C421.045,193.697 421.183,194.008 421.458,194.241C421.734,194.473 422.1,194.589 422.557,194.589C423.014,194.589 423.38,194.473 423.656,194.241C423.931,194.008 424.069,193.697 424.069,193.306Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M427.45,198.582C426.84,197.799 426.536,196.751 426.536,195.439C426.536,194.126 426.84,193.079 427.45,192.295C428.059,191.512 428.873,191.121 429.893,191.121C430.92,191.121 431.74,191.511 432.351,192.292C432.962,193.074 433.268,194.122 433.268,195.439C433.268,196.755 432.962,197.804 432.351,198.585C431.74,199.367 430.92,199.757 429.893,199.757C428.873,199.757 428.059,199.366 427.45,198.582ZM432.225,195.439C432.225,194.451 432.02,193.638 431.61,193.001C431.219,192.372 430.647,192.058 429.893,192.058C429.155,192.058 428.584,192.372 428.182,193.001C427.772,193.638 427.567,194.451 427.567,195.439C427.567,196.427 427.772,197.24 428.182,197.876C428.588,198.509 429.159,198.826 429.893,198.826C430.643,198.826 431.215,198.509 431.61,197.876C432.02,197.24 432.225,196.427 432.225,195.439Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_79">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M385.835,262.44L402.274,264.921L446.317,265.748L446.317,225.221L412.406,223.36L403.306,214.542L401.002,202.377L393.261,232.973L397.776,237.581L397.869,243.111L385.835,262.44Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M418.782,240.108L424.255,240.108L424.255,240.963C422.411,242.229 421.489,244.092 421.489,246.553C421.489,247.131 421.538,247.784 421.636,248.51L420.493,248.51C420.423,247.959 420.388,247.391 420.388,246.805C420.388,244.414 421.196,242.506 422.813,241.08L418.782,241.08L418.782,240.108Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M424.923,246.149L425.942,245.844C425.993,246.434 426.188,246.884 426.528,247.195C426.868,247.505 427.329,247.661 427.911,247.661C428.587,247.661 429.123,247.372 429.519,246.796C429.916,246.22 430.116,245.403 430.12,244.344L430.108,243.916C429.921,244.405 429.626,244.792 429.224,245.08C428.821,245.367 428.356,245.51 427.829,245.51C427.001,245.51 426.332,245.252 425.822,244.737C425.312,244.221 425.058,243.582 425.058,242.821C425.058,242.407 425.13,242.023 425.274,241.669C425.419,241.316 425.616,241.017 425.866,240.773C426.116,240.529 426.412,240.337 426.754,240.199C427.096,240.06 427.462,239.991 427.852,239.991C428.97,239.991 429.786,240.391 430.302,241.192C430.821,241.989 431.081,243.02 431.081,244.286C431.081,244.758 431.044,245.205 430.97,245.627C430.895,246.049 430.774,246.445 430.606,246.814C430.438,247.183 430.231,247.5 429.985,247.766C429.739,248.032 429.435,248.242 429.071,248.396C428.708,248.55 428.302,248.627 427.852,248.627C427.04,248.627 426.371,248.392 425.846,247.921C425.32,247.451 425.013,246.86 424.923,246.149ZM429.733,242.75C429.733,242.223 429.561,241.788 429.218,241.444C428.886,241.1 428.45,240.928 427.911,240.928C427.38,240.928 426.944,241.104 426.604,241.455C426.269,241.803 426.101,242.246 426.101,242.786C426.101,243.329 426.269,243.762 426.604,244.086C426.94,244.411 427.376,244.573 427.911,244.573C428.442,244.573 428.879,244.404 429.221,244.066C429.562,243.728 429.733,243.289 429.733,242.75Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_78">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M328.869,319.303L329.696,307.93L339.001,305.656L345.411,301.107L368.767,300.073L379.942,288.287L410.338,288.287L430.395,292.422L442.802,301.107L441.354,316.615L435.771,327.574L426.053,332.537L407.443,332.537L328.869,319.303Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,-23.4085,67.1285)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,-3.68405,1.58486)">
|
|
|
|
|
<path d="M418.782,240.108L424.255,240.108L424.255,240.963C422.411,242.229 421.489,244.092 421.489,246.553C421.489,247.131 421.538,247.784 421.636,248.51L420.493,248.51C420.423,247.959 420.388,247.391 420.388,246.805C420.388,244.414 421.196,242.506 422.813,241.08L418.782,241.08L418.782,240.108Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,1.74542,50.4549)">
|
|
|
|
|
<path d="M419.569,197.238C419.569,196.71 419.714,196.242 420.005,195.831C420.296,195.421 420.7,195.134 421.215,194.97C420.43,194.611 420.038,194.038 420.038,193.253C420.038,192.652 420.271,192.146 420.738,191.736C421.205,191.326 421.811,191.121 422.557,191.121C423.299,191.121 423.905,191.326 424.374,191.736C424.842,192.146 425.077,192.652 425.077,193.253C425.077,194.038 424.684,194.611 423.899,194.97C424.415,195.134 424.818,195.421 425.109,195.831C425.4,196.242 425.545,196.71 425.545,197.238C425.545,197.578 425.479,197.899 425.346,198.202C425.213,198.504 425.023,198.772 424.775,199.004C424.527,199.237 424.212,199.42 423.832,199.555C423.451,199.69 423.026,199.757 422.557,199.757C422.088,199.757 421.663,199.69 421.28,199.555C420.897,199.42 420.582,199.237 420.336,199.004C420.09,198.772 419.901,198.504 419.768,198.202C419.635,197.899 419.569,197.578 419.569,197.238ZM424.514,197.121C424.514,196.632 424.333,196.234 423.972,195.925C423.611,195.617 423.139,195.462 422.557,195.462C421.975,195.462 421.503,195.617 421.142,195.925C420.781,196.234 420.6,196.632 420.6,197.121C420.6,197.624 420.776,198.029 421.127,198.333C421.479,198.638 421.956,198.79 422.557,198.79C423.159,198.79 423.635,198.638 423.987,198.333C424.338,198.029 424.514,197.624 424.514,197.121ZM424.069,193.306C424.069,192.939 423.929,192.639 423.65,192.407C423.371,192.174 423.006,192.058 422.557,192.058C422.108,192.058 421.744,192.174 421.464,192.407C421.185,192.639 421.045,192.939 421.045,193.306C421.045,193.697 421.183,194.008 421.458,194.241C421.734,194.473 422.1,194.589 422.557,194.589C423.014,194.589 423.38,194.473 423.656,194.241C423.931,194.008 424.069,193.697 424.069,193.306Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_77">
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M48.329,274.953L65.502,272.632C65.502,272.632 121.163,294.452 135.549,300.091C137.77,300.962 140.134,301.409 142.52,301.409L193.835,301.409L131.177,308.603C131.177,308.603 110.987,312.78 105.882,317.189L36.958,316.029L48.329,274.953Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M62.118,288.068L67.591,288.068L67.591,288.923C65.747,290.189 64.825,292.052 64.825,294.513C64.825,295.091 64.874,295.744 64.972,296.47L63.829,296.47C63.759,295.919 63.724,295.351 63.724,294.765C63.724,292.374 64.532,290.466 66.149,289.04L62.118,289.04L62.118,288.068Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M68.405,288.068L73.878,288.068L73.878,288.923C72.034,290.189 71.112,292.052 71.112,294.513C71.112,295.091 71.161,295.744 71.259,296.47L70.116,296.47C70.046,295.919 70.011,295.351 70.011,294.765C70.011,292.374 70.819,290.466 72.436,289.04L68.405,289.04L68.405,288.068Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_76">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M30.924,370.797L27.907,354.32L29.416,339.7L36.958,316.029L105.882,317.189C105.882,317.189 91.494,328.561 89.405,340.86C87.316,353.16 87.084,357.569 87.084,357.569L30.924,370.797Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M53.677,330.938L59.15,330.938L59.15,331.793C57.306,333.059 56.384,334.922 56.384,337.383C56.384,337.961 56.433,338.614 56.531,339.34L55.388,339.34C55.318,338.789 55.283,338.221 55.283,337.635C55.283,335.245 56.091,333.336 57.708,331.911L53.677,331.911L53.677,330.938Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M59.712,335.198C59.712,334.58 59.783,334.009 59.923,333.484C60.064,332.958 60.267,332.496 60.533,332.098C60.798,331.7 61.141,331.387 61.561,331.161C61.981,330.934 62.457,330.821 62.988,330.821C63.769,330.821 64.398,331.02 64.874,331.418C65.351,331.817 65.638,332.362 65.736,333.053L64.751,333.352C64.595,332.289 63.988,331.758 62.929,331.758C62.628,331.758 62.348,331.828 62.088,331.966C61.829,332.105 61.598,332.308 61.397,332.576C61.196,332.843 61.037,333.196 60.919,333.633C60.802,334.071 60.744,334.569 60.744,335.127L60.744,335.297C60.943,334.895 61.256,334.568 61.684,334.316C62.112,334.064 62.566,333.938 63.046,333.938C63.57,333.938 64.039,334.059 64.456,334.301C64.872,334.543 65.191,334.867 65.414,335.271C65.636,335.675 65.747,336.12 65.747,336.604C65.747,337.444 65.483,338.129 64.954,338.661C64.424,339.192 63.753,339.457 62.941,339.457C62.417,339.457 61.95,339.352 61.538,339.141C61.125,338.93 60.787,338.635 60.521,338.256C60.255,337.877 60.054,337.429 59.917,336.912C59.781,336.394 59.712,335.823 59.712,335.198ZM64.716,336.698C64.716,336.151 64.541,335.71 64.192,335.376C63.842,335.042 63.392,334.875 62.841,334.875C62.345,334.875 61.921,335.045 61.57,335.385C61.218,335.725 61.042,336.151 61.042,336.662C61.042,337.205 61.218,337.646 61.57,337.984C61.921,338.322 62.371,338.491 62.917,338.491C63.445,338.491 63.876,338.324 64.212,337.99C64.548,337.656 64.716,337.225 64.716,336.698Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_75">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M66.895,417.442L48.562,397.948L30.925,370.796L87.085,357.569C87.085,357.569 89.406,380.775 111.22,394.467L66.895,417.442Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M62.953,383.236L68.426,383.236L68.426,384.091C66.582,385.357 65.66,387.22 65.66,389.681C65.66,390.259 65.709,390.912 65.807,391.638L64.664,391.638C64.594,391.087 64.559,390.519 64.559,389.933C64.559,387.542 65.367,385.634 66.984,384.208L62.953,384.208L62.953,383.236Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M75.059,383.236L75.059,384.208L70.764,384.208C70.764,385.017 70.664,385.917 70.465,386.91C70.719,386.617 71.038,386.383 71.423,386.209C71.808,386.036 72.225,385.949 72.674,385.949C73.471,385.949 74.132,386.197 74.657,386.693C75.183,387.189 75.445,387.857 75.445,388.697C75.445,389.603 75.165,390.339 74.604,390.906C74.044,391.472 73.295,391.755 72.357,391.755C71.568,391.755 70.893,391.544 70.33,391.122C69.771,390.693 69.439,390.081 69.334,389.288L70.342,388.996C70.436,389.574 70.652,390.017 70.992,390.326C71.332,390.634 71.787,390.788 72.357,390.788C72.99,390.788 73.488,390.607 73.852,390.244C74.215,389.88 74.396,389.406 74.396,388.82C74.396,388.234 74.227,387.765 73.887,387.413C73.547,387.062 73.062,386.886 72.434,386.886C72.027,386.886 71.645,386.993 71.288,387.205C70.931,387.418 70.68,387.683 70.535,387.999L69.434,387.747C69.672,386.189 69.791,384.685 69.791,383.236L75.059,383.236Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_74">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M144.174,453.412L90.333,454.572L88.709,445.986L66.896,417.442L111.22,394.467C111.22,394.467 136.516,413.264 144.174,438.792L144.174,453.412Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M102.997,420.042L108.47,420.042L108.47,420.897C106.626,422.163 105.704,424.026 105.704,426.487C105.704,427.065 105.753,427.718 105.851,428.444L104.708,428.444C104.638,427.893 104.602,427.325 104.602,426.739C104.602,424.349 105.411,422.44 107.028,421.015L102.997,421.015L102.997,420.042Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M112.536,428.444L112.536,426.294L108.757,426.294L108.757,425.204C109.136,424.833 109.439,424.489 109.668,424.173C109.896,423.856 110.077,423.514 110.21,423.144C110.343,422.775 110.432,422.4 110.476,422.019C110.521,421.639 110.548,421.161 110.556,420.587L110.556,420.042L111.599,420.042L111.599,420.587C111.599,421.599 111.472,422.485 111.218,423.247C110.968,424.001 110.515,424.706 109.858,425.362L112.536,425.362L112.536,422.638L113.579,422.638L113.579,425.362L115.009,425.362L115.009,426.294L113.579,426.294L113.579,428.444L112.536,428.444Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_73">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M90.102,459.214L112.845,461.999L135.819,461.999L142.085,489.847L136.98,513.286L87.781,512.125L92.191,491.471L90.102,459.214Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M111.092,478.847L116.565,478.847L116.565,479.702C114.721,480.968 113.799,482.831 113.799,485.292C113.799,485.87 113.848,486.522 113.946,487.249L112.803,487.249C112.733,486.698 112.698,486.13 112.698,485.544C112.698,483.153 113.506,481.245 115.123,479.819L111.092,479.819L111.092,478.847Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M117.233,484.946L118.229,484.501C118.303,485.079 118.527,485.54 118.9,485.884C119.273,486.227 119.748,486.399 120.327,486.399C120.87,486.399 121.33,486.226 121.706,485.881C122.083,485.535 122.272,485.087 122.272,484.536C122.272,483.946 122.099,483.483 121.753,483.147C121.408,482.811 120.946,482.643 120.368,482.643C120.137,482.643 119.915,482.681 119.7,482.755C119.485,482.829 119.307,482.931 119.166,483.059L118.563,482.315L121.399,479.819L117.59,479.819L117.59,478.847L122.981,478.847L122.981,479.643L120.356,481.911C120.493,481.884 120.639,481.87 120.795,481.87C121.233,481.87 121.64,481.972 122.017,482.175C122.394,482.378 122.703,482.681 122.943,483.083C123.183,483.485 123.303,483.946 123.303,484.466C123.303,485.325 123.022,486.023 122.459,486.56C121.897,487.098 121.186,487.366 120.327,487.366C119.514,487.366 118.833,487.145 118.285,486.704C117.736,486.263 117.385,485.677 117.233,484.946Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_72">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M128.393,562.02L92.655,568.286L72.233,567.358L79.891,549.952L87.781,512.125L136.98,513.286L128.393,562.02Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M101.247,532.209L106.72,532.209L106.72,533.065C104.876,534.33 103.954,536.194 103.954,538.655C103.954,539.233 104.003,539.885 104.101,540.612L102.958,540.612C102.888,540.061 102.852,539.493 102.852,538.907C102.852,536.516 103.661,534.608 105.278,533.182L101.247,533.182L101.247,532.209Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M109.995,537.243C110.636,536.911 111.079,536.663 111.325,536.498C111.661,536.276 111.915,536.028 112.087,535.754C112.259,535.481 112.345,535.157 112.345,534.782C112.345,534.254 112.171,533.83 111.823,533.51C111.476,533.19 111.007,533.03 110.417,533.03C109.882,533.03 109.436,533.195 109.078,533.525C108.721,533.855 108.542,534.252 108.542,534.717C108.542,535.202 108.698,535.639 109.011,536.03L108.12,536.604C107.698,536.053 107.487,535.45 107.487,534.793C107.487,534.036 107.764,533.396 108.316,532.874C108.869,532.353 109.585,532.092 110.464,532.092C111.366,532.092 112.08,532.335 112.605,532.822C113.131,533.308 113.394,533.944 113.394,534.729C113.394,535.397 113.227,535.954 112.893,536.399C112.559,536.844 112.04,537.245 111.337,537.6C110.852,537.858 110.436,538.086 110.089,538.286C109.8,538.45 109.551,538.649 109.342,538.883C109.133,539.118 109.007,539.37 108.964,539.639L113.405,539.639L113.405,540.612L107.669,540.612C107.669,540.061 107.765,539.572 107.956,539.144C108.147,538.716 108.408,538.355 108.738,538.06C109.068,537.765 109.487,537.493 109.995,537.243Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_71">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M68.751,575.944L92.886,578.265L118.181,575.944L121.43,598.222L117.717,615.86L57.148,610.058L68.751,575.944Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M84.553,586.268L90.026,586.268L90.026,587.123C88.182,588.389 87.26,590.252 87.26,592.713C87.26,593.291 87.309,593.944 87.407,594.67L86.264,594.67C86.194,594.12 86.159,593.551 86.159,592.965C86.159,590.575 86.967,588.666 88.584,587.241L84.553,587.241L84.553,586.268Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M92.915,594.67L92.915,587.914C92.743,588.305 92.459,588.625 92.065,588.875C91.663,589.129 91.258,589.274 90.852,589.309L90.647,588.237C91.272,588.17 91.791,587.968 92.206,587.63C92.62,587.292 92.897,586.838 93.038,586.268L93.957,586.268L93.957,594.67L92.914,594.67L92.915,594.67Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_70">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M110.756,652.991L45.545,640.691L52.275,626.999L57.148,610.059L117.718,615.86L110.756,652.991Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M75.916,622.861L81.389,622.861L81.389,623.716C79.545,624.982 78.623,626.845 78.623,629.306C78.623,629.884 78.672,630.537 78.77,631.263L77.627,631.263C77.557,630.712 77.522,630.144 77.522,629.558C77.522,627.167 78.331,625.259 79.948,623.833L75.916,623.833L75.916,622.861Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M82.801,630.205C82.192,629.422 81.887,628.374 81.887,627.062C81.887,625.749 82.192,624.702 82.801,623.918C83.411,623.135 84.225,622.744 85.245,622.744C86.272,622.744 87.091,623.134 87.703,623.915C88.314,624.697 88.62,625.746 88.62,627.062C88.62,628.378 88.314,629.427 87.703,630.208C87.091,630.99 86.272,631.38 85.245,631.38C84.225,631.38 83.411,630.989 82.801,630.205ZM87.577,627.062C87.577,626.074 87.372,625.261 86.961,624.624C86.571,623.996 85.998,623.681 85.245,623.681C84.506,623.681 83.936,623.996 83.534,624.624C83.123,625.261 82.918,626.074 82.918,627.062C82.918,628.05 83.123,628.863 83.534,629.499C83.94,630.132 84.51,630.449 85.245,630.449C85.995,630.449 86.567,630.132 86.961,629.499C87.372,628.863 87.577,628.05 87.577,627.062Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_69">
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M104.606,688.729L58.076,681.303L35.334,678.286L35.334,671.556L45.545,640.691L110.756,652.991L104.605,688.729L104.606,688.729Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M67.787,662.614C67.787,661.996 67.857,661.425 67.998,660.9C68.138,660.374 68.341,659.913 68.607,659.514C68.873,659.116 69.215,658.803 69.635,658.577C70.055,658.35 70.531,658.237 71.062,658.237C71.843,658.237 72.472,658.436 72.949,658.834C73.425,659.233 73.712,659.778 73.81,660.469L72.826,660.768C72.669,659.705 72.062,659.174 71.003,659.174C70.703,659.174 70.422,659.244 70.163,659.382C69.903,659.521 69.672,659.724 69.471,659.992C69.27,660.259 69.111,660.612 68.994,661.049C68.876,661.487 68.818,661.985 68.818,662.543L68.818,662.713C69.017,662.311 69.331,661.984 69.758,661.732C70.186,661.48 70.64,661.354 71.121,661.354C71.644,661.354 72.114,661.475 72.53,661.717C72.946,661.959 73.265,662.283 73.488,662.687C73.71,663.091 73.822,663.536 73.822,664.02C73.822,664.86 73.557,665.545 73.028,666.077C72.498,666.608 71.828,666.873 71.015,666.873C70.492,666.873 70.024,666.768 69.612,666.557C69.2,666.346 68.861,666.051 68.595,665.672C68.33,665.293 68.128,664.845 67.992,664.328C67.855,663.81 67.787,663.239 67.787,662.614ZM72.79,664.114C72.79,663.567 72.616,663.126 72.266,662.792C71.916,662.458 71.466,662.291 70.915,662.291C70.419,662.291 69.996,662.461 69.644,662.801C69.292,663.141 69.117,663.567 69.117,664.079C69.117,664.621 69.292,665.062 69.644,665.4C69.996,665.738 70.445,665.907 70.992,665.907C71.519,665.907 71.951,665.74 72.287,665.406C72.623,665.072 72.79,664.641 72.79,664.114Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M74.888,664.395L75.908,664.09C75.958,664.68 76.154,665.13 76.494,665.441C76.833,665.751 77.294,665.907 77.876,665.907C78.552,665.907 79.088,665.619 79.485,665.042C79.881,664.466 80.081,663.649 80.085,662.59L80.074,662.163C79.886,662.651 79.591,663.038 79.189,663.326C78.787,663.613 78.322,663.756 77.794,663.756C76.966,663.756 76.297,663.498 75.788,662.983C75.278,662.467 75.023,661.829 75.023,661.067C75.023,660.653 75.095,660.269 75.24,659.915C75.384,659.562 75.581,659.263 75.831,659.019C76.081,658.775 76.377,658.583 76.719,658.445C77.061,658.306 77.427,658.237 77.818,658.237C78.935,658.237 79.751,658.637 80.267,659.438C80.787,660.235 81.046,661.266 81.046,662.532C81.046,663.004 81.009,663.452 80.935,663.873C80.861,664.295 80.74,664.691 80.572,665.06C80.404,665.429 80.197,665.746 79.951,666.012C79.705,666.278 79.4,666.488 79.037,666.642C78.673,666.796 78.267,666.873 77.818,666.873C77.005,666.873 76.336,666.638 75.811,666.167C75.286,665.697 74.978,665.106 74.888,664.395ZM79.699,660.996C79.699,660.469 79.527,660.034 79.183,659.69C78.851,659.346 78.415,659.174 77.876,659.174C77.345,659.174 76.91,659.35 76.57,659.702C76.234,660.049 76.066,660.493 76.066,661.032C76.066,661.575 76.234,662.008 76.57,662.332C76.906,662.657 77.341,662.819 77.876,662.819C78.408,662.819 78.844,662.65 79.186,662.312C79.528,661.974 79.699,661.536 79.699,660.996Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_65">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M226.839,568.286L231.844,587.852L215.997,601.697L176.263,626.55L174.13,574.175L190.643,574.175L226.839,568.286Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M195.821,591.873C195.821,591.256 195.891,590.685 196.032,590.16C196.172,589.634 196.375,589.172 196.641,588.774C196.907,588.375 197.249,588.063 197.669,587.836C198.089,587.61 198.565,587.496 199.096,587.496C199.877,587.496 200.506,587.696 200.983,588.094C201.459,588.493 201.747,589.038 201.844,589.729L200.86,590.028C200.704,588.965 200.096,588.434 199.038,588.434C198.737,588.434 198.457,588.503 198.197,588.642C197.937,588.781 197.707,588.984 197.505,589.251C197.304,589.519 197.145,589.872 197.028,590.309C196.911,590.747 196.852,591.245 196.852,591.803L196.852,591.973C197.051,591.571 197.365,591.244 197.792,590.992C198.22,590.74 198.674,590.614 199.155,590.614C199.678,590.614 200.148,590.735 200.564,590.977C200.98,591.219 201.299,591.542 201.522,591.947C201.745,592.351 201.856,592.795 201.856,593.28C201.856,594.12 201.591,594.805 201.062,595.336C200.533,595.868 199.862,596.133 199.049,596.133C198.526,596.133 198.058,596.028 197.646,595.817C197.234,595.606 196.895,595.311 196.629,594.932C196.364,594.553 196.163,594.105 196.026,593.587C195.889,593.07 195.821,592.498 195.821,591.873ZM200.825,593.373C200.825,592.827 200.65,592.386 200.3,592.052C199.951,591.718 199.5,591.551 198.95,591.551C198.454,591.551 198.03,591.721 197.678,592.061C197.327,592.401 197.151,592.827 197.151,593.338C197.151,593.881 197.327,594.322 197.678,594.66C198.03,594.997 198.479,595.166 199.026,595.166C199.553,595.166 199.985,594.999 200.321,594.665C200.657,594.331 200.825,593.901 200.825,593.373Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M208.694,587.614L208.694,588.586L204.399,588.586C204.399,589.395 204.299,590.295 204.1,591.288C204.354,590.995 204.673,590.761 205.058,590.587C205.443,590.413 205.86,590.327 206.309,590.327C207.106,590.327 207.767,590.575 208.292,591.071C208.818,591.567 209.081,592.235 209.081,593.075C209.081,593.981 208.8,594.717 208.24,595.284C207.679,595.85 206.93,596.133 205.993,596.133C205.204,596.133 204.528,595.922 203.965,595.5C203.407,595.071 203.075,594.459 202.969,593.666L203.977,593.373C204.071,593.952 204.288,594.395 204.627,594.704C204.967,595.012 205.422,595.166 205.993,595.166C206.625,595.166 207.123,594.985 207.487,594.622C207.85,594.258 208.032,593.784 208.032,593.198C208.032,592.612 207.862,592.143 207.522,591.791C207.182,591.44 206.698,591.264 206.069,591.264C205.663,591.264 205.281,591.371 204.923,591.583C204.566,591.796 204.315,592.061 204.17,592.377L203.069,592.125C203.307,590.567 203.426,589.063 203.426,587.614L208.694,587.614Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_64">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M148.982,574.174L174.131,574.174L176.264,626.55L152.113,641.366C152.113,641.366 145.441,646.324 135.599,640.69L148.982,574.174Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M152.405,605.623C152.405,605.006 152.475,604.435 152.616,603.91C152.756,603.384 152.959,602.922 153.225,602.524C153.491,602.125 153.833,601.813 154.253,601.586C154.673,601.36 155.149,601.246 155.68,601.246C156.461,601.246 157.09,601.446 157.567,601.844C158.043,602.243 158.331,602.788 158.428,603.479L157.444,603.778C157.288,602.715 156.68,602.184 155.622,602.184C155.321,602.184 155.04,602.253 154.781,602.392C154.521,602.531 154.29,602.734 154.089,603.001C153.888,603.269 153.729,603.622 153.612,604.059C153.495,604.497 153.436,604.995 153.436,605.553L153.436,605.723C153.635,605.321 153.949,604.994 154.376,604.742C154.804,604.49 155.258,604.364 155.739,604.364C156.262,604.364 156.732,604.485 157.148,604.727C157.564,604.969 157.883,605.292 158.106,605.697C158.329,606.101 158.44,606.545 158.44,607.03C158.44,607.87 158.175,608.555 157.646,609.086C157.117,609.618 156.446,609.883 155.633,609.883C155.11,609.883 154.642,609.778 154.23,609.567C153.818,609.356 153.479,609.061 153.213,608.682C152.948,608.303 152.747,607.855 152.61,607.337C152.473,606.82 152.405,606.248 152.405,605.623ZM157.409,607.123C157.409,606.577 157.234,606.136 156.884,605.802C156.535,605.468 156.084,605.301 155.534,605.301C155.038,605.301 154.614,605.471 154.262,605.811C153.911,606.151 153.735,606.577 153.735,607.088C153.735,607.631 153.911,608.072 154.262,608.41C154.614,608.747 155.063,608.916 155.61,608.916C156.137,608.916 156.569,608.749 156.905,608.415C157.241,608.081 157.409,607.651 157.409,607.123Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M163.215,609.766L163.215,607.616L159.436,607.616L159.436,606.526C159.815,606.155 160.119,605.811 160.347,605.495C160.576,605.178 160.756,604.835 160.889,604.466C161.022,604.097 161.111,603.722 161.156,603.341C161.201,602.96 161.227,602.483 161.235,601.909L161.235,601.364L162.278,601.364L162.278,601.909C162.278,602.92 162.151,603.807 161.897,604.569C161.647,605.323 161.194,606.028 160.538,606.684L163.215,606.684L163.215,603.959L164.258,603.959L164.258,606.684L165.688,606.684L165.688,607.616L164.258,607.616L164.258,609.766L163.215,609.766Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_63">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M151.112,564.667L160.119,513.286C160.119,513.286 162.288,510.29 167.459,510.29C172.629,510.29 196.315,508.788 196.315,508.788L189.81,562.332L151.112,564.667Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M170.274,538.299C170.274,537.682 170.344,537.111 170.485,536.585C170.625,536.06 170.829,535.598 171.094,535.2C171.36,534.801 171.703,534.489 172.123,534.262C172.542,534.036 173.018,533.922 173.549,533.922C174.331,533.922 174.959,534.121 175.436,534.52C175.913,534.918 176.2,535.463 176.297,536.155L175.313,536.454C175.157,535.391 174.549,534.86 173.491,534.86C173.19,534.86 172.91,534.929 172.65,535.068C172.39,535.206 172.16,535.41 171.958,535.677C171.757,535.945 171.598,536.297 171.481,536.735C171.364,537.172 171.305,537.67 171.305,538.229L171.305,538.399C171.504,537.997 171.818,537.669 172.246,537.417C172.673,537.165 173.127,537.039 173.608,537.039C174.131,537.039 174.601,537.161 175.017,537.403C175.433,537.645 175.752,537.968 175.975,538.372C176.198,538.777 176.309,539.221 176.309,539.705C176.309,540.545 176.044,541.231 175.515,541.762C174.986,542.293 174.315,542.559 173.502,542.559C172.979,542.559 172.511,542.454 172.099,542.243C171.687,542.032 171.348,541.737 171.082,541.358C170.817,540.979 170.616,540.531 170.479,540.013C170.342,539.496 170.274,538.924 170.274,538.299ZM175.278,539.799C175.278,539.252 175.103,538.812 174.753,538.478C174.404,538.144 173.954,537.977 173.403,537.977C172.907,537.977 172.483,538.147 172.131,538.487C171.78,538.827 171.604,539.252 171.604,539.764C171.604,540.307 171.78,540.747 172.131,541.085C172.483,541.423 172.932,541.592 173.479,541.592C174.006,541.592 174.438,541.425 174.774,541.091C175.11,540.757 175.278,540.327 175.278,539.799Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M177.135,540.139L178.131,539.694C178.206,540.272 178.429,540.733 178.802,541.077C179.175,541.42 179.651,541.592 180.229,541.592C180.772,541.592 181.232,541.419 181.609,541.074C181.986,540.728 182.174,540.28 182.174,539.729C182.174,539.139 182.001,538.676 181.656,538.34C181.31,538.004 180.848,537.836 180.27,537.836C180.04,537.836 179.817,537.873 179.602,537.948C179.387,538.022 179.209,538.123 179.069,538.252L178.465,537.508L181.301,535.012L177.493,535.012L177.493,534.039L182.883,534.039L182.883,534.836L180.258,537.104C180.395,537.077 180.541,537.063 180.698,537.063C181.135,537.063 181.542,537.164 181.919,537.368C182.296,537.571 182.605,537.873 182.845,538.276C183.085,538.678 183.206,539.139 183.206,539.659C183.206,540.518 182.924,541.216 182.362,541.753C181.799,542.29 181.088,542.559 180.229,542.559C179.416,542.559 178.736,542.338 178.187,541.897C177.638,541.455 177.288,540.87 177.135,540.139Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_62">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M226.506,560.013L231.01,551.823L230.009,512.126C230.009,512.126 229.843,508.788 224.672,508.788L196.315,508.788L189.81,562.332L226.506,560.013Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M203.979,538.539C203.979,537.922 204.05,537.351 204.19,536.826C204.331,536.3 204.534,535.838 204.8,535.44C205.065,535.041 205.408,534.729 205.828,534.502C206.248,534.276 206.724,534.163 207.255,534.163C208.036,534.163 208.665,534.362 209.142,534.76C209.618,535.159 209.905,535.704 210.003,536.395L209.019,536.694C208.862,535.631 208.255,535.1 207.196,535.1C206.895,535.1 206.615,535.169 206.355,535.308C206.096,535.447 205.865,535.65 205.664,535.917C205.463,536.185 205.304,536.538 205.186,536.975C205.069,537.413 205.011,537.911 205.011,538.469L205.011,538.639C205.21,538.237 205.523,537.91 205.951,537.658C206.379,537.406 206.833,537.28 207.313,537.28C207.837,537.28 208.307,537.401 208.723,537.643C209.139,537.885 209.458,538.208 209.681,538.613C209.903,539.017 210.015,539.461 210.015,539.946C210.015,540.786 209.75,541.471 209.221,542.002C208.691,542.534 208.02,542.799 207.208,542.799C206.685,542.799 206.217,542.694 205.805,542.483C205.393,542.272 205.054,541.977 204.788,541.598C204.522,541.219 204.321,540.771 204.184,540.253C204.048,539.736 203.979,539.164 203.979,538.539ZM208.983,540.039C208.983,539.493 208.809,539.052 208.459,538.718C208.109,538.384 207.659,538.217 207.108,538.217C206.612,538.217 206.188,538.387 205.837,538.727C205.485,539.067 205.31,539.493 205.31,540.004C205.31,540.547 205.485,540.988 205.837,541.326C206.188,541.663 206.638,541.832 207.185,541.832C207.712,541.832 208.144,541.665 208.479,541.331C208.815,540.997 208.983,540.567 208.983,540.039Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M213.565,539.313C214.206,538.981 214.649,538.733 214.895,538.569C215.231,538.346 215.485,538.098 215.657,537.825C215.829,537.551 215.915,537.227 215.915,536.852C215.915,536.325 215.741,535.901 215.394,535.58C215.046,535.26 214.577,535.1 213.987,535.1C213.452,535.1 213.006,535.265 212.648,535.595C212.291,535.925 212.112,536.323 212.112,536.788C212.112,537.272 212.269,537.709 212.581,538.1L211.69,538.674C211.269,538.123 211.058,537.52 211.058,536.864C211.058,536.106 211.334,535.466 211.887,534.945C212.439,534.423 213.155,534.162 214.034,534.162C214.936,534.162 215.65,534.406 216.176,534.892C216.701,535.378 216.964,536.014 216.964,536.799C216.964,537.467 216.797,538.024 216.463,538.469C216.129,538.914 215.61,539.315 214.907,539.67C214.423,539.928 214.007,540.157 213.659,540.356C213.37,540.52 213.121,540.719 212.912,540.954C212.703,541.188 212.577,541.44 212.534,541.709L216.976,541.709L216.976,542.682L211.239,542.682C211.239,542.131 211.335,541.642 211.526,541.214C211.718,540.787 211.978,540.425 212.309,540.13C212.639,539.835 213.058,539.563 213.565,539.313Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_61">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M167.625,449.407L169.46,415.546C169.46,415.546 172.629,406.873 181.136,405.705C189.643,404.537 224.838,404.537 224.838,404.537L225.672,447.239L167.625,449.407Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M192.578,420.919C192.578,420.302 192.648,419.731 192.789,419.205C192.929,418.68 193.132,418.218 193.398,417.82C193.664,417.421 194.006,417.109 194.426,416.882C194.846,416.656 195.322,416.542 195.853,416.542C196.634,416.542 197.263,416.742 197.74,417.14C198.216,417.538 198.503,418.083 198.601,418.775L197.617,419.074C197.46,418.011 196.853,417.48 195.794,417.48C195.494,417.48 195.213,417.549 194.954,417.688C194.694,417.827 194.463,418.03 194.262,418.297C194.061,418.565 193.902,418.917 193.785,419.355C193.667,419.792 193.609,420.29 193.609,420.849L193.609,421.019C193.808,420.617 194.122,420.289 194.549,420.038C194.977,419.786 195.431,419.66 195.912,419.66C196.435,419.66 196.905,419.781 197.321,420.023C197.737,420.265 198.056,420.588 198.279,420.993C198.501,421.397 198.613,421.841 198.613,422.326C198.613,423.165 198.348,423.851 197.819,424.382C197.289,424.914 196.619,425.179 195.806,425.179C195.283,425.179 194.815,425.074 194.403,424.863C193.991,424.652 193.652,424.357 193.386,423.978C193.121,423.599 192.919,423.151 192.783,422.633C192.646,422.116 192.578,421.544 192.578,420.919ZM197.581,422.419C197.581,421.872 197.407,421.432 197.057,421.098C196.707,420.764 196.257,420.597 195.706,420.597C195.21,420.597 194.787,420.767 194.435,421.107C194.083,421.447 193.908,421.872 193.908,422.384C193.908,422.927 194.083,423.368 194.435,423.705C194.787,424.043 195.236,424.212 195.783,424.212C196.31,424.212 196.742,424.045 197.078,423.711C197.414,423.377 197.582,422.947 197.582,422.419L197.581,422.419Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M201.706,425.062L201.706,418.306C201.535,418.697 201.251,419.017 200.857,419.267C200.455,419.521 200.05,419.665 199.644,419.701L199.439,418.628C200.064,418.562 200.583,418.36 200.998,418.022C201.412,417.684 201.689,417.23 201.83,416.66L202.749,416.66L202.749,425.062L201.706,425.062Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_60">
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M224.838,404.537L225.672,447.238L282.718,445.404L281.05,405.705L224.838,404.537Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M250.16,421.078C250.16,420.46 250.23,419.889 250.371,419.364C250.511,418.838 250.714,418.376 250.98,417.978C251.246,417.579 251.588,417.267 252.008,417.04C252.428,416.814 252.904,416.701 253.435,416.701C254.216,416.701 254.845,416.9 255.322,417.298C255.798,417.697 256.085,418.242 256.183,418.933L255.199,419.232C255.042,418.169 254.435,417.638 253.376,417.638C253.076,417.638 252.795,417.707 252.536,417.846C252.276,417.985 252.045,418.188 251.844,418.455C251.643,418.723 251.484,419.076 251.367,419.513C251.249,419.951 251.191,420.449 251.191,421.007L251.191,421.177C251.39,420.775 251.704,420.448 252.131,420.196C252.559,419.944 253.013,419.818 253.494,419.818C254.017,419.818 254.487,419.939 254.903,420.181C255.319,420.423 255.638,420.747 255.861,421.151C256.083,421.555 256.195,421.999 256.195,422.484C256.195,423.324 255.93,424.009 255.401,424.54C254.872,425.072 254.201,425.337 253.388,425.337C252.865,425.337 252.397,425.232 251.985,425.021C251.573,424.81 251.234,424.515 250.968,424.136C250.703,423.757 250.501,423.309 250.365,422.791C250.228,422.274 250.16,421.703 250.16,421.078ZM255.164,422.578C255.164,422.031 254.989,421.59 254.639,421.256C254.29,420.922 253.839,420.755 253.289,420.755C252.792,420.755 252.369,420.925 252.017,421.265C251.665,421.605 251.49,422.031 251.49,422.542C251.49,423.085 251.665,423.526 252.017,423.864C252.369,424.202 252.818,424.371 253.365,424.371C253.892,424.371 254.324,424.204 254.66,423.87C254.996,423.536 255.164,423.105 255.164,422.578Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M258.164,424.163C257.554,423.379 257.249,422.331 257.249,421.019C257.249,419.706 257.554,418.659 258.164,417.875C258.773,417.092 259.587,416.701 260.607,416.701C261.634,416.701 262.454,417.091 263.065,417.872C263.676,418.654 263.982,419.703 263.982,421.019C263.982,422.335 263.676,423.384 263.065,424.165C262.454,424.947 261.634,425.337 260.607,425.337C259.587,425.337 258.773,424.946 258.164,424.163ZM262.939,421.019C262.939,420.031 262.734,419.218 262.324,418.581C261.933,417.953 261.361,417.638 260.607,417.638C259.869,417.638 259.298,417.953 258.896,418.581C258.486,419.218 258.281,420.031 258.281,421.019C258.281,422.007 258.486,422.82 258.896,423.456C259.302,424.089 259.873,424.406 260.607,424.406C261.357,424.406 261.929,424.089 262.324,423.456C262.734,422.82 262.939,422.007 262.939,421.019Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_59">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M344.269,444.069L282.719,445.403L281.051,405.704L322.752,407.373C322.752,407.373 337.103,414.879 341.937,425.554L344.269,444.069Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M312.115,415.898L312.115,416.871L307.82,416.871C307.82,417.679 307.721,418.58 307.521,419.572C307.775,419.279 308.095,419.045 308.479,418.871C308.864,418.698 309.281,418.611 309.73,418.611C310.527,418.611 311.188,418.859 311.714,419.355C312.239,419.851 312.502,420.519 312.502,421.359C312.502,422.265 312.222,423.001 311.661,423.568C311.101,424.134 310.352,424.417 309.414,424.417C308.625,424.417 307.949,424.206 307.387,423.785C306.828,423.355 306.496,422.744 306.391,421.951L307.398,421.658C307.492,422.236 307.709,422.679 308.049,422.988C308.389,423.296 308.844,423.451 309.414,423.451C310.047,423.451 310.545,423.269 310.908,422.906C311.271,422.542 311.453,422.068 311.453,421.482C311.453,420.896 311.283,420.427 310.943,420.076C310.603,419.724 310.119,419.548 309.49,419.548C309.084,419.548 308.702,419.655 308.345,419.868C307.987,420.08 307.736,420.345 307.592,420.662L306.49,420.41C306.728,418.851 306.848,417.347 306.848,415.898L312.115,415.898Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M313.492,421.939L314.512,421.634C314.562,422.224 314.758,422.674 315.098,422.985C315.437,423.295 315.898,423.451 316.48,423.451C317.156,423.451 317.692,423.163 318.089,422.586C318.485,422.01 318.686,421.193 318.689,420.134L318.678,419.706C318.49,420.195 318.195,420.582 317.793,420.87C317.391,421.157 316.926,421.3 316.398,421.3C315.57,421.3 314.901,421.042 314.392,420.527C313.882,420.011 313.627,419.372 313.627,418.611C313.627,418.197 313.699,417.813 313.844,417.459C313.988,417.106 314.185,416.807 314.435,416.563C314.685,416.319 314.981,416.127 315.323,415.989C315.665,415.85 316.031,415.781 316.422,415.781C317.539,415.781 318.355,416.181 318.871,416.982C319.391,417.779 319.65,418.81 319.65,420.076C319.65,420.548 319.613,420.996 319.539,421.417C319.465,421.839 319.344,422.235 319.176,422.604C319.008,422.973 318.801,423.29 318.555,423.556C318.309,423.822 318.004,424.032 317.641,424.186C317.277,424.34 316.871,424.417 316.422,424.417C315.609,424.417 314.94,424.182 314.415,423.711C313.89,423.241 313.582,422.65 313.492,421.939ZM318.303,418.54C318.303,418.013 318.131,417.578 317.787,417.234C317.455,416.89 317.019,416.718 316.48,416.718C315.949,416.718 315.514,416.894 315.174,417.246C314.838,417.593 314.67,418.037 314.67,418.576C314.67,419.119 314.838,419.552 315.174,419.876C315.51,420.201 315.945,420.363 316.48,420.363C317.012,420.363 317.448,420.194 317.79,419.856C318.132,419.518 318.303,419.079 318.303,418.54Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_58">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M345.937,453.243L348.606,483.935L341.6,487.604L287.89,489.773L287.056,456.412L345.937,453.243Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M317.991,468.906L317.991,469.878L313.696,469.878C313.696,470.687 313.597,471.587 313.397,472.58C313.651,472.287 313.971,472.053 314.355,471.879C314.74,471.705 315.157,471.619 315.606,471.619C316.403,471.619 317.064,471.867 317.59,472.363C318.115,472.859 318.378,473.527 318.378,474.367C318.378,475.273 318.098,476.009 317.537,476.576C316.977,477.142 316.228,477.425 315.29,477.425C314.501,477.425 313.825,477.214 313.263,476.792C312.704,476.363 312.372,475.751 312.267,474.958L313.274,474.665C313.368,475.244 313.585,475.687 313.925,475.996C314.265,476.304 314.72,476.458 315.29,476.458C315.923,476.458 316.421,476.277 316.784,475.913C317.147,475.55 317.329,475.076 317.329,474.49C317.329,473.904 317.159,473.435 316.819,473.083C316.479,472.732 315.995,472.556 315.366,472.556C314.96,472.556 314.578,472.663 314.221,472.875C313.863,473.088 313.612,473.353 313.468,473.669L312.366,473.417C312.604,471.859 312.724,470.355 312.724,468.906L317.991,468.906Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M319.368,474.906C319.368,474.378 319.514,473.91 319.805,473.499C320.096,473.089 320.499,472.802 321.015,472.638C320.229,472.279 319.837,471.706 319.837,470.921C319.837,470.32 320.07,469.814 320.537,469.404C321.004,468.994 321.61,468.788 322.356,468.788C323.099,468.788 323.704,468.994 324.173,469.404C324.642,469.814 324.876,470.32 324.876,470.921C324.876,471.706 324.483,472.279 323.698,472.638C324.214,472.802 324.617,473.089 324.908,473.499C325.199,473.91 325.345,474.378 325.345,474.906C325.345,475.246 325.278,475.567 325.145,475.87C325.013,476.172 324.822,476.44 324.574,476.672C324.326,476.905 324.012,477.088 323.631,477.223C323.25,477.358 322.825,477.425 322.356,477.425C321.888,477.425 321.462,477.358 321.079,477.223C320.696,477.088 320.382,476.905 320.136,476.672C319.89,476.44 319.7,476.172 319.567,475.87C319.435,475.567 319.368,475.246 319.368,474.906ZM324.313,474.788C324.313,474.3 324.133,473.902 323.771,473.593C323.41,473.285 322.938,473.13 322.356,473.13C321.774,473.13 321.303,473.285 320.941,473.593C320.58,473.902 320.399,474.3 320.399,474.788C320.399,475.292 320.575,475.697 320.927,476.001C321.278,476.306 321.755,476.458 322.356,476.458C322.958,476.458 323.435,476.306 323.786,476.001C324.138,475.697 324.313,475.292 324.313,474.788ZM323.868,470.974C323.868,470.607 323.728,470.307 323.449,470.075C323.17,469.842 322.806,469.726 322.356,469.726C321.907,469.726 321.543,469.842 321.264,470.075C320.984,470.307 320.845,470.607 320.845,470.974C320.845,471.365 320.982,471.676 321.258,471.909C321.533,472.141 321.899,472.257 322.356,472.257C322.813,472.257 323.18,472.141 323.455,471.909C323.73,471.676 323.868,471.365 323.868,470.974Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_57">
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M287.055,456.412L287.889,489.772L225.672,492.274L225.672,458.414L287.055,456.412Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M258.023,470.784L258.023,471.756L253.728,471.756C253.728,472.565 253.628,473.465 253.429,474.457C253.683,474.164 254.002,473.931 254.387,473.757C254.772,473.583 255.189,473.496 255.638,473.496C256.435,473.496 257.096,473.745 257.622,474.241C258.147,474.737 258.41,475.405 258.41,476.245C258.41,477.151 258.129,477.887 257.569,478.454C257.008,479.02 256.259,479.303 255.322,479.303C254.533,479.303 253.857,479.092 253.294,478.67C252.736,478.241 252.404,477.629 252.298,476.836L253.306,476.543C253.4,477.121 253.617,477.565 253.957,477.873C254.296,478.182 254.751,478.336 255.322,478.336C255.955,478.336 256.453,478.155 256.816,477.791C257.179,477.428 257.361,476.954 257.361,476.368C257.361,475.782 257.191,475.313 256.851,474.961C256.511,474.61 256.027,474.434 255.398,474.434C254.992,474.434 254.61,474.54 254.252,474.753C253.895,474.966 253.644,475.231 253.499,475.547L252.398,475.295C252.636,473.737 252.755,472.233 252.755,470.784L258.023,470.784Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M259.189,470.784L264.662,470.784L264.662,471.639C262.818,472.905 261.896,474.768 261.896,477.229C261.896,477.807 261.945,478.459 262.042,479.186L260.9,479.186C260.83,478.635 260.794,478.067 260.794,477.481C260.794,475.09 261.603,473.182 263.22,471.756L259.189,471.756L259.189,470.784Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_56">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M166.791,460.082L225.672,458.414L225.672,492.275L185.306,495.11L174.964,494.276L164.789,489.773L166.791,460.082Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M194.029,470.822L194.029,471.794L189.734,471.794C189.734,472.603 189.635,473.503 189.436,474.496C189.689,474.203 190.009,473.969 190.394,473.795C190.778,473.621 191.195,473.535 191.644,473.535C192.441,473.535 193.103,473.783 193.628,474.279C194.153,474.775 194.416,475.443 194.416,476.283C194.416,477.189 194.136,477.925 193.575,478.492C193.015,479.058 192.266,479.341 191.328,479.341C190.539,479.341 189.863,479.13 189.301,478.708C188.742,478.279 188.41,477.667 188.305,476.874L189.312,476.581C189.406,477.16 189.623,477.603 189.963,477.912C190.303,478.22 190.758,478.374 191.328,478.374C191.961,478.374 192.459,478.193 192.822,477.83C193.186,477.466 193.367,476.992 193.367,476.406C193.367,475.82 193.197,475.351 192.857,474.999C192.518,474.648 192.033,474.472 191.404,474.472C190.998,474.472 190.616,474.579 190.259,474.791C189.901,475.004 189.65,475.269 189.506,475.585L188.404,475.333C188.643,473.775 188.762,472.271 188.762,470.822L194.029,470.822Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M195.394,475.081C195.394,474.464 195.465,473.893 195.605,473.368C195.746,472.842 195.949,472.38 196.215,471.982C196.48,471.583 196.823,471.271 197.243,471.044C197.663,470.818 198.139,470.705 198.67,470.705C199.451,470.705 200.08,470.904 200.557,471.302C201.033,471.701 201.32,472.246 201.418,472.937L200.434,473.236C200.277,472.173 199.67,471.642 198.611,471.642C198.311,471.642 198.03,471.711 197.77,471.85C197.511,471.989 197.28,472.192 197.079,472.459C196.878,472.727 196.719,473.08 196.602,473.517C196.484,473.955 196.426,474.453 196.426,475.011L196.426,475.181C196.625,474.779 196.938,474.452 197.366,474.2C197.794,473.948 198.248,473.822 198.728,473.822C199.252,473.822 199.722,473.943 200.138,474.185C200.554,474.427 200.873,474.75 201.096,475.155C201.318,475.559 201.43,476.003 201.43,476.488C201.43,477.328 201.165,478.013 200.636,478.544C200.106,479.076 199.435,479.341 198.623,479.341C198.1,479.341 197.632,479.236 197.22,479.025C196.808,478.814 196.469,478.519 196.203,478.14C195.937,477.761 195.736,477.313 195.6,476.795C195.463,476.278 195.394,475.706 195.394,475.081ZM200.398,476.581C200.398,476.035 200.224,475.594 199.874,475.26C199.524,474.926 199.074,474.759 198.523,474.759C198.027,474.759 197.603,474.929 197.252,475.269C196.9,475.609 196.725,476.035 196.725,476.546C196.725,477.089 196.9,477.53 197.252,477.868C197.603,478.205 198.053,478.374 198.6,478.374C199.127,478.374 199.559,478.207 199.894,477.873C200.23,477.539 200.398,477.109 200.398,476.581Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_55">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M133.976,385.324L119.297,364.444L113.855,349.132L113.855,344.07L118.79,338.375L126.13,334.959L163.967,334.706L163.967,386.969L133.976,385.324Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M141.93,353.028L141.93,354L137.635,354C137.635,354.809 137.536,355.709 137.336,356.702C137.59,356.409 137.91,356.175 138.294,356.001C138.679,355.828 139.096,355.741 139.545,355.741C140.342,355.741 141.003,355.989 141.529,356.485C142.054,356.981 142.317,357.649 142.317,358.489C142.317,359.395 142.037,360.131 141.476,360.698C140.915,361.264 140.166,361.547 139.229,361.547C138.44,361.547 137.764,361.336 137.202,360.914C136.643,360.485 136.311,359.873 136.206,359.08L137.213,358.788C137.307,359.366 137.524,359.809 137.864,360.118C138.204,360.426 138.659,360.58 139.229,360.58C139.862,360.58 140.36,360.399 140.723,360.036C141.086,359.672 141.268,359.198 141.268,358.612C141.268,358.026 141.098,357.557 140.758,357.205C140.418,356.854 139.934,356.678 139.305,356.678C138.899,356.678 138.517,356.785 138.16,356.997C137.802,357.21 137.551,357.475 137.407,357.791L136.305,357.539C136.543,355.981 136.663,354.477 136.663,353.028L141.93,353.028Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M149.079,353.028L149.079,354L144.784,354C144.784,354.809 144.684,355.709 144.485,356.702C144.739,356.409 145.058,356.175 145.443,356.001C145.828,355.828 146.245,355.741 146.694,355.741C147.491,355.741 148.152,355.989 148.677,356.485C149.203,356.981 149.465,357.649 149.465,358.489C149.465,359.395 149.185,360.131 148.624,360.698C148.064,361.264 147.315,361.547 146.377,361.547C145.588,361.547 144.913,361.336 144.35,360.914C143.791,360.485 143.459,359.873 143.354,359.08L144.362,358.788C144.456,359.366 144.672,359.809 145.012,360.118C145.352,360.426 145.807,360.58 146.377,360.58C147.01,360.58 147.508,360.399 147.872,360.036C148.235,359.672 148.416,359.198 148.416,358.612C148.416,358.026 148.247,357.557 147.907,357.205C147.567,356.854 147.082,356.678 146.454,356.678C146.047,356.678 145.665,356.785 145.308,356.997C144.951,357.21 144.7,357.475 144.555,357.791L143.454,357.539C143.692,355.981 143.811,354.477 143.811,353.028L149.079,353.028Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_54">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M163.967,334.705L192.819,330.276L201.172,330.023L201.172,387.348L163.967,386.968L163.967,334.705Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M181.642,352.628L181.642,353.601L177.347,353.601C177.347,354.409 177.248,355.309 177.048,356.302C177.302,356.009 177.622,355.775 178.006,355.601C178.391,355.428 178.808,355.341 179.257,355.341C180.054,355.341 180.715,355.589 181.241,356.085C181.766,356.581 182.029,357.249 182.029,358.089C182.029,358.995 181.749,359.731 181.188,360.298C180.627,360.864 179.878,361.147 178.941,361.147C178.152,361.147 177.476,360.936 176.914,360.515C176.355,360.085 176.023,359.474 175.917,358.681L176.925,358.388C177.019,358.966 177.236,359.409 177.576,359.718C177.915,360.026 178.371,360.181 178.941,360.181C179.574,360.181 180.072,359.999 180.435,359.636C180.798,359.272 180.98,358.798 180.98,358.212C180.98,357.626 180.81,357.157 180.47,356.806C180.13,356.454 179.646,356.278 179.017,356.278C178.611,356.278 178.229,356.385 177.872,356.598C177.514,356.81 177.263,357.075 177.119,357.392L176.017,357.14C176.255,355.581 176.374,354.077 176.374,352.628L181.642,352.628Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M186.728,361.03L186.728,358.88L182.949,358.88L182.949,357.79C183.328,357.419 183.631,357.075 183.86,356.759C184.088,356.442 184.269,356.1 184.402,355.73C184.535,355.361 184.623,354.986 184.668,354.605C184.713,354.225 184.74,353.747 184.748,353.173L184.748,352.628L185.79,352.628L185.79,353.173C185.79,354.184 185.664,355.071 185.41,355.833C185.16,356.587 184.706,357.292 184.05,357.948L186.728,357.948L186.728,355.224L187.771,355.224L187.771,357.948L189.201,357.948L189.201,358.88L187.771,358.88L187.771,361.03L186.728,361.03Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_53">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M201.171,330.023L237.199,329.211L234.626,388.838L201.171,387.349L201.171,330.023Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M219.536,352.548L219.536,353.52L215.241,353.52C215.241,354.329 215.142,355.229 214.942,356.222C215.196,355.929 215.516,355.695 215.9,355.521C216.285,355.348 216.702,355.261 217.151,355.261C217.948,355.261 218.609,355.509 219.135,356.005C219.66,356.501 219.923,357.169 219.923,358.009C219.923,358.915 219.643,359.651 219.082,360.218C218.521,360.784 217.772,361.067 216.835,361.067C216.046,361.067 215.37,360.856 214.808,360.434C214.249,360.005 213.917,359.393 213.811,358.601L214.819,358.308C214.913,358.886 215.13,359.329 215.47,359.638C215.81,359.946 216.265,360.101 216.835,360.101C217.468,360.101 217.966,359.919 218.329,359.556C218.692,359.192 218.874,358.718 218.874,358.132C218.874,357.546 218.704,357.077 218.364,356.726C218.024,356.374 217.54,356.198 216.911,356.198C216.505,356.198 216.123,356.305 215.766,356.518C215.408,356.73 215.157,356.995 215.013,357.311L213.911,357.06C214.149,355.501 214.269,353.997 214.269,352.548L219.536,352.548Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M220.673,358.647L221.669,358.202C221.743,358.78 221.967,359.241 222.34,359.585C222.713,359.929 223.188,360.1 223.767,360.1C224.31,360.1 224.769,359.928 225.146,359.582C225.523,359.236 225.712,358.788 225.712,358.237C225.712,357.647 225.539,357.184 225.193,356.849C224.848,356.513 224.386,356.345 223.808,356.345C223.577,356.345 223.354,356.382 223.14,356.456C222.925,356.53 222.747,356.632 222.606,356.761L222.003,356.017L224.839,353.52L221.03,353.52L221.03,352.548L226.421,352.548L226.421,353.345L223.796,355.612C223.933,355.585 224.079,355.571 224.235,355.571C224.673,355.571 225.08,355.673 225.457,355.876C225.834,356.079 226.143,356.382 226.383,356.784C226.623,357.186 226.743,357.647 226.743,358.167C226.743,359.026 226.462,359.725 225.899,360.262C225.337,360.799 224.626,361.067 223.767,361.067C222.954,361.067 222.273,360.847 221.725,360.405C221.176,359.964 220.825,359.378 220.673,358.647Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_52">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M237.199,329.211L277.909,337.989L270.645,389.17L234.626,388.838L237.199,329.211Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M254.286,353.418L254.286,354.391L249.991,354.391C249.991,355.199 249.892,356.1 249.692,357.092C249.946,356.799 250.266,356.565 250.65,356.392C251.035,356.218 251.452,356.131 251.901,356.131C252.698,356.131 253.359,356.379 253.885,356.875C254.41,357.371 254.673,358.039 254.673,358.879C254.673,359.785 254.393,360.521 253.832,361.088C253.271,361.654 252.522,361.937 251.585,361.937C250.796,361.937 250.12,361.726 249.558,361.305C248.999,360.875 248.667,360.264 248.561,359.471L249.569,359.178C249.663,359.756 249.88,360.199 250.22,360.508C250.56,360.816 251.015,360.971 251.585,360.971C252.218,360.971 252.716,360.789 253.079,360.426C253.442,360.062 253.624,359.588 253.624,359.002C253.624,358.416 253.454,357.947 253.114,357.596C252.774,357.244 252.29,357.068 251.661,357.068C251.255,357.068 250.873,357.175 250.516,357.388C250.158,357.601 249.907,357.865 249.763,358.182L248.661,357.93C248.899,356.371 249.019,354.867 249.019,353.418L254.286,353.418Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M258.147,358.451C258.788,358.119 259.231,357.871 259.477,357.707C259.813,357.484 260.067,357.236 260.239,356.963C260.411,356.689 260.497,356.365 260.497,355.99C260.497,355.463 260.323,355.039 259.976,354.719C259.628,354.398 259.159,354.238 258.569,354.238C258.034,354.238 257.588,354.403 257.23,354.733C256.873,355.063 256.694,355.461 256.694,355.926C256.694,356.41 256.851,356.848 257.163,357.238L256.272,357.812C255.851,357.262 255.64,356.658 255.64,356.002C255.64,355.244 255.916,354.604 256.469,354.083C257.021,353.561 257.737,353.301 258.616,353.301C259.519,353.301 260.232,353.544 260.758,354.03C261.283,354.516 261.546,355.152 261.546,355.937C261.546,356.605 261.379,357.162 261.045,357.607C260.711,358.053 260.192,358.453 259.489,358.808C259.005,359.066 258.589,359.295 258.241,359.494C257.952,359.658 257.703,359.857 257.494,360.092C257.285,360.326 257.159,360.578 257.116,360.848L261.558,360.848L261.558,361.82L255.821,361.82C255.821,361.269 255.917,360.78 256.108,360.352C256.3,359.925 256.561,359.563 256.891,359.268C257.221,358.974 257.64,358.701 258.147,358.451Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_51">
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M277.91,337.989L319.67,349.26L315.107,391.374L270.646,389.169L277.91,337.989Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M296.409,358.388L296.409,359.36L292.114,359.36C292.114,360.169 292.015,361.069 291.815,362.061C292.069,361.768 292.389,361.535 292.773,361.361C293.158,361.187 293.575,361.1 294.024,361.1C294.821,361.1 295.482,361.349 296.008,361.845C296.533,362.341 296.796,363.009 296.796,363.849C296.796,364.755 296.516,365.491 295.955,366.058C295.394,366.624 294.645,366.907 293.708,366.907C292.919,366.907 292.243,366.696 291.681,366.274C291.122,365.845 290.79,365.233 290.685,364.44L291.692,364.147C291.786,364.725 292.003,365.169 292.343,365.477C292.683,365.786 293.138,365.94 293.708,365.94C294.341,365.94 294.839,365.759 295.202,365.395C295.565,365.032 295.747,364.558 295.747,363.972C295.747,363.386 295.577,362.917 295.237,362.565C294.897,362.214 294.413,362.038 293.784,362.038C293.378,362.038 292.996,362.144 292.639,362.357C292.281,362.57 292.03,362.835 291.886,363.151L290.784,362.899C291.022,361.341 291.142,359.837 291.142,358.388L296.409,358.388Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M299.708,366.79L299.708,360.034C299.536,360.425 299.253,360.745 298.858,360.995C298.456,361.249 298.052,361.393 297.645,361.429L297.44,360.356C298.065,360.29 298.585,360.088 298.999,359.75C299.413,359.412 299.69,358.958 299.831,358.388L300.751,358.388L300.751,366.79L299.708,366.79Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_50">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M319.671,349.259L363.444,360.236L368.767,365.209L368.767,369.377L346.307,394.615L339.651,392.125L315.108,391.373L319.671,349.259Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M336.595,368.378L336.595,369.351L332.3,369.351C332.3,370.159 332.201,371.059 332.001,372.052C332.255,371.759 332.575,371.525 332.959,371.351C333.344,371.178 333.761,371.091 334.21,371.091C335.007,371.091 335.668,371.339 336.194,371.835C336.719,372.331 336.982,372.999 336.982,373.839C336.982,374.745 336.702,375.481 336.141,376.048C335.581,376.614 334.832,376.897 333.894,376.897C333.105,376.897 332.429,376.686 331.867,376.265C331.308,375.835 330.976,375.224 330.871,374.431L331.878,374.138C331.972,374.716 332.189,375.159 332.529,375.468C332.869,375.776 333.324,375.931 333.894,375.931C334.527,375.931 335.025,375.749 335.388,375.386C335.751,375.022 335.933,374.548 335.933,373.962C335.933,373.376 335.763,372.907 335.423,372.556C335.083,372.204 334.599,372.028 333.97,372.028C333.564,372.028 333.182,372.135 332.825,372.348C332.467,372.56 332.216,372.825 332.072,373.142L330.97,372.89C331.208,371.331 331.328,369.827 331.328,368.378L336.595,368.378Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M338.874,375.723C338.265,374.939 337.96,373.892 337.96,372.579C337.96,371.267 338.265,370.219 338.874,369.435C339.484,368.652 340.298,368.261 341.318,368.261C342.345,368.261 343.164,368.651 343.776,369.433C344.387,370.214 344.693,371.263 344.693,372.579C344.693,373.895 344.387,374.944 343.776,375.725C343.164,376.507 342.345,376.897 341.318,376.897C340.298,376.897 339.484,376.506 338.874,375.723ZM343.65,372.579C343.65,371.591 343.445,370.778 343.035,370.142C342.644,369.513 342.072,369.198 341.318,369.198C340.58,369.198 340.009,369.513 339.607,370.142C339.197,370.778 338.992,371.591 338.992,372.579C338.992,373.567 339.197,374.38 339.607,375.017C340.013,375.649 340.583,375.966 341.318,375.966C342.068,375.966 342.64,375.649 343.035,375.017C343.445,374.38 343.65,373.567 343.65,372.579Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_48">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M356.667,402.79L387.973,368.096L390.818,371.62L392.716,394.93L412.231,457.676L380.519,465.537L372.116,430.436L364.527,430.979L364.256,423.796C364.256,423.796 363.037,408.889 356.667,402.79Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M384.453,427.46L384.453,425.31L380.673,425.31L380.673,424.22C381.052,423.849 381.356,423.505 381.584,423.189C381.813,422.872 381.994,422.53 382.126,422.161C382.259,421.791 382.348,421.416 382.393,421.036C382.438,420.655 382.464,420.177 382.472,419.603L382.472,419.058L383.515,419.058L383.515,419.603C383.515,420.615 383.388,421.501 383.134,422.263C382.884,423.017 382.431,423.722 381.775,424.378L384.453,424.378L384.453,421.654L385.496,421.654L385.496,424.378L386.925,424.378L386.925,425.31L385.496,425.31L385.496,427.46L384.453,427.46Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M387.699,425.058C387.699,424.531 387.844,424.062 388.135,423.652C388.426,423.242 388.83,422.954 389.345,422.79C388.56,422.431 388.167,421.859 388.167,421.074C388.167,420.472 388.401,419.966 388.868,419.556C389.334,419.146 389.941,418.941 390.687,418.941C391.429,418.941 392.035,419.146 392.503,419.556C392.972,419.966 393.207,420.472 393.207,421.074C393.207,421.859 392.814,422.431 392.029,422.79C392.544,422.954 392.948,423.242 393.239,423.652C393.53,424.062 393.675,424.531 393.675,425.058C393.675,425.398 393.609,425.719 393.476,426.022C393.343,426.325 393.153,426.592 392.905,426.825C392.657,427.057 392.342,427.241 391.961,427.375C391.581,427.51 391.156,427.578 390.687,427.578C390.218,427.578 389.792,427.51 389.41,427.375C389.027,427.241 388.712,427.057 388.466,426.825C388.22,426.592 388.031,426.325 387.898,426.022C387.765,425.719 387.699,425.398 387.699,425.058ZM392.644,424.941C392.644,424.453 392.463,424.054 392.102,423.746C391.741,423.437 391.269,423.283 390.687,423.283C390.105,423.283 389.633,423.437 389.272,423.746C388.911,424.054 388.73,424.453 388.73,424.941C388.73,425.445 388.906,425.849 389.257,426.154C389.609,426.458 390.085,426.611 390.687,426.611C391.289,426.611 391.765,426.458 392.117,426.154C392.468,425.849 392.644,425.445 392.644,424.941ZM392.199,421.126C392.199,420.759 392.059,420.459 391.78,420.227C391.5,419.995 391.136,419.878 390.687,419.878C390.238,419.878 389.873,419.995 389.594,420.227C389.315,420.459 389.175,420.759 389.175,421.126C389.175,421.517 389.313,421.829 389.588,422.061C389.864,422.293 390.23,422.41 390.687,422.41C391.144,422.41 391.51,422.293 391.786,422.061C392.061,421.829 392.199,421.517 392.199,421.126Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_47">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M370.847,480.146L385.135,480.146L406.662,476.104L409.482,490.204L423.206,508.629L380.717,533.163L370.847,480.146Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M389.634,502.981L389.634,500.831L385.855,500.831L385.855,499.741C386.234,499.37 386.538,499.026 386.766,498.71C386.995,498.393 387.175,498.051 387.308,497.682C387.441,497.312 387.53,496.937 387.575,496.557C387.62,496.176 387.646,495.698 387.654,495.124L387.654,494.579L388.697,494.579L388.697,495.124C388.697,496.136 388.57,497.022 388.316,497.784C388.066,498.538 387.613,499.243 386.956,499.899L389.634,499.899L389.634,497.175L390.677,497.175L390.677,499.899L392.107,499.899L392.107,500.831L390.677,500.831L390.677,502.981L389.634,502.981Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M392.259,494.579L397.732,494.579L397.732,495.434C395.888,496.7 394.966,498.563 394.966,501.024C394.966,501.602 395.015,502.255 395.113,502.981L393.97,502.981C393.9,502.431 393.865,501.862 393.865,501.276C393.865,498.886 394.673,496.977 396.29,495.552L392.259,495.552L392.259,494.579Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_46">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M403.748,561.741L416.908,556.007L444.075,532.788L434.205,524.61L423.207,508.63L380.717,533.164L384.477,551.307L392.186,545.855L403.748,561.741Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M409.305,542.215L409.305,540.065L405.525,540.065L405.525,538.975C405.904,538.604 406.208,538.26 406.436,537.944C406.665,537.627 406.846,537.285 406.978,536.915C407.111,536.546 407.2,536.171 407.245,535.79C407.29,535.41 407.316,534.932 407.324,534.358L407.324,533.813L408.367,533.813L408.367,534.358C408.367,535.37 408.24,536.256 407.986,537.018C407.736,537.772 407.283,538.477 406.627,539.133L409.305,539.133L409.305,536.409L410.348,536.409L410.348,539.133L411.777,539.133L411.777,540.065L410.348,540.065L410.348,542.215L409.305,542.215Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M412.48,538.073C412.48,537.455 412.551,536.884 412.691,536.359C412.832,535.833 413.035,535.371 413.301,534.973C413.566,534.575 413.909,534.262 414.329,534.036C414.749,533.809 415.225,533.696 415.756,533.696C416.537,533.696 417.166,533.895 417.643,534.293C418.119,534.692 418.406,535.237 418.504,535.928L417.519,536.227C417.363,535.164 416.756,534.633 415.697,534.633C415.396,534.633 415.116,534.703 414.856,534.841C414.597,534.98 414.366,535.183 414.165,535.451C413.964,535.718 413.805,536.071 413.687,536.508C413.57,536.946 413.512,537.444 413.512,538.002L413.512,538.172C413.711,537.77 414.024,537.443 414.452,537.191C414.88,536.939 415.334,536.813 415.814,536.813C416.338,536.813 416.808,536.934 417.224,537.176C417.64,537.418 417.959,537.742 418.182,538.146C418.404,538.55 418.516,538.995 418.516,539.479C418.516,540.319 418.251,541.004 417.722,541.536C417.192,542.067 416.521,542.332 415.709,542.332C415.185,542.332 414.718,542.227 414.306,542.016C413.893,541.805 413.555,541.51 413.289,541.131C413.023,540.752 412.822,540.304 412.685,539.787C412.549,539.269 412.48,538.698 412.48,538.073ZM417.484,539.573C417.484,539.026 417.31,538.585 416.96,538.251C416.61,537.917 416.16,537.75 415.609,537.75C415.113,537.75 414.689,537.92 414.338,538.26C413.986,538.6 413.811,539.026 413.811,539.538C413.811,540.08 413.986,540.521 414.338,540.859C414.689,541.197 415.139,541.366 415.686,541.366C416.213,541.366 416.644,541.199 416.98,540.865C417.316,540.531 417.484,540.1 417.484,539.573Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_45">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M450.984,541.154L478.15,542.376L476.835,583.173L433.782,585.617L411.785,581.951L400.974,572.175L450.984,541.154Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M442.483,569.331L442.483,567.181L438.704,567.181L438.704,566.091C439.083,565.72 439.387,565.376 439.615,565.06C439.844,564.744 440.024,564.401 440.157,564.032C440.29,563.663 440.379,563.288 440.424,562.907C440.469,562.526 440.495,562.048 440.503,561.474L440.503,560.929L441.546,560.929L441.546,561.474C441.546,562.486 441.419,563.372 441.165,564.134C440.915,564.888 440.462,565.593 439.806,566.249L442.483,566.249L442.483,563.525L443.526,563.525L443.526,566.249L444.956,566.249L444.956,567.181L443.526,567.181L443.526,569.331L442.483,569.331Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M451.442,560.929L451.442,561.902L447.147,561.902C447.147,562.71 447.048,563.611 446.849,564.603C447.102,564.31 447.422,564.077 447.807,563.903C448.191,563.729 448.608,563.642 449.058,563.642C449.854,563.642 450.516,563.89 451.041,564.386C451.566,564.882 451.829,565.55 451.829,566.39C451.829,567.296 451.549,568.033 450.988,568.599C450.428,569.165 449.679,569.449 448.741,569.449C447.952,569.449 447.276,569.238 446.714,568.816C446.155,568.386 445.823,567.775 445.718,566.982L446.726,566.689C446.819,567.267 447.036,567.71 447.376,568.019C447.716,568.328 448.171,568.482 448.741,568.482C449.374,568.482 449.872,568.3 450.235,567.937C450.599,567.574 450.78,567.099 450.78,566.513C450.78,565.927 450.61,565.458 450.27,565.107C449.931,564.755 449.446,564.58 448.817,564.58C448.411,564.58 448.029,564.686 447.672,564.899C447.314,565.112 447.063,565.376 446.919,565.693L445.817,565.441C446.056,563.882 446.175,562.378 446.175,560.929L451.442,560.929Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_44">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M528.169,542.766L528.169,558.988L531.014,558.988L531.014,580.52L476.835,583.173L478.151,542.376L528.169,542.766Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M499.978,571.144L499.978,568.994L496.199,568.994L496.199,567.904C496.578,567.533 496.882,567.189 497.11,566.872C497.339,566.556 497.519,566.213 497.652,565.844C497.785,565.475 497.874,565.1 497.919,564.719C497.964,564.338 497.99,563.861 497.998,563.287L497.998,562.742L499.041,562.742L499.041,563.287C499.041,564.298 498.914,565.185 498.66,565.947C498.41,566.701 497.957,567.406 497.301,568.062L499.978,568.062L499.978,565.337L501.021,565.337L501.021,568.062L502.451,568.062L502.451,568.994L501.021,568.994L501.021,571.144L499.978,571.144Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M506.875,571.144L506.875,568.994L503.096,568.994L503.096,567.904C503.475,567.533 503.778,567.189 504.007,566.872C504.235,566.556 504.416,566.213 504.549,565.844C504.682,565.475 504.77,565.1 504.815,564.719C504.86,564.338 504.887,563.861 504.894,563.287L504.894,562.742L505.937,562.742L505.937,563.287C505.937,564.298 505.81,565.185 505.557,565.947C505.307,566.701 504.853,567.406 504.197,568.062L506.875,568.062L506.875,565.337L507.918,565.337L507.918,568.062L509.348,568.062L509.348,568.994L507.918,568.994L507.918,571.144L506.875,571.144Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_43">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M533.042,542.778L586.26,541.295L583.923,577.682L531.012,580.519L531.012,558.988L533.042,558.988L533.042,542.778Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M555.079,568.342L555.079,566.192L551.3,566.192L551.3,565.102C551.679,564.731 551.982,564.387 552.211,564.071C552.439,563.754 552.62,563.412 552.753,563.042C552.886,562.673 552.975,562.298 553.019,561.917C553.064,561.537 553.091,561.059 553.099,560.485L553.099,559.94L554.142,559.94L554.142,560.485C554.142,561.496 554.015,562.383 553.761,563.145C553.511,563.899 553.058,564.604 552.401,565.26L555.079,565.26L555.079,562.536L556.122,562.536L556.122,565.26L557.552,565.26L557.552,566.192L556.122,566.192L556.122,568.342L555.079,568.342Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M558.325,566.039L559.321,565.594C559.395,566.172 559.619,566.633 559.992,566.977C560.365,567.321 560.841,567.493 561.419,567.493C561.962,567.493 562.422,567.32 562.799,566.974C563.176,566.628 563.364,566.18 563.364,565.629C563.364,565.039 563.191,564.577 562.846,564.241C562.5,563.905 562.038,563.737 561.46,563.737C561.229,563.737 561.007,563.774 560.792,563.848C560.577,563.922 560.399,564.024 560.259,564.153L559.655,563.409L562.491,560.913L558.683,560.913L558.683,559.94L564.073,559.94L564.073,560.737L561.448,563.004C561.585,562.977 561.731,562.963 561.888,562.963C562.325,562.963 562.732,563.065 563.109,563.268C563.486,563.471 563.795,563.774 564.035,564.176C564.275,564.579 564.395,565.039 564.395,565.559C564.395,566.418 564.114,567.117 563.552,567.654C562.989,568.191 562.278,568.459 561.419,568.459C560.606,568.459 559.926,568.239 559.377,567.797C558.828,567.356 558.478,566.77 558.325,566.039Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_42">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M586.26,541.295L583.923,577.682L643.01,574.177L643.011,540.293L586.26,541.295Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M614.108,564.417L614.108,562.267L610.329,562.267L610.329,561.177C610.708,560.806 611.012,560.462 611.24,560.146C611.469,559.829 611.649,559.487 611.782,559.118C611.915,558.748 612.004,558.373 612.049,557.993C612.094,557.612 612.12,557.134 612.128,556.56L612.128,556.015L613.171,556.015L613.171,556.56C613.171,557.572 613.044,558.458 612.79,559.22C612.54,559.974 612.087,560.679 611.431,561.335L614.108,561.335L614.108,558.611L615.151,558.611L615.151,561.335L616.581,561.335L616.581,562.267L615.151,562.267L615.151,564.417L614.108,564.417Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M619.78,561.048C620.421,560.716 620.864,560.468 621.11,560.304C621.446,560.081 621.7,559.833 621.872,559.56C622.044,559.287 622.13,558.962 622.13,558.587C622.13,558.06 621.956,557.636 621.608,557.316C621.261,556.996 620.792,556.835 620.202,556.835C619.667,556.835 619.221,557 618.863,557.33C618.506,557.661 618.327,558.058 618.327,558.523C618.327,559.007 618.483,559.445 618.796,559.835L617.905,560.41C617.483,559.859 617.272,559.255 617.272,558.599C617.272,557.841 617.549,557.202 618.102,556.68C618.654,556.159 619.37,555.898 620.249,555.898C621.151,555.898 621.865,556.141 622.391,556.627C622.916,557.114 623.179,557.749 623.179,558.535C623.179,559.203 623.012,559.759 622.678,560.204C622.344,560.65 621.825,561.05 621.122,561.406C620.638,561.663 620.222,561.892 619.874,562.091C619.585,562.255 619.336,562.454 619.127,562.689C618.918,562.923 618.792,563.175 618.749,563.445L623.19,563.445L623.19,564.417L617.454,564.417C617.454,563.867 617.55,563.377 617.741,562.95C617.933,562.522 618.193,562.161 618.523,561.866C618.853,561.571 619.272,561.298 619.78,561.048Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_41">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M704.675,539L704.675,560.903L707.471,560.852L707.471,570.565L643.011,574.177L643.011,540.293L704.675,539Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M671.676,561.72L671.676,559.57L667.896,559.57L667.896,558.48C668.275,558.109 668.579,557.765 668.808,557.449C669.036,557.132 669.217,556.789 669.35,556.42C669.482,556.051 669.571,555.676 669.616,555.295C669.661,554.914 669.687,554.437 669.695,553.863L669.695,553.318L670.738,553.318L670.738,553.863C670.738,554.874 670.611,555.761 670.357,556.523C670.107,557.277 669.654,557.982 668.998,558.638L671.676,558.638L671.676,555.913L672.719,555.913L672.719,558.638L674.148,558.638L674.148,559.57L672.719,559.57L672.719,561.72L671.676,561.72Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M676.592,561.72L676.592,554.964C676.42,555.355 676.137,555.675 675.742,555.925C675.34,556.179 674.936,556.324 674.529,556.359L674.324,555.287C674.949,555.22 675.469,555.018 675.883,554.68C676.297,554.342 676.574,553.888 676.715,553.318L677.635,553.318L677.635,561.72L676.592,561.72Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_40">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M707.47,560.852L707.47,570.565L741.202,569.329C741.202,569.329 743.234,568.957 748.619,571.272L772.108,535.774L757.626,535.774L741.378,537.893L709.589,538.953L709.589,560.903L707.47,560.852Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M727.526,555.945L727.526,553.794L723.747,553.794L723.747,552.705C724.126,552.333 724.43,551.99 724.658,551.673C724.887,551.357 725.067,551.014 725.2,550.645C725.333,550.276 725.422,549.901 725.467,549.52C725.512,549.139 725.538,548.662 725.546,548.087L725.546,547.542L726.589,547.542L726.589,548.087C726.589,549.099 726.462,549.986 726.208,550.747C725.958,551.501 725.505,552.206 724.849,552.863L727.526,552.863L727.526,550.138L728.569,550.138L728.569,552.863L729.999,552.863L729.999,553.794L728.569,553.794L728.569,555.945L727.526,555.945Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M731.698,554.887C731.089,554.104 730.784,553.056 730.784,551.744C730.784,550.431 731.089,549.383 731.698,548.6C732.308,547.817 733.122,547.425 734.142,547.425C735.169,547.425 735.988,547.816 736.6,548.597C737.211,549.378 737.517,550.427 737.517,551.744C737.517,553.06 737.211,554.109 736.6,554.89C735.988,555.671 735.169,556.062 734.142,556.062C733.122,556.062 732.308,555.67 731.698,554.887ZM736.474,551.744C736.474,550.755 736.269,549.943 735.858,549.306C735.468,548.677 734.895,548.363 734.142,548.363C733.403,548.363 732.833,548.677 732.431,549.306C732.02,549.943 731.815,550.755 731.815,551.744C731.815,552.732 732.02,553.544 732.431,554.181C732.837,554.814 733.407,555.13 734.142,555.13C734.892,555.13 735.464,554.814 735.858,554.181C736.269,553.544 736.474,552.732 736.474,551.744Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_29">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M417.615,601.861L421.719,656.581L358.791,650.944L364.067,625.312L372.08,607.333C372.08,607.333 381.656,604.206 399.636,603.034L417.615,601.861Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M387.49,632.023C388.13,631.691 388.574,631.443 388.82,631.279C389.156,631.056 389.41,630.808 389.582,630.535C389.753,630.261 389.839,629.937 389.839,629.562C389.839,629.035 389.665,628.611 389.318,628.29C388.97,627.97 388.501,627.81 387.912,627.81C387.376,627.81 386.93,627.975 386.573,628.305C386.215,628.635 386.037,629.033 386.037,629.497C386.037,629.982 386.193,630.419 386.505,630.81L385.615,631.384C385.193,630.833 384.982,630.23 384.982,629.574C384.982,628.816 385.258,628.176 385.811,627.655C386.364,627.133 387.08,626.872 387.958,626.872C388.861,626.872 389.575,627.116 390.1,627.602C390.625,628.088 390.888,628.724 390.888,629.509C390.888,630.177 390.721,630.734 390.387,631.179C390.053,631.624 389.535,632.025 388.832,632.38C388.347,632.638 387.931,632.867 387.583,633.066C387.294,633.23 387.045,633.429 386.836,633.663C386.627,633.898 386.501,634.15 386.458,634.419L390.9,634.419L390.9,635.392L385.164,635.392C385.164,634.841 385.259,634.352 385.451,633.924C385.642,633.497 385.903,633.135 386.233,632.84C386.563,632.545 386.982,632.273 387.49,632.023Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M391.89,633.031L392.91,632.726C392.96,633.316 393.156,633.766 393.496,634.077C393.835,634.387 394.296,634.542 394.878,634.542C395.554,634.542 396.09,634.254 396.487,633.678C396.883,633.102 397.083,632.285 397.087,631.226L397.076,630.798C396.888,631.287 396.593,631.674 396.191,631.961C395.789,632.248 395.324,632.392 394.796,632.392C393.968,632.392 393.299,632.134 392.789,631.619C392.28,631.103 392.025,630.464 392.025,629.703C392.025,629.288 392.097,628.905 392.242,628.551C392.386,628.198 392.583,627.899 392.833,627.655C393.083,627.411 393.379,627.219 393.721,627.08C394.063,626.942 394.429,626.872 394.82,626.872C395.937,626.872 396.753,627.273 397.269,628.074C397.789,628.871 398.048,629.902 398.048,631.167C398.048,631.64 398.011,632.087 397.937,632.509C397.863,632.931 397.742,633.327 397.574,633.696C397.406,634.065 397.199,634.382 396.953,634.648C396.707,634.913 396.402,635.123 396.039,635.278C395.675,635.432 395.269,635.509 394.82,635.509C394.007,635.509 393.338,635.274 392.813,634.803C392.288,634.332 391.98,633.742 391.89,633.031ZM396.701,629.632C396.701,629.105 396.529,628.669 396.185,628.326C395.853,627.982 395.417,627.81 394.878,627.81C394.347,627.81 393.912,627.986 393.572,628.337C393.236,628.685 393.068,629.128 393.068,629.667C393.068,630.21 393.236,630.644 393.572,630.968C393.908,631.292 394.343,631.454 394.878,631.454C395.41,631.454 395.846,631.286 396.188,630.948C396.53,630.61 396.701,630.171 396.701,629.632Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-13 22:23:28 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_39" transform="matrix(1,0,0,1,0.183667,0.031693)">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M772.108,535.774L799.482,535.774L810.078,538.776L818.909,555.907L818.909,562.618L766.457,591.228C766.457,591.228 761.512,574.451 748.619,571.272L772.108,535.774Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
|
|
|
|
<path d="M777.197,563.592L778.193,563.147C778.268,563.725 778.491,564.186 778.864,564.53C779.237,564.873 779.713,565.045 780.291,565.045C780.834,565.045 781.294,564.872 781.671,564.527C782.048,564.181 782.236,563.733 782.236,563.182C782.236,562.592 782.063,562.129 781.718,561.793C781.372,561.457 780.91,561.289 780.332,561.289C780.102,561.289 779.879,561.327 779.664,561.401C779.449,561.475 779.271,561.577 779.131,561.705L778.527,560.961L781.363,558.465L777.555,558.465L777.555,557.493L782.945,557.493L782.945,558.289L780.32,560.557C780.457,560.53 780.603,560.516 780.76,560.516C781.197,560.516 781.604,560.618 781.981,560.821C782.358,561.024 782.667,561.327 782.907,561.729C783.147,562.131 783.268,562.592 783.268,563.112C783.268,563.971 782.986,564.669 782.424,565.206C781.861,565.744 781.15,566.012 780.291,566.012C779.478,566.012 778.798,565.791 778.249,565.35C777.7,564.909 777.35,564.323 777.197,563.592Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M784.287,563.534L785.307,563.229C785.357,563.819 785.553,564.269 785.893,564.579C786.232,564.89 786.693,565.045 787.275,565.045C787.951,565.045 788.487,564.757 788.884,564.181C789.28,563.605 789.48,562.788 789.484,561.729L789.473,561.301C789.285,561.789 788.99,562.177 788.588,562.464C788.185,562.751 787.721,562.895 787.193,562.895C786.365,562.895 785.696,562.637 785.186,562.121C784.677,561.606 784.422,560.967 784.422,560.205C784.422,559.791 784.494,559.408 784.639,559.054C784.783,558.701 784.98,558.402 785.23,558.158C785.48,557.913 785.776,557.722 786.118,557.583C786.46,557.445 786.826,557.375 787.217,557.375C788.334,557.375 789.15,557.776 789.666,558.577C790.186,559.373 790.445,560.405 790.445,561.67C790.445,562.143 790.408,562.59 790.334,563.012C790.26,563.434 790.139,563.829 789.971,564.199C789.803,564.568 789.596,564.885 789.35,565.151C789.103,565.416 788.799,565.626 788.436,565.781C788.072,565.935 787.666,566.012 787.217,566.012C786.404,566.012 785.735,565.777 785.21,565.306C784.685,564.835 784.377,564.245 784.287,563.534ZM789.098,560.135C789.098,559.608 788.926,559.172 788.582,558.829C788.25,558.485 787.814,558.313 787.275,558.313C786.744,558.313 786.309,558.489 785.969,558.84C785.633,559.188 785.465,559.631 785.465,560.17C785.465,560.713 785.633,561.147 785.969,561.471C786.305,561.795 786.74,561.957 787.275,561.957C787.807,561.957 788.243,561.788 788.585,561.451C788.927,561.113 789.098,560.674 789.098,560.135Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_38" transform="matrix(1,0,0,1,0.183667,0.031693)">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M818.91,562.618L815.555,630.258L785.708,623.724L769.459,613.127C769.459,613.127 768.223,594.23 766.458,591.228L818.91,562.618Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
|
|
|
|
<path d="M787.834,602.001L788.83,601.556C788.904,602.134 789.128,602.595 789.501,602.939C789.874,603.283 790.35,603.454 790.928,603.454C791.471,603.454 791.931,603.282 792.308,602.936C792.685,602.59 792.873,602.142 792.873,601.591C792.873,601.001 792.7,600.538 792.354,600.203C792.009,599.867 791.547,599.699 790.969,599.699C790.738,599.699 790.516,599.736 790.301,599.81C790.086,599.884 789.908,599.986 789.768,600.115L789.164,599.371L792,596.874L788.191,596.874L788.191,595.902L793.582,595.902L793.582,596.699L790.957,598.966C791.094,598.939 791.24,598.925 791.396,598.925C791.834,598.925 792.241,599.027 792.618,599.23C792.995,599.433 793.304,599.736 793.544,600.138C793.784,600.54 793.904,601.001 793.904,601.521C793.904,602.38 793.623,603.079 793.06,603.616C792.498,604.153 791.787,604.421 790.928,604.421C790.115,604.421 789.435,604.201 788.886,603.759C788.337,603.318 787.986,602.732 787.834,602.001Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M794.924,601.902C794.924,601.374 795.069,600.906 795.36,600.496C795.651,600.085 796.055,599.798 796.57,599.634C795.785,599.275 795.393,598.703 795.393,597.917C795.393,597.316 795.626,596.81 796.093,596.4C796.56,595.99 797.166,595.785 797.912,595.785C798.654,595.785 799.26,595.99 799.728,596.4C800.197,596.81 800.432,597.316 800.432,597.917C800.432,598.703 800.039,599.275 799.254,599.634C799.769,599.798 800.173,600.085 800.464,600.496C800.755,600.906 800.9,601.374 800.9,601.902C800.9,602.242 800.834,602.563 800.701,602.866C800.568,603.168 800.378,603.436 800.13,603.668C799.882,603.901 799.567,604.084 799.186,604.219C798.806,604.354 798.381,604.421 797.912,604.421C797.443,604.421 797.018,604.354 796.635,604.219C796.252,604.084 795.937,603.901 795.691,603.668C795.445,603.436 795.256,603.168 795.123,602.866C794.99,602.563 794.924,602.242 794.924,601.902ZM799.869,601.785C799.869,601.296 799.688,600.898 799.327,600.589C798.966,600.281 798.494,600.126 797.912,600.126C797.33,600.126 796.858,600.281 796.497,600.589C796.136,600.898 795.955,601.296 795.955,601.785C795.955,602.288 796.131,602.693 796.482,602.997C796.834,603.302 797.31,603.454 797.912,603.454C798.514,603.454 798.99,603.302 799.342,602.997C799.693,602.693 799.869,602.288 799.869,601.785ZM799.424,597.97C799.424,597.603 799.284,597.303 799.005,597.071C798.726,596.838 798.361,596.722 797.912,596.722C797.463,596.722 797.099,596.838 796.819,597.071C796.54,597.303 796.4,597.603 796.4,597.97C796.4,598.361 796.538,598.672 796.813,598.905C797.089,599.137 797.455,599.253 797.912,599.253C798.369,599.253 798.735,599.137 799.011,598.905C799.286,598.672 799.424,598.361 799.424,597.97Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-13 22:23:28 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_36">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M801.251,715.541L767.44,719.426L737.514,682.018C737.514,682.018 750.75,680.58 759.671,664.754L777.8,657.128L811.466,657.128L801.251,715.541Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
|
|
|
|
<path d="M771.171,688.659L772.167,688.213C772.241,688.791 772.465,689.252 772.838,689.596C773.211,689.94 773.686,690.112 774.265,690.112C774.808,690.112 775.268,689.939 775.644,689.593C776.021,689.247 776.21,688.799 776.21,688.248C776.21,687.659 776.037,687.196 775.691,686.86C775.346,686.524 774.884,686.356 774.306,686.356C774.075,686.356 773.852,686.393 773.638,686.467C773.423,686.541 773.245,686.643 773.104,686.772L772.501,686.028L775.337,683.532L771.528,683.532L771.528,682.559L776.919,682.559L776.919,683.356L774.294,685.623C774.431,685.596 774.577,685.582 774.733,685.582C775.171,685.582 775.578,685.684 775.955,685.887C776.332,686.09 776.641,686.393 776.881,686.795C777.121,687.198 777.241,687.659 777.241,688.178C777.241,689.038 776.96,689.736 776.397,690.273C775.835,690.81 775.124,691.079 774.265,691.079C773.452,691.079 772.771,690.858 772.223,690.416C771.674,689.975 771.323,689.389 771.171,688.659Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M778.249,686.819C778.249,686.202 778.319,685.63 778.46,685.105C778.601,684.579 778.804,684.118 779.069,683.719C779.335,683.321 779.678,683.008 780.098,682.782C780.518,682.555 780.993,682.442 781.524,682.442C782.306,682.442 782.935,682.641 783.411,683.039C783.888,683.438 784.175,683.983 784.272,684.674L783.288,684.973C783.132,683.911 782.524,683.379 781.466,683.379C781.165,683.379 780.885,683.449 780.625,683.587C780.365,683.726 780.135,683.929 779.934,684.197C779.732,684.464 779.573,684.817 779.456,685.254C779.339,685.692 779.28,686.19 779.28,686.748L779.28,686.918C779.479,686.516 779.793,686.189 780.221,685.937C780.648,685.685 781.102,685.559 781.583,685.559C782.106,685.559 782.576,685.68 782.992,685.922C783.408,686.164 783.727,686.488 783.95,686.892C784.173,687.296 784.284,687.741 784.284,688.225C784.284,689.065 784.019,689.75 783.49,690.282C782.961,690.813 782.29,691.079 781.477,691.079C780.954,691.079 780.486,690.973 780.074,690.762C779.662,690.551 779.323,690.256 779.058,689.877C778.792,689.498 778.591,689.05 778.454,688.533C778.317,688.015 778.249,687.444 778.249,686.819ZM783.253,688.319C783.253,687.772 783.078,687.331 782.728,686.997C782.379,686.663 781.929,686.496 781.378,686.496C780.882,686.496 780.458,686.666 780.106,687.006C779.755,687.346 779.579,687.772 779.579,688.284C779.579,688.827 779.755,689.267 780.106,689.605C780.458,689.943 780.907,690.112 781.454,690.112C781.981,690.112 782.413,689.945 782.749,689.611C783.085,689.277 783.253,688.846 783.253,688.319Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_35">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M737.515,682.02L767.44,719.426L708.021,731.655L701.115,687.198L737.515,682.02Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
|
|
|
|
<path d="M717.353,709.282L718.35,708.836C718.424,709.414 718.647,709.875 719.02,710.219C719.394,710.563 719.869,710.735 720.447,710.735C720.99,710.735 721.45,710.562 721.827,710.216C722.204,709.871 722.393,709.422 722.393,708.871C722.393,708.282 722.22,707.819 721.874,707.483C721.528,707.147 721.066,706.979 720.488,706.979C720.258,706.979 720.035,707.016 719.82,707.09C719.605,707.164 719.428,707.266 719.287,707.395L718.684,706.651L721.519,704.155L717.711,704.155L717.711,703.182L723.102,703.182L723.102,703.979L720.477,706.246C720.613,706.219 720.76,706.205 720.916,706.205C721.353,706.205 721.761,706.307 722.138,706.51C722.515,706.713 722.823,707.016 723.063,707.418C723.304,707.821 723.424,708.282 723.424,708.801C723.424,709.661 723.143,710.359 722.58,710.896C722.018,711.433 721.307,711.702 720.447,711.702C719.635,711.702 718.954,711.481 718.405,711.039C717.856,710.598 717.506,710.012 717.353,709.282Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M730.215,703.182L730.215,704.155L725.92,704.155C725.92,704.963 725.82,705.864 725.621,706.856C725.875,706.563 726.194,706.33 726.579,706.156C726.964,705.982 727.381,705.895 727.83,705.895C728.627,705.895 729.288,706.143 729.813,706.639C730.339,707.135 730.602,707.803 730.602,708.643C730.602,709.549 730.321,710.286 729.761,710.852C729.2,711.418 728.451,711.702 727.514,711.702C726.725,711.702 726.049,711.491 725.486,711.069C724.928,710.639 724.596,710.028 724.49,709.235L725.498,708.942C725.592,709.52 725.809,709.963 726.148,710.272C726.488,710.58 726.943,710.735 727.514,710.735C728.146,710.735 728.644,710.553 729.008,710.19C729.371,709.827 729.553,709.352 729.553,708.766C729.553,708.18 729.383,707.711 729.043,707.36C728.703,707.008 728.219,706.832 727.59,706.832C727.184,706.832 726.802,706.939 726.444,707.152C726.087,707.365 725.836,707.629 725.691,707.946L724.59,707.694C724.828,706.135 724.947,704.631 724.947,703.182L730.215,703.182Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-13 22:23:28 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_34">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M701.115,687.198L708.021,731.655L675.218,739.856L660.83,740.287L654.212,694.248L701.115,687.198Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
|
|
|
|
<path d="M675.977,717.271L676.973,716.826C677.047,717.404 677.27,717.865 677.643,718.208C678.017,718.552 678.492,718.724 679.07,718.724C679.613,718.724 680.073,718.551 680.45,718.205C680.827,717.86 681.016,717.412 681.016,716.861C681.016,716.271 680.843,715.808 680.497,715.472C680.151,715.136 679.689,714.968 679.111,714.968C678.881,714.968 678.658,715.005 678.443,715.079C678.228,715.154 678.051,715.255 677.91,715.384L677.307,714.64L680.143,712.144L676.334,712.144L676.334,711.171L681.725,711.171L681.725,711.968L679.1,714.236C679.236,714.208 679.383,714.195 679.539,714.195C679.977,714.195 680.384,714.296 680.761,714.499C681.138,714.703 681.446,715.005 681.686,715.408C681.927,715.81 682.047,716.271 682.047,716.79C682.047,717.65 681.766,718.348 681.203,718.885C680.641,719.422 679.93,719.691 679.07,719.691C678.258,719.691 677.577,719.47 677.028,719.029C676.479,718.587 676.129,718.001 675.977,717.271Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M686.775,719.574L686.775,717.423L682.996,717.423L682.996,716.333C683.375,715.962 683.679,715.619 683.907,715.302C684.136,714.986 684.316,714.643 684.449,714.274C684.582,713.905 684.671,713.53 684.716,713.149C684.761,712.768 684.787,712.29 684.795,711.716L684.795,711.171L685.838,711.171L685.838,711.716C685.838,712.728 685.711,713.615 685.457,714.376C685.207,715.13 684.754,715.835 684.098,716.492L686.775,716.492L686.775,713.767L687.818,713.767L687.818,716.492L689.248,716.492L689.248,717.423L687.818,717.423L687.818,719.574L686.775,719.574Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_33">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M654.212,694.248L660.83,740.288L617.524,744.604L614.935,726.763L612.92,726.763L609.18,700.722L654.212,694.248Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
|
|
|
|
<path d="M632.549,722.591L633.545,722.146C633.619,722.724 633.843,723.185 634.216,723.529C634.589,723.872 635.064,724.044 635.643,724.044C636.185,724.044 636.645,723.871 637.022,723.526C637.399,723.18 637.588,722.732 637.588,722.181C637.588,721.591 637.415,721.128 637.069,720.792C636.724,720.456 636.262,720.288 635.684,720.288C635.453,720.288 635.23,720.326 635.016,720.4C634.801,720.474 634.623,720.576 634.482,720.704L633.879,719.96L636.715,717.464L632.906,717.464L632.906,716.492L638.297,716.492L638.297,717.288L635.672,719.556C635.809,719.529 635.955,719.515 636.111,719.515C636.549,719.515 636.956,719.617 637.333,719.82C637.71,720.023 638.019,720.326 638.259,720.728C638.499,721.13 638.619,721.591 638.619,722.111C638.619,722.97 638.338,723.668 637.775,724.205C637.213,724.743 636.502,725.011 635.643,725.011C634.83,725.011 634.149,724.79 633.601,724.349C633.052,723.908 632.701,723.322 632.549,722.591Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M639.398,722.591L640.394,722.146C640.469,722.724 640.692,723.185 641.065,723.529C641.438,723.872 641.914,724.044 642.492,724.044C643.035,724.044 643.495,723.871 643.872,723.526C644.249,723.18 644.437,722.732 644.437,722.181C644.437,721.591 644.265,721.128 643.919,720.792C643.573,720.456 643.111,720.288 642.533,720.288C642.303,720.288 642.08,720.326 641.865,720.4C641.65,720.474 641.473,720.576 641.332,720.704L640.728,719.96L643.564,717.464L639.756,717.464L639.756,716.492L645.146,716.492L645.146,717.288L642.521,719.556C642.658,719.529 642.805,719.515 642.961,719.515C643.398,719.515 643.806,719.617 644.183,719.82C644.56,720.023 644.868,720.326 645.108,720.728C645.349,721.13 645.469,721.591 645.469,722.111C645.469,722.97 645.187,723.668 644.625,724.205C644.062,724.743 643.352,725.011 642.492,725.011C641.68,725.011 640.999,724.79 640.45,724.349C639.901,723.908 639.551,723.322 639.398,722.591Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-13 22:23:28 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_32">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M609.18,700.722L612.921,726.763L610.475,726.763L612.921,744.46L560.838,748.2L556.235,708.779L609.18,700.722Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
|
|
|
|
<path d="M577.704,729.215L578.7,728.77C578.774,729.348 578.998,729.809 579.371,730.153C579.744,730.496 580.22,730.668 580.798,730.668C581.341,730.668 581.801,730.496 582.178,730.15C582.555,729.804 582.743,729.356 582.743,728.805C582.743,728.215 582.57,727.752 582.225,727.416C581.879,727.08 581.417,726.912 580.839,726.912C580.608,726.912 580.386,726.95 580.171,727.024C579.956,727.098 579.778,727.2 579.638,727.329L579.034,726.584L581.87,724.088L578.061,724.088L578.061,723.116L583.452,723.116L583.452,723.913L580.827,726.18C580.964,726.153 581.11,726.139 581.267,726.139C581.704,726.139 582.111,726.241 582.488,726.444C582.865,726.647 583.174,726.95 583.414,727.352C583.654,727.754 583.774,728.215 583.774,728.735C583.774,729.594 583.493,730.292 582.931,730.829C582.368,731.367 581.657,731.635 580.798,731.635C579.985,731.635 579.305,731.414 578.756,730.973C578.207,730.532 577.856,729.946 577.704,729.215Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M587.278,728.149C587.919,727.817 588.362,727.569 588.608,727.405C588.944,727.182 589.198,726.934 589.37,726.661C589.542,726.387 589.628,726.063 589.628,725.688C589.628,725.161 589.454,724.737 589.106,724.416C588.759,724.096 588.29,723.936 587.7,723.936C587.165,723.936 586.719,724.101 586.361,724.431C586.004,724.761 585.825,725.159 585.825,725.623C585.825,726.108 585.981,726.545 586.294,726.936L585.403,727.51C584.981,726.959 584.77,726.356 584.77,725.7C584.77,724.942 585.047,724.302 585.6,723.781C586.152,723.259 586.868,722.998 587.747,722.998C588.649,722.998 589.363,723.242 589.889,723.728C590.414,724.214 590.677,724.85 590.677,725.635C590.677,726.303 590.51,726.86 590.176,727.305C589.842,727.75 589.323,728.151 588.62,728.506C588.136,728.764 587.72,728.993 587.372,729.192C587.083,729.356 586.834,729.555 586.625,729.789C586.416,730.024 586.29,730.276 586.247,730.545L590.688,730.545L590.688,731.518L584.952,731.518C584.952,730.967 585.048,730.478 585.239,730.05C585.431,729.622 585.691,729.261 586.021,728.966C586.352,728.671 586.77,728.399 587.278,728.149Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_31">
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M556.234,708.779L560.838,748.2L505.016,753.956L500.267,716.548L556.234,708.779Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g>
|
|
|
|
|
<path d="M524.421,736.809L525.417,736.364C525.491,736.942 525.715,737.403 526.088,737.746C526.461,738.09 526.936,738.262 527.515,738.262C528.058,738.262 528.518,738.089 528.894,737.744C529.271,737.398 529.46,736.95 529.46,736.399C529.46,735.809 529.287,735.346 528.941,735.01C528.596,734.674 528.134,734.506 527.556,734.506C527.325,734.506 527.102,734.543 526.888,734.618C526.673,734.692 526.495,734.793 526.354,734.922L525.751,734.178L528.587,731.682L524.778,731.682L524.778,730.709L530.169,730.709L530.169,731.506L527.544,733.774C527.681,733.746 527.827,733.733 527.983,733.733C528.421,733.733 528.828,733.834 529.205,734.038C529.582,734.241 529.891,734.543 530.131,734.946C530.371,735.348 530.491,735.809 530.491,736.329C530.491,737.188 530.21,737.886 529.647,738.423C529.085,738.96 528.374,739.229 527.515,739.229C526.702,739.229 526.021,739.008 525.473,738.567C524.924,738.125 524.573,737.539 524.421,736.809Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M533.479,739.112L533.479,732.356C533.308,732.746 533.024,733.067 532.63,733.317C532.227,733.571 531.823,733.715 531.417,733.75L531.212,732.678C531.837,732.612 532.356,732.41 532.77,732.072C533.185,731.734 533.462,731.28 533.602,730.709L534.522,730.709L534.522,739.112L533.479,739.112Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-13 22:23:28 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_30">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M451.206,723.023L462.14,769.926L481.132,767.768L505.015,753.956L500.267,716.549L451.206,723.023Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
|
|
|
|
<path d="M471.296,742.449L472.292,742.003C472.366,742.581 472.59,743.042 472.963,743.386C473.336,743.73 473.811,743.902 474.39,743.902C474.933,743.902 475.393,743.729 475.769,743.383C476.146,743.038 476.335,742.589 476.335,742.038C476.335,741.449 476.162,740.986 475.816,740.65C475.471,740.314 475.009,740.146 474.431,740.146C474.2,740.146 473.977,740.183 473.763,740.257C473.548,740.331 473.37,740.433 473.229,740.562L472.626,739.818L475.462,737.322L471.653,737.322L471.653,736.349L477.044,736.349L477.044,737.146L474.419,739.413C474.556,739.386 474.702,739.372 474.858,739.372C475.296,739.372 475.703,739.474 476.08,739.677C476.457,739.88 476.766,740.183 477.006,740.585C477.246,740.988 477.366,741.449 477.366,741.968C477.366,742.828 477.085,743.526 476.522,744.063C475.96,744.6 475.249,744.869 474.39,744.869C473.577,744.869 472.896,744.648 472.348,744.206C471.799,743.765 471.448,743.179 471.296,742.449Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M479.288,743.694C478.679,742.911 478.374,741.863 478.374,740.55C478.374,739.238 478.679,738.19 479.288,737.407C479.897,736.623 480.712,736.232 481.731,736.232C482.759,736.232 483.578,736.622 484.189,737.404C484.801,738.185 485.106,739.234 485.106,740.55C485.106,741.867 484.801,742.915 484.189,743.697C483.578,744.478 482.759,744.869 481.731,744.869C480.712,744.869 479.897,744.477 479.288,743.694ZM484.063,740.55C484.063,739.562 483.858,738.749 483.448,738.113C483.058,737.484 482.485,737.169 481.731,737.169C480.993,737.169 480.423,737.484 480.02,738.113C479.61,738.749 479.405,739.562 479.405,740.55C479.405,741.538 479.61,742.351 480.02,742.988C480.427,743.621 480.997,743.937 481.731,743.937C482.481,743.937 483.054,743.621 483.448,742.988C483.858,742.351 484.063,741.538 484.063,740.55Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_28" transform="matrix(1,0,0,1,0,2)">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M459.242,599.907L459.242,655.213L421.72,656.581L417.616,601.861L459.242,599.907Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M432.619,628.694C433.26,628.362 433.703,628.114 433.949,627.95C434.285,627.727 434.539,627.479 434.711,627.205C434.883,626.932 434.969,626.608 434.969,626.233C434.969,625.705 434.795,625.282 434.447,624.961C434.1,624.641 433.631,624.481 433.041,624.481C432.506,624.481 432.06,624.646 431.702,624.976C431.345,625.306 431.166,625.704 431.166,626.168C431.166,626.653 431.322,627.09 431.635,627.481L430.744,628.055C430.322,627.504 430.111,626.901 430.111,626.245C430.111,625.487 430.388,624.847 430.94,624.326C431.493,623.804 432.209,623.543 433.088,623.543C433.99,623.543 434.704,623.787 435.229,624.273C435.755,624.759 436.018,625.395 436.018,626.18C436.018,626.848 435.851,627.405 435.517,627.85C435.183,628.295 434.664,628.696 433.961,629.051C433.477,629.309 433.061,629.538 432.713,629.737C432.424,629.901 432.175,630.1 431.966,630.334C431.757,630.569 431.631,630.821 431.588,631.09L436.029,631.09L436.029,632.063L430.293,632.063C430.293,631.512 430.389,631.023 430.58,630.595C430.771,630.167 431.032,629.806 431.362,629.511C431.692,629.216 432.111,628.944 432.619,628.694Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M437.102,629.661C437.102,629.133 437.247,628.664 437.538,628.254C437.829,627.844 438.232,627.557 438.748,627.393C437.963,627.034 437.57,626.461 437.57,625.676C437.57,625.075 437.804,624.569 438.27,624.159C438.737,623.748 439.344,623.543 440.09,623.543C440.832,623.543 441.437,623.748 441.906,624.159C442.375,624.569 442.609,625.075 442.609,625.676C442.609,626.461 442.217,627.034 441.432,627.393C441.947,627.557 442.351,627.844 442.642,628.254C442.933,628.664 443.078,629.133 443.078,629.661C443.078,630 443.012,630.322 442.879,630.624C442.746,630.927 442.556,631.195 442.308,631.427C442.06,631.66 441.745,631.843 441.364,631.978C440.983,632.113 440.559,632.18 440.09,632.18C439.621,632.18 439.195,632.113 438.812,631.978C438.43,631.843 438.115,631.66 437.869,631.427C437.623,631.195 437.434,630.927 437.301,630.624C437.168,630.322 437.102,630 437.102,629.661ZM442.047,629.543C442.047,629.055 441.866,628.657 441.505,628.348C441.144,628.039 440.672,627.885 440.09,627.885C439.508,627.885 439.036,628.039 438.675,628.348C438.313,628.657 438.133,629.055 438.133,629.543C438.133,630.047 438.309,630.452 438.66,630.756C439.012,631.061 439.488,631.213 440.09,631.213C440.691,631.213 441.168,631.061 441.519,630.756C441.871,630.452 442.047,630.047 442.047,629.543ZM441.602,625.729C441.602,625.362 441.462,625.062 441.183,624.829C440.903,624.597 440.539,624.481 440.09,624.481C439.641,624.481 439.276,624.597 438.997,624.829C438.718,625.062 438.578,625.362 438.578,625.729C438.578,626.12 438.716,626.431 438.991,626.663C439.267,626.896 439.633,627.012 440.09,627.012C440.547,627.012 440.913,626.896 441.188,626.663C441.464,626.431 441.602,626.12 441.602,625.729Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-13 22:23:28 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_27">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M496.764,597.757L500.268,642.706L501.259,650.523L472.335,655.604L459.242,655.213L459.242,599.907L496.764,597.757Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M475.035,628.727C475.675,628.395 476.119,628.147 476.365,627.983C476.701,627.76 476.955,627.512 477.126,627.239C477.298,626.965 477.384,626.641 477.384,626.266C477.384,625.739 477.21,625.315 476.863,624.995C476.515,624.674 476.046,624.514 475.457,624.514C474.921,624.514 474.475,624.679 474.118,625.009C473.76,625.339 473.582,625.737 473.582,626.202C473.582,626.686 473.738,627.123 474.05,627.514L473.16,628.088C472.738,627.538 472.527,626.934 472.527,626.278C472.527,625.52 472.803,624.88 473.356,624.359C473.909,623.837 474.624,623.577 475.503,623.577C476.406,623.577 477.12,623.82 477.645,624.306C478.17,624.792 478.433,625.428 478.433,626.213C478.433,626.881 478.266,627.438 477.932,627.883C477.598,628.329 477.08,628.729 476.376,629.084C475.892,629.342 475.476,629.571 475.128,629.77C474.839,629.934 474.59,630.133 474.381,630.368C474.172,630.602 474.046,630.854 474.003,631.123L478.445,631.123L478.445,632.096L472.708,632.096C472.708,631.545 472.804,631.056 472.996,630.628C473.187,630.201 473.448,629.839 473.778,629.544C474.108,629.249 474.527,628.977 475.035,628.727Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M479.306,623.694L484.779,623.694L484.779,624.549C482.935,625.815 482.013,627.678 482.013,630.139C482.013,630.717 482.062,631.37 482.16,632.096L481.017,632.096C480.947,631.545 480.912,630.977 480.912,630.391C480.912,628 481.72,626.092 483.337,624.666L479.306,624.666L479.306,623.694Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_26">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M534.678,595.803L535.658,610.95L533.281,610.95L534.47,628.674L536.648,628.674L537.638,644.121L501.26,650.523L500.268,642.706L496.765,597.757L534.678,595.803Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M511.739,624.763C512.379,624.431 512.823,624.183 513.069,624.019C513.405,623.796 513.659,623.548 513.831,623.275C514.002,623.001 514.088,622.677 514.088,622.302C514.088,621.775 513.914,621.351 513.567,621.031C513.219,620.71 512.75,620.55 512.161,620.55C511.625,620.55 511.179,620.715 510.822,621.045C510.464,621.375 510.286,621.773 510.286,622.238C510.286,622.722 510.442,623.16 510.754,623.55L509.864,624.124C509.442,623.574 509.231,622.97 509.231,622.314C509.231,621.556 509.507,620.916 510.06,620.395C510.613,619.873 511.329,619.613 512.207,619.613C513.11,619.613 513.824,619.856 514.349,620.342C514.874,620.829 515.137,621.464 515.137,622.249C515.137,622.917 514.97,623.474 514.636,623.919C514.302,624.365 513.784,624.765 513.081,625.121C512.596,625.378 512.18,625.607 511.832,625.806C511.543,625.97 511.294,626.169 511.085,626.404C510.876,626.638 510.75,626.89 510.707,627.16L515.149,627.16L515.149,628.132L509.413,628.132C509.413,627.581 509.508,627.092 509.7,626.664C509.891,626.237 510.152,625.875 510.482,625.58C510.812,625.286 511.231,625.013 511.739,624.763Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M516.209,623.99C516.209,623.372 516.28,622.801 516.42,622.276C516.561,621.75 516.764,621.288 517.03,620.89C517.295,620.492 517.639,620.179 518.059,619.953C518.478,619.726 518.954,619.613 519.485,619.613C520.267,619.613 520.895,619.812 521.372,620.21C521.849,620.609 522.136,621.154 522.233,621.845L521.249,622.144C521.093,621.081 520.485,620.55 519.427,620.55C519.126,620.55 518.846,620.62 518.586,620.758C518.326,620.897 518.096,621.1 517.894,621.368C517.693,621.635 517.534,621.988 517.416,622.425C517.299,622.863 517.241,623.361 517.241,623.919L517.241,624.089C517.44,623.687 517.754,623.36 518.182,623.108C518.609,622.856 519.063,622.73 519.544,622.73C520.067,622.73 520.537,622.851 520.953,623.093C521.369,623.335 521.688,623.659 521.911,624.063C522.134,624.467 522.245,624.912 522.245,625.396C522.245,626.236 521.98,626.921 521.451,627.453C520.922,627.984 520.251,628.249 519.438,628.249C518.915,628.249 518.447,628.144 518.035,627.933C517.623,627.722 517.284,627.427 517.018,627.048C516.752,626.669 516.551,626.221 516.414,625.704C516.278,625.186 516.209,624.615 516.209,623.99ZM521.214,625.49C521.214,624.943 521.039,624.502 520.689,624.168C520.34,623.834 519.89,623.667 519.339,623.667C518.843,623.667 518.419,623.837 518.067,624.177C517.716,624.517 517.54,624.943 517.54,625.454C517.54,625.997 517.716,626.438 518.067,626.776C518.419,627.114 518.868,627.283 519.415,627.283C519.942,627.283 520.374,627.116 520.71,626.782C521.046,626.448 521.214,626.017 521.214,625.49Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-13 22:23:28 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_25">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M574.571,593.622L580.215,637.388L537.637,644.122L536.647,628.675L539.122,628.477L538.231,610.851L535.657,610.95L534.677,595.803L574.571,593.622Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M552.777,621.497C553.418,621.165 553.861,620.917 554.107,620.753C554.443,620.531 554.697,620.283 554.869,620.009C555.041,619.736 555.127,619.412 555.127,619.037C555.127,618.509 554.953,618.085 554.605,617.765C554.258,617.445 553.789,617.285 553.199,617.285C552.664,617.285 552.218,617.449 551.86,617.779C551.503,618.109 551.324,618.507 551.324,618.972C551.324,619.456 551.48,619.894 551.793,620.285L550.902,620.859C550.48,620.308 550.269,619.704 550.269,619.048C550.269,618.29 550.546,617.65 551.099,617.128C551.651,616.607 552.367,616.347 553.246,616.347C554.148,616.347 554.862,616.589 555.388,617.076C555.913,617.562 556.176,618.199 556.176,618.984C556.176,619.652 556.009,620.208 555.675,620.654C555.341,621.099 554.822,621.499 554.119,621.855C553.635,622.113 553.219,622.341 552.871,622.54C552.582,622.704 552.333,622.904 552.124,623.138C551.915,623.372 551.789,623.624 551.746,623.894L556.187,623.894L556.187,624.867L550.451,624.867C550.451,624.316 550.547,623.826 550.738,623.398C550.93,622.97 551.19,622.609 551.52,622.314C551.851,622.019 552.269,621.747 552.777,621.497Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M563.031,616.464L563.031,617.437L558.736,617.437C558.736,618.246 558.637,619.146 558.437,620.138C558.691,619.845 559.011,619.611 559.395,619.437C559.78,619.263 560.197,619.177 560.646,619.177C561.443,619.177 562.104,619.425 562.63,619.921C563.155,620.417 563.418,621.085 563.418,621.925C563.418,622.831 563.138,623.568 562.577,624.134C562.017,624.701 561.268,624.984 560.33,624.984C559.541,624.984 558.865,624.773 558.303,624.351C557.744,623.921 557.412,623.31 557.307,622.517L558.314,622.224C558.408,622.802 558.625,623.246 558.965,623.554C559.305,623.863 559.76,624.017 560.33,624.017C560.963,624.017 561.461,623.835 561.824,623.472C562.187,623.109 562.369,622.634 562.369,622.048C562.369,621.462 562.199,620.994 561.859,620.642C561.519,620.29 561.035,620.115 560.406,620.115C560,620.115 559.618,620.22 559.261,620.433C558.903,620.646 558.652,620.912 558.508,621.228L557.406,620.976C557.644,619.417 557.764,617.913 557.764,616.464L563.031,616.464Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_24">
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M624.972,590.552L627.051,628.873L580.216,637.388L574.571,593.622L624.972,590.552Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M598.762,613.138C599.402,612.806 599.846,612.558 600.092,612.394C600.428,612.171 600.682,611.923 600.853,611.65C601.025,611.376 601.111,611.052 601.111,610.677C601.111,610.15 600.937,609.726 600.59,609.406C600.242,609.085 599.773,608.925 599.184,608.925C598.648,608.925 598.202,609.09 597.845,609.42C597.487,609.75 597.309,610.148 597.309,610.613C597.309,611.097 597.465,611.535 597.777,611.925L596.887,612.499C596.465,611.949 596.254,611.345 596.254,610.689C596.254,609.931 596.53,609.291 597.083,608.77C597.636,608.248 598.352,607.988 599.23,607.988C600.133,607.988 600.847,608.231 601.372,608.717C601.897,609.204 602.16,609.839 602.16,610.624C602.16,611.292 601.993,611.849 601.659,612.294C601.325,612.74 600.807,613.14 600.103,613.496C599.619,613.753 599.203,613.982 598.855,614.181C598.566,614.345 598.317,614.544 598.108,614.779C597.899,615.013 597.773,615.265 597.73,615.535L602.172,615.535L602.172,616.507L596.436,616.507C596.436,615.956 596.531,615.467 596.723,615.039C596.914,614.612 597.175,614.25 597.505,613.955C597.835,613.661 598.254,613.388 598.762,613.138Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M606.725,616.507L606.725,614.357L602.945,614.357L602.945,613.267C603.324,612.896 603.628,612.552 603.856,612.236C604.085,611.919 604.266,611.577 604.398,611.207C604.531,610.838 604.62,610.463 604.665,610.082C604.71,609.702 604.736,609.224 604.744,608.65L604.744,608.105L605.787,608.105L605.787,608.65C605.787,609.662 605.66,610.548 605.406,611.31C605.156,612.064 604.703,612.769 604.047,613.425L606.725,613.425L606.725,610.701L607.768,610.701L607.768,613.425L609.197,613.425L609.197,614.357L607.768,614.357L607.768,616.507L606.725,616.507Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-13 22:23:28 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_23">
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M678.441,587.681L681.71,623.13L627.05,628.873L624.971,590.553L678.441,587.681Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M649.676,607.701C650.316,607.369 650.76,607.121 651.006,606.956C651.342,606.734 651.596,606.486 651.768,606.212C651.939,605.939 652.025,605.615 652.025,605.24C652.025,604.712 651.852,604.288 651.504,603.968C651.156,603.648 650.687,603.488 650.098,603.488C649.562,603.488 649.116,603.653 648.759,603.983C648.401,604.313 648.223,604.71 648.223,605.175C648.223,605.66 648.379,606.097 648.691,606.488L647.801,607.062C647.379,606.511 647.168,605.908 647.168,605.251C647.168,604.494 647.444,603.854 647.997,603.332C648.55,602.811 649.266,602.55 650.144,602.55C651.047,602.55 651.761,602.793 652.286,603.28C652.811,603.766 653.074,604.402 653.074,605.187C653.074,605.855 652.907,606.412 652.573,606.857C652.239,607.302 651.721,607.703 651.018,608.058C650.533,608.316 650.117,608.544 649.769,608.744C649.48,608.908 649.231,609.107 649.022,609.341C648.813,609.576 648.687,609.828 648.644,610.097L653.086,610.097L653.086,611.07L647.35,611.07C647.35,610.519 647.445,610.03 647.637,609.602C647.828,609.174 648.089,608.813 648.419,608.518C648.749,608.223 649.168,607.951 649.676,607.701Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M653.918,608.767L654.914,608.322C654.988,608.9 655.212,609.361 655.585,609.705C655.958,610.048 656.434,610.22 657.012,610.22C657.555,610.22 658.015,610.047 658.392,609.702C658.768,609.356 658.957,608.908 658.957,608.357C658.957,607.767 658.784,607.304 658.438,606.968C658.093,606.632 657.631,606.464 657.053,606.464C656.822,606.464 656.6,606.501 656.385,606.576C656.17,606.65 655.992,606.751 655.852,606.88L655.248,606.136L658.084,603.64L654.275,603.64L654.275,602.667L659.666,602.667L659.666,603.464L657.041,605.732C657.178,605.705 657.324,605.691 657.48,605.691C657.918,605.691 658.325,605.792 658.702,605.996C659.079,606.199 659.388,606.501 659.628,606.904C659.868,607.306 659.988,607.767 659.988,608.287C659.988,609.146 659.707,609.844 659.144,610.381C658.582,610.918 657.871,611.187 657.012,611.187C656.199,611.187 655.519,610.966 654.97,610.525C654.421,610.083 654.07,609.497 653.918,608.767Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_22">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M710.326,619.169L681.71,623.13L678.442,587.681L718.347,585.701C718.347,585.701 731.021,587.384 732.704,589.76L731.021,591.939C731.021,591.939 744.289,597.286 744.586,607.287L745.082,612.733L740.923,618.179L710.326,619.169Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M704.795,605.125C705.435,604.793 705.879,604.545 706.125,604.381C706.461,604.159 706.715,603.911 706.887,603.637C707.059,603.364 707.144,603.039 707.144,602.664C707.144,602.137 706.971,601.713 706.623,601.393C706.275,601.073 705.807,600.913 705.217,600.913C704.682,600.913 704.235,601.078 703.878,601.408C703.52,601.738 703.342,602.135 703.342,602.6C703.342,603.084 703.498,603.522 703.81,603.913L702.92,604.487C702.498,603.936 702.287,603.332 702.287,602.676C702.287,601.918 702.563,601.279 703.116,600.757C703.669,600.236 704.385,599.975 705.264,599.975C706.166,599.975 706.88,600.218 707.405,600.704C707.931,601.191 708.193,601.827 708.193,602.612C708.193,603.28 708.026,603.836 707.692,604.282C707.358,604.727 706.84,605.127 706.137,605.483C705.652,605.741 705.236,605.969 704.889,606.168C704.6,606.332 704.351,606.532 704.142,606.766C703.933,607 703.807,607.252 703.764,607.522L708.205,607.522L708.205,608.495L702.469,608.495C702.469,607.944 702.564,607.455 702.756,607.027C702.947,606.599 703.208,606.238 703.538,605.943C703.868,605.648 704.287,605.375 704.795,605.125Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M711.762,605.125C712.402,604.793 712.846,604.545 713.092,604.381C713.428,604.159 713.682,603.911 713.853,603.637C714.025,603.364 714.111,603.039 714.111,602.664C714.111,602.137 713.937,601.713 713.59,601.393C713.242,601.073 712.773,600.913 712.184,600.913C711.648,600.913 711.202,601.078 710.845,601.408C710.487,601.738 710.309,602.135 710.309,602.6C710.309,603.084 710.465,603.522 710.777,603.913L709.887,604.487C709.465,603.936 709.254,603.332 709.254,602.676C709.254,601.918 709.53,601.279 710.083,600.757C710.636,600.236 711.352,599.975 712.23,599.975C713.133,599.975 713.847,600.218 714.372,600.704C714.897,601.191 715.16,601.827 715.16,602.612C715.16,603.28 714.993,603.836 714.659,604.282C714.325,604.727 713.807,605.127 713.103,605.483C712.619,605.741 712.203,605.969 711.855,606.168C711.566,606.332 711.317,606.532 711.108,606.766C710.899,607 710.773,607.252 710.73,607.522L715.172,607.522L715.172,608.495L709.436,608.495C709.436,607.944 709.531,607.455 709.723,607.027C709.914,606.599 710.175,606.238 710.505,605.943C710.835,605.648 711.254,605.375 711.762,605.125Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-13 22:23:28 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_21">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M675.24,628.377L710.523,623.525L741.318,622.139L742.11,628.872L748.619,631.348C748.619,631.348 749.735,640.853 742.407,649.369C735.079,657.885 727.752,662.34 727.752,662.34L727.554,666.4C727.554,666.4 719.236,670.262 715.771,670.658C712.305,671.054 678.936,675.213 678.936,675.213L675.24,628.377Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M702.809,647.876C703.449,647.544 703.893,647.296 704.139,647.132C704.475,646.91 704.728,646.662 704.9,646.388C705.072,646.115 705.158,645.79 705.158,645.415C705.158,644.888 704.984,644.464 704.637,644.144C704.289,643.824 703.82,643.663 703.23,643.663C702.695,643.663 702.249,643.829 701.892,644.159C701.534,644.489 701.355,644.886 701.355,645.351C701.355,645.835 701.512,646.273 701.824,646.663L700.934,647.238C700.512,646.687 700.301,646.083 700.301,645.427C700.301,644.669 700.577,644.03 701.13,643.508C701.683,642.987 702.398,642.726 703.277,642.726C704.18,642.726 704.894,642.969 705.419,643.455C705.944,643.942 706.207,644.578 706.207,645.363C706.207,646.031 706.04,646.587 705.706,647.033C705.372,647.478 704.853,647.878 704.15,648.234C703.666,648.492 703.25,648.72 702.902,648.919C702.613,649.083 702.364,649.283 702.155,649.517C701.946,649.751 701.82,650.003 701.777,650.273L706.219,650.273L706.219,651.246L700.482,651.246C700.482,650.695 700.578,650.205 700.769,649.778C700.961,649.35 701.222,648.989 701.552,648.694C701.882,648.399 702.301,648.126 702.809,647.876Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M709.318,651.246L709.318,644.49C709.146,644.88 708.863,645.201 708.469,645.451C708.066,645.705 707.662,645.849 707.256,645.884L707.051,644.812C707.676,644.746 708.195,644.543 708.609,644.205C709.023,643.868 709.301,643.413 709.441,642.843L710.361,642.843L710.361,651.246L709.318,651.246Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_20">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M629.131,632.89L675.242,628.378L678.936,675.214L632.201,682.019L629.131,632.89Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M649.283,658.537C649.924,658.204 650.367,657.956 650.613,657.792C650.949,657.57 651.203,657.322 651.375,657.048C651.547,656.775 651.633,656.451 651.633,656.076C651.633,655.548 651.459,655.124 651.111,654.804C650.764,654.484 650.295,654.324 649.705,654.324C649.17,654.324 648.724,654.489 648.366,654.819C648.009,655.149 647.83,655.546 647.83,656.011C647.83,656.496 647.986,656.933 648.299,657.324L647.408,657.898C646.986,657.347 646.775,656.744 646.775,656.087C646.775,655.329 647.052,654.69 647.604,654.168C648.157,653.647 648.873,653.386 649.752,653.386C650.654,653.386 651.368,653.629 651.894,654.116C652.419,654.602 652.682,655.238 652.682,656.023C652.682,656.691 652.515,657.247 652.181,657.693C651.847,658.138 651.328,658.538 650.625,658.894C650.141,659.152 649.725,659.38 649.377,659.579C649.088,659.744 648.839,659.943 648.63,660.177C648.421,660.412 648.295,660.663 648.252,660.933L652.693,660.933L652.693,661.906L646.957,661.906C646.957,661.355 647.053,660.866 647.244,660.438C647.436,660.01 647.696,659.649 648.026,659.354C648.356,659.059 648.775,658.787 649.283,658.537Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M654.668,660.848C654.059,660.065 653.754,659.017 653.754,657.704C653.754,656.392 654.059,655.344 654.668,654.561C655.277,653.778 656.092,653.386 657.111,653.386C658.139,653.386 658.958,653.777 659.569,654.558C660.181,655.339 660.486,656.388 660.486,657.705C660.486,659.021 660.181,660.07 659.569,660.851C658.958,661.632 658.139,662.023 657.111,662.023C656.092,662.023 655.277,661.631 654.668,660.848ZM659.443,657.704C659.443,656.716 659.238,655.904 658.828,655.267C658.437,654.638 657.865,654.324 657.111,654.324C656.373,654.324 655.803,654.638 655.4,655.267C654.99,655.904 654.785,656.716 654.785,657.704C654.785,658.693 654.99,659.505 655.4,660.142C655.807,660.775 656.377,661.091 657.111,661.091C657.861,661.091 658.434,660.775 658.828,660.142C659.238,659.505 659.443,658.693 659.443,657.704Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-13 22:23:28 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_19">
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M582.196,641.25L629.131,632.89L632.2,682.019L585.86,688.977L582.196,641.25Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M601.602,668.859L601.602,662.103C601.431,662.494 601.147,662.814 600.753,663.064C600.351,663.318 599.946,663.462 599.54,663.497L599.335,662.425C599.96,662.359 600.479,662.157 600.894,661.819C601.308,661.481 601.585,661.027 601.726,660.456L602.645,660.456L602.645,668.859L601.602,668.859Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M604.058,666.497L605.077,666.193C605.128,666.783 605.323,667.233 605.663,667.543C606.003,667.854 606.464,668.009 607.046,668.009C607.722,668.009 608.258,667.721 608.654,667.145C609.051,666.569 609.251,665.751 609.255,664.693L609.243,664.265C609.056,664.753 608.761,665.141 608.358,665.428C607.956,665.715 607.491,665.859 606.964,665.859C606.136,665.859 605.467,665.601 604.957,665.085C604.447,664.57 604.192,663.931 604.192,663.169C604.192,662.755 604.265,662.371 604.409,662.018C604.554,661.664 604.751,661.366 605.001,661.121C605.251,660.877 605.547,660.686 605.889,660.547C606.23,660.409 606.597,660.339 606.987,660.339C608.104,660.339 608.921,660.74 609.436,661.54C609.956,662.337 610.216,663.369 610.216,664.634C610.216,665.107 610.179,665.554 610.104,665.976C610.03,666.398 609.909,666.793 609.741,667.163C609.573,667.532 609.366,667.849 609.12,668.115C608.874,668.38 608.569,668.59 608.206,668.745C607.843,668.899 607.436,668.976 606.987,668.976C606.175,668.976 605.506,668.741 604.98,668.27C604.455,667.799 604.147,667.208 604.058,666.497ZM608.868,663.099C608.868,662.572 608.696,662.136 608.353,661.792C608.02,661.449 607.585,661.277 607.046,661.277C606.515,661.277 606.079,661.453 605.739,661.804C605.403,662.152 605.235,662.595 605.235,663.134C605.235,663.677 605.403,664.111 605.739,664.435C606.075,664.759 606.511,664.921 607.046,664.921C607.577,664.921 608.014,664.752 608.355,664.414C608.697,664.077 608.868,663.638 608.868,663.099Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_18">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M537.141,648.577L582.194,641.25L585.858,688.977L539.319,695.71L538.527,681.451L540.904,681.154L539.814,663.034L537.141,663.133L537.141,648.577Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M558.473,673.853L558.473,667.097C558.301,667.488 558.018,667.808 557.623,668.058C557.221,668.312 556.816,668.456 556.41,668.492L556.205,667.419C556.83,667.353 557.35,667.151 557.764,666.813C558.178,666.475 558.455,666.021 558.596,665.451L559.516,665.451L559.516,673.853L558.473,673.853Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M560.928,671.451C560.928,670.923 561.073,670.455 561.364,670.044C561.655,669.634 562.059,669.347 562.574,669.183C561.789,668.824 561.396,668.251 561.396,667.466C561.396,666.865 561.63,666.359 562.097,665.949C562.563,665.538 563.17,665.333 563.916,665.333C564.658,665.333 565.264,665.538 565.732,665.949C566.201,666.359 566.436,666.865 566.436,667.466C566.436,668.251 566.043,668.824 565.258,669.183C565.773,669.347 566.177,669.634 566.468,670.044C566.759,670.454 566.904,670.923 566.904,671.451C566.904,671.79 566.838,672.112 566.705,672.414C566.572,672.717 566.382,672.985 566.134,673.217C565.886,673.45 565.571,673.633 565.19,673.768C564.81,673.903 564.385,673.97 563.916,673.97C563.447,673.97 563.021,673.903 562.639,673.768C562.256,673.633 561.941,673.45 561.695,673.217C561.449,672.985 561.26,672.717 561.127,672.414C560.994,672.112 560.928,671.79 560.928,671.451ZM565.873,671.333C565.873,670.845 565.692,670.447 565.331,670.138C564.97,669.83 564.498,669.675 563.916,669.675C563.334,669.675 562.862,669.83 562.501,670.138C562.14,670.447 561.959,670.845 561.959,671.333C561.959,671.837 562.135,672.242 562.486,672.546C562.838,672.851 563.314,673.003 563.916,673.003C564.518,673.003 564.994,672.851 565.346,672.546C565.697,672.242 565.873,671.837 565.873,671.333ZM565.428,667.519C565.428,667.152 565.288,666.852 565.009,666.62C564.729,666.387 564.365,666.271 563.916,666.271C563.467,666.271 563.102,666.387 562.823,666.62C562.544,666.852 562.404,667.152 562.404,667.519C562.404,667.91 562.542,668.221 562.817,668.454C563.093,668.686 563.459,668.802 563.916,668.802C564.373,668.802 564.739,668.686 565.015,668.454C565.29,668.221 565.428,667.91 565.428,667.519Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-13 22:23:28 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_17">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M491.692,656.796L537.142,648.577L537.142,663.133L533.973,663.133L535.26,681.551L538.528,681.452L539.32,695.71L493.969,702.84L491.692,656.796Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M512.898,682.246L512.898,675.49C512.727,675.88 512.443,676.201 512.049,676.451C511.646,676.705 511.242,676.849 510.836,676.884L510.631,675.812C511.256,675.746 511.775,675.543 512.189,675.205C512.603,674.868 512.881,674.413 513.021,673.843L513.941,673.843L513.941,682.246L512.898,682.246Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M515.26,673.843L520.732,673.843L520.732,674.699C518.889,675.964 517.967,677.828 517.967,680.288C517.967,680.867 518.016,681.519 518.113,682.246L516.971,682.246C516.9,681.695 516.865,681.126 516.865,680.54C516.865,678.15 517.674,676.242 519.291,674.816L515.26,674.816L515.26,673.843Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_16">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M447.63,660.657L467.533,660.657L491.693,656.795L493.971,702.839L463.671,707.196L442.778,707.196L447.63,660.657Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M467.642,689.149L467.642,682.393C467.47,682.784 467.186,683.104 466.792,683.354C466.39,683.608 465.985,683.752 465.579,683.788L465.374,682.715C465.999,682.649 466.518,682.447 466.933,682.109C467.347,681.771 467.624,681.317 467.765,680.746L468.685,680.746L468.685,689.149L467.642,689.149Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M470.085,685.006C470.085,684.389 470.155,683.818 470.296,683.292C470.436,682.767 470.64,682.305 470.905,681.907C471.171,681.508 471.514,681.196 471.934,680.969C472.353,680.743 472.829,680.629 473.36,680.629C474.142,680.629 474.77,680.829 475.247,681.227C475.724,681.625 476.011,682.17 476.108,682.862L475.124,683.161C474.968,682.098 474.36,681.567 473.302,681.567C473.001,681.567 472.721,681.636 472.461,681.775C472.201,681.913 471.971,682.117 471.769,682.384C471.568,682.652 471.409,683.004 471.292,683.442C471.175,683.879 471.116,684.377 471.116,684.936L471.116,685.106C471.315,684.704 471.629,684.376 472.057,684.124C472.484,683.872 472.938,683.747 473.419,683.747C473.942,683.747 474.412,683.868 474.828,684.11C475.244,684.352 475.563,684.675 475.786,685.08C476.009,685.484 476.12,685.928 476.12,686.413C476.12,687.252 475.855,687.938 475.326,688.469C474.797,689 474.126,689.266 473.313,689.266C472.79,689.266 472.322,689.161 471.91,688.95C471.498,688.739 471.159,688.444 470.893,688.065C470.628,687.686 470.427,687.238 470.29,686.72C470.153,686.203 470.085,685.631 470.085,685.006ZM475.089,686.506C475.089,685.959 474.914,685.519 474.564,685.185C474.215,684.851 473.765,684.684 473.214,684.684C472.718,684.684 472.294,684.854 471.942,685.194C471.591,685.534 471.415,685.959 471.415,686.471C471.415,687.014 471.591,687.454 471.942,687.792C472.294,688.13 472.743,688.299 473.29,688.299C473.817,688.299 474.249,688.132 474.585,687.798C474.921,687.464 475.089,687.034 475.089,686.506Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-13 22:23:28 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_15">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M400.794,659.667L421.72,661.845L447.63,660.657L442.778,707.196L418.419,707.196L395.546,702.839L400.794,659.667Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M419.324,689.462L419.324,682.706C419.152,683.097 418.869,683.417 418.475,683.667C418.072,683.921 417.668,684.066 417.262,684.101L417.057,683.029C417.682,682.962 418.201,682.76 418.615,682.422C419.029,682.084 419.307,681.63 419.447,681.06L420.367,681.06L420.367,689.462L419.324,689.462Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M427.551,681.06L427.551,682.033L423.256,682.033C423.256,682.841 423.156,683.742 422.957,684.734C423.211,684.441 423.53,684.207 423.915,684.034C424.3,683.86 424.717,683.773 425.166,683.773C425.963,683.773 426.624,684.021 427.149,684.517C427.675,685.013 427.937,685.681 427.937,686.521C427.937,687.427 427.657,688.163 427.097,688.73C426.536,689.296 425.787,689.58 424.85,689.58C424.061,689.58 423.385,689.369 422.822,688.947C422.264,688.517 421.932,687.906 421.826,687.113L422.834,686.82C422.928,687.398 423.145,687.841 423.484,688.15C423.824,688.458 424.279,688.613 424.85,688.613C425.482,688.613 425.98,688.431 426.344,688.068C426.707,687.705 426.889,687.23 426.889,686.644C426.889,686.058 426.719,685.589 426.379,685.238C426.039,684.886 425.555,684.71 424.926,684.71C424.519,684.71 424.138,684.817 423.78,685.03C423.423,685.243 423.172,685.507 423.027,685.824L421.926,685.572C422.164,684.013 422.283,682.509 422.283,681.06L427.551,681.06Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_14">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M358.216,655.604L400.794,659.667L395.546,702.839L361.385,694.522L358.216,683.927L356.335,668.975L358.216,655.604Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M375.668,683.256L375.668,676.5C375.497,676.891 375.213,677.211 374.819,677.461C374.416,677.715 374.012,677.86 373.606,677.895L373.401,676.823C374.026,676.756 374.545,676.554 374.959,676.216C375.373,675.878 375.651,675.424 375.791,674.854L376.711,674.854L376.711,683.256L375.668,683.256Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M381.832,683.256L381.832,681.106L378.053,681.106L378.053,680.016C378.432,679.645 378.736,679.301 378.964,678.985C379.193,678.668 379.373,678.326 379.506,677.956C379.639,677.587 379.728,677.212 379.773,676.831C379.818,676.451 379.844,675.973 379.852,675.399L379.852,674.854L380.895,674.854L380.895,675.399C380.895,676.411 380.768,677.297 380.514,678.059C380.264,678.813 379.811,679.518 379.155,680.174L381.832,680.174L381.832,677.45L382.875,677.45L382.875,680.174L384.305,680.174L384.305,681.106L382.875,681.106L382.875,683.256L381.832,683.256Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-13 22:23:28 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_12">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M149.853,733.081L122.28,692.883C122.28,692.883 124.456,680.548 133.455,673.437C142.452,666.327 148.981,662.263 148.981,662.263L176.265,713.2L149.853,733.081Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M145.556,701.85L145.556,695.094C145.384,695.485 145.101,695.805 144.706,696.055C144.304,696.309 143.9,696.454 143.494,696.489L143.289,695.416C143.914,695.35 144.433,695.148 144.847,694.81C145.261,694.472 145.539,694.018 145.679,693.448L146.599,693.448L146.599,701.85L145.556,701.85Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M150.496,698.481C151.136,698.149 151.58,697.901 151.826,697.737C152.162,697.514 152.415,697.266 152.587,696.993C152.759,696.719 152.845,696.395 152.845,696.02C152.845,695.493 152.671,695.069 152.324,694.748C151.976,694.428 151.507,694.268 150.917,694.268C150.382,694.268 149.936,694.433 149.579,694.763C149.221,695.093 149.042,695.491 149.042,695.955C149.042,696.44 149.199,696.877 149.511,697.268L148.621,697.842C148.199,697.291 147.988,696.688 147.988,696.032C147.988,695.274 148.264,694.634 148.817,694.113C149.37,693.591 150.085,693.33 150.964,693.33C151.867,693.33 152.581,693.574 153.106,694.06C153.631,694.546 153.894,695.182 153.894,695.967C153.894,696.635 153.727,697.192 153.393,697.637C153.059,698.082 152.54,698.483 151.837,698.838C151.353,699.096 150.937,699.325 150.589,699.524C150.3,699.688 150.051,699.887 149.842,700.121C149.633,700.356 149.507,700.608 149.464,700.877L153.906,700.877L153.906,701.85L148.169,701.85C148.169,701.299 148.265,700.81 148.457,700.382C148.648,699.955 148.909,699.593 149.239,699.298C149.569,699.003 149.988,698.731 150.496,698.481Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_11">
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M148.982,662.264L176.264,713.201L209.787,688.239L175.394,645.14L148.982,662.264Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M176.38,682.058L176.38,675.302C176.208,675.693 175.925,676.013 175.531,676.263C175.128,676.517 174.724,676.662 174.318,676.697L174.113,675.624C174.738,675.558 175.257,675.356 175.671,675.018C176.085,674.68 176.363,674.226 176.503,673.656L177.423,673.656L177.423,682.058L176.38,682.058Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M180.863,682.058L180.863,675.302C180.691,675.693 180.408,676.013 180.013,676.263C179.611,676.517 179.206,676.662 178.8,676.697L178.595,675.624C179.22,675.558 179.74,675.356 180.154,675.018C180.568,674.68 180.845,674.226 180.986,673.656L181.906,673.656L181.906,682.058L180.863,682.058Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-13 22:23:28 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_10">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M175.394,645.14L209.787,688.24L237.649,668.068L210.658,622.791L175.394,645.14Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M203.09,659.29L203.09,652.535C202.918,652.925 202.635,653.246 202.241,653.496C201.838,653.749 201.434,653.894 201.028,653.929L200.823,652.857C201.448,652.79 201.967,652.588 202.381,652.25C202.795,651.912 203.073,651.458 203.213,650.888L204.133,650.888L204.133,659.29L203.09,659.29Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
<path d="M206.448,658.233C205.838,657.45 205.534,656.402 205.534,655.089C205.534,653.777 205.838,652.729 206.448,651.946C207.057,651.163 207.872,650.771 208.891,650.771C209.918,650.771 210.738,651.162 211.349,651.943C211.96,652.724 212.266,653.773 212.266,655.089C212.266,656.406 211.96,657.455 211.349,658.236C210.738,659.017 209.918,659.408 208.891,659.408C207.872,659.408 207.057,659.016 206.448,658.233ZM211.223,655.089C211.223,654.101 211.018,653.288 210.608,652.652C210.217,652.023 209.645,651.708 208.891,651.708C208.153,651.708 207.582,652.023 207.18,652.652C206.77,653.288 206.565,654.101 206.565,655.089C206.565,656.078 206.77,656.89 207.18,657.527C207.586,658.16 208.157,658.476 208.891,658.476C209.641,658.476 210.213,658.16 210.608,657.527C211.018,656.89 211.223,656.078 211.223,655.089Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_9">
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M210.658,622.791L237.649,668.068L244.905,663.134L269.576,649.638L241.712,606.102L234.892,607.989L210.657,622.791L210.658,622.791Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M235.628,640.197L236.647,639.892C236.698,640.482 236.894,640.932 237.233,641.243C237.573,641.553 238.034,641.708 238.616,641.708C239.292,641.708 239.828,641.42 240.225,640.844C240.621,640.268 240.821,639.451 240.825,638.392L240.813,637.964C240.626,638.453 240.331,638.84 239.929,639.127C239.526,639.414 239.061,639.558 238.534,639.558C237.706,639.558 237.037,639.3 236.527,638.785C236.018,638.269 235.763,637.63 235.763,636.869C235.763,636.454 235.835,636.071 235.979,635.717C236.124,635.364 236.321,635.065 236.571,634.821C236.821,634.577 237.117,634.385 237.459,634.246C237.801,634.108 238.167,634.038 238.558,634.038C239.675,634.038 240.491,634.439 241.007,635.24C241.526,636.037 241.786,637.068 241.786,638.333C241.786,638.806 241.749,639.253 241.675,639.675C241.601,640.097 241.479,640.493 241.311,640.862C241.144,641.231 240.936,641.548 240.69,641.814C240.444,642.079 240.14,642.289 239.776,642.444C239.413,642.598 239.007,642.675 238.558,642.675C237.745,642.675 237.076,642.44 236.551,641.969C236.025,641.498 235.718,640.908 235.628,640.197ZM240.438,636.798C240.438,636.271 240.267,635.835 239.923,635.492C239.591,635.148 239.155,634.976 238.616,634.976C238.085,634.976 237.649,635.152 237.31,635.503C236.974,635.851 236.806,636.294 236.806,636.833C236.806,637.376 236.974,637.81 237.31,638.134C237.645,638.458 238.081,638.621 238.616,638.621C239.147,638.621 239.584,638.452 239.926,638.114C240.268,637.776 240.438,637.337 240.438,636.798Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-13 22:23:28 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_8">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M241.713,606.103L269.576,649.639L294.246,641.367L286.264,598.847L269.576,599.573L241.713,606.103Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M268.019,628.33C268.019,627.803 268.164,627.334 268.456,626.924C268.747,626.514 269.15,626.227 269.665,626.063C268.88,625.704 268.488,625.131 268.488,624.346C268.488,623.745 268.721,623.239 269.188,622.829C269.655,622.418 270.261,622.213 271.007,622.213C271.749,622.213 272.355,622.418 272.824,622.829C273.292,623.239 273.527,623.745 273.527,624.346C273.527,625.131 273.134,625.704 272.349,626.063C272.865,626.227 273.268,626.514 273.559,626.924C273.85,627.334 273.996,627.803 273.996,628.33C273.996,628.67 273.929,628.992 273.796,629.294C273.664,629.597 273.473,629.865 273.225,630.097C272.977,630.329 272.663,630.513 272.282,630.648C271.901,630.783 271.476,630.85 271.007,630.85C270.539,630.85 270.113,630.783 269.73,630.648C269.347,630.513 269.033,630.329 268.787,630.097C268.54,629.865 268.351,629.597 268.218,629.294C268.085,628.992 268.019,628.67 268.019,628.33ZM272.964,628.213C272.964,627.725 272.784,627.327 272.422,627.018C272.061,626.709 271.589,626.555 271.007,626.555C270.425,626.555 269.954,626.709 269.592,627.018C269.231,627.327 269.05,627.725 269.05,628.213C269.05,628.717 269.226,629.121 269.578,629.426C269.929,629.731 270.406,629.883 271.007,629.883C271.609,629.883 272.085,629.731 272.437,629.426C272.789,629.121 272.964,628.717 272.964,628.213ZM272.519,624.399C272.519,624.032 272.379,623.732 272.1,623.499C271.821,623.267 271.456,623.151 271.007,623.151C270.558,623.151 270.194,623.267 269.915,623.499C269.635,623.732 269.496,624.032 269.496,624.399C269.496,624.789 269.633,625.101 269.909,625.333C270.184,625.566 270.55,625.682 271.007,625.682C271.464,625.682 271.831,625.566 272.106,625.333C272.381,625.101 272.519,624.789 272.519,624.399Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_7">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M328.494,637.884L335.315,614.375L327.333,599.863L286.265,598.847L294.246,641.367L328.494,637.884Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M308.561,615.361L314.034,615.361L314.034,616.216C312.19,617.482 311.269,619.345 311.269,621.806C311.269,622.384 311.317,623.037 311.415,623.763L310.272,623.763C310.202,623.212 310.167,622.644 310.167,622.058C310.167,619.667 310.976,617.759 312.593,616.333L308.561,616.333L308.561,615.361Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_6">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M319.787,651.67L318.191,667.343L314.998,675.905L291.344,709.137L282.492,714.506L278.734,660.232L303.534,650.944L319.787,651.67Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M289.802,676.824C289.802,676.206 289.873,675.635 290.013,675.11C290.154,674.584 290.357,674.122 290.623,673.724C290.888,673.326 291.231,673.013 291.651,672.787C292.071,672.56 292.546,672.447 293.078,672.447C293.859,672.447 294.488,672.646 294.964,673.044C295.441,673.443 295.728,673.988 295.826,674.679L294.841,674.978C294.685,673.915 294.078,673.384 293.019,673.384C292.718,673.384 292.438,673.454 292.178,673.592C291.918,673.731 291.688,673.934 291.487,674.202C291.286,674.469 291.126,674.822 291.009,675.259C290.892,675.697 290.833,676.195 290.833,676.753L290.833,676.923C291.033,676.521 291.346,676.194 291.774,675.942C292.202,675.69 292.656,675.564 293.136,675.564C293.66,675.564 294.129,675.685 294.545,675.927C294.961,676.169 295.281,676.493 295.503,676.897C295.726,677.301 295.837,677.746 295.837,678.23C295.837,679.07 295.573,679.755 295.043,680.287C294.514,680.818 293.843,681.083 293.031,681.083C292.507,681.083 292.039,680.978 291.627,680.767C291.215,680.556 290.876,680.261 290.611,679.882C290.345,679.503 290.144,679.055 290.007,678.538C289.871,678.02 289.802,677.449 289.802,676.824ZM294.806,678.324C294.806,677.777 294.631,677.336 294.282,677.002C293.932,676.668 293.482,676.501 292.931,676.501C292.435,676.501 292.011,676.671 291.66,677.011C291.308,677.351 291.132,677.777 291.132,678.288C291.132,678.831 291.308,679.272 291.66,679.61C292.011,679.948 292.46,680.117 293.007,680.117C293.535,680.117 293.966,679.95 294.302,679.616C294.638,679.282 294.806,678.851 294.806,678.324Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_5">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M278.734,660.232L282.491,714.506L260.433,730.034L231.845,689.981L249.114,676.63L278.734,660.232Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M263.608,694.347L263.608,695.32L259.313,695.32C259.313,696.128 259.213,697.029 259.014,698.021C259.268,697.728 259.587,697.495 259.972,697.321C260.357,697.147 260.774,697.06 261.223,697.06C262.02,697.06 262.681,697.308 263.207,697.804C263.732,698.3 263.995,698.968 263.995,699.808C263.995,700.714 263.714,701.451 263.154,702.017C262.593,702.583 261.844,702.867 260.907,702.867C260.118,702.867 259.442,702.656 258.879,702.234C258.321,701.804 257.989,701.193 257.883,700.4L258.891,700.107C258.985,700.685 259.202,701.128 259.541,701.437C259.881,701.746 260.336,701.9 260.907,701.9C261.54,701.9 262.038,701.718 262.401,701.355C262.764,700.992 262.946,700.517 262.946,699.931C262.946,699.345 262.776,698.876 262.436,698.525C262.096,698.173 261.612,697.997 260.983,697.997C260.577,697.997 260.195,698.104 259.837,698.317C259.48,698.53 259.229,698.794 259.084,699.111L257.983,698.859C258.221,697.3 258.34,695.796 258.34,694.347L263.608,694.347Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_4">
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M231.844,689.982L260.432,730.035L225.894,753.688L200.353,714.506L231.844,689.982Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M227.86,727.085L227.86,724.935L224.081,724.935L224.081,723.845C224.459,723.474 224.763,723.13 224.992,722.814C225.22,722.497 225.401,722.155 225.534,721.786C225.666,721.416 225.755,721.041 225.8,720.661C225.845,720.28 225.872,719.802 225.879,719.228L225.879,718.683L226.922,718.683L226.922,719.228C226.922,720.24 226.795,721.126 226.541,721.888C226.291,722.642 225.838,723.347 225.182,724.003L227.86,724.003L227.86,721.279L228.903,721.279L228.903,724.003L230.332,724.003L230.332,724.935L228.903,724.935L228.903,727.085L227.86,727.085Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_3">
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M200.353,714.507L225.894,753.689L192.952,777.053L167.267,738.742L200.353,714.507Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g>
|
|
|
|
|
<path d="M191.398,745.988L192.394,745.542C192.469,746.121 192.692,746.581 193.065,746.925C193.438,747.269 193.914,747.441 194.492,747.441C195.035,747.441 195.495,747.268 195.872,746.922C196.249,746.577 196.437,746.128 196.437,745.578C196.437,744.988 196.265,744.525 195.919,744.189C195.573,743.853 195.111,743.685 194.533,743.685C194.303,743.685 194.08,743.722 193.865,743.796C193.65,743.871 193.473,743.972 193.332,744.101L192.728,743.357L195.564,740.861L191.756,740.861L191.756,739.888L197.146,739.888L197.146,740.685L194.521,742.953C194.658,742.925 194.805,742.912 194.961,742.912C195.398,742.912 195.806,743.013 196.183,743.216C196.56,743.419 196.868,743.722 197.108,744.124C197.349,744.527 197.469,744.988 197.469,745.507C197.469,746.367 197.187,747.065 196.625,747.602C196.062,748.139 195.352,748.408 194.492,748.408C193.68,748.408 192.999,748.187 192.45,747.746C191.901,747.304 191.551,746.718 191.398,745.988Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="cp_2">
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M125.328,723.939L139.55,744.981C139.55,744.981 145.934,752.527 154.207,747.303C162.478,742.079 167.267,738.741 167.267,738.741L190.776,774.15L154.352,799.11C154.352,799.11 139.259,803.899 136.357,787.791C133.455,771.683 132.729,759.348 132.729,759.348L128.956,759.783L125.328,723.939Z" style="fill:rgb(239,237,236);fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M154.682,772.663C155.322,772.331 155.766,772.083 156.012,771.919C156.348,771.697 156.602,771.449 156.773,771.175C156.945,770.902 157.031,770.578 157.031,770.203C157.031,769.675 156.857,769.251 156.51,768.931C156.162,768.611 155.693,768.451 155.103,768.451C154.568,768.451 154.122,768.617 153.765,768.947C153.407,769.277 153.228,769.673 153.228,770.138C153.228,770.622 153.385,771.06 153.697,771.451L152.807,772.025C152.385,771.474 152.174,770.871 152.174,770.214C152.174,769.456 152.45,768.818 153.003,768.296C153.556,767.775 154.271,767.513 155.15,767.513C156.053,767.513 156.767,767.757 157.292,768.244C157.817,768.73 158.08,769.365 158.08,770.15C158.08,770.818 157.913,771.374 157.579,771.82C157.245,772.265 156.727,772.665 156.023,773.021C155.539,773.279 155.123,773.507 154.775,773.706C154.486,773.871 154.237,774.07 154.028,774.304C153.819,774.538 153.693,774.79 153.65,775.06L158.092,775.06L158.092,776.033L152.355,776.033C152.355,775.482 152.451,774.994 152.643,774.566C152.834,774.138 153.095,773.777 153.425,773.482C153.755,773.187 154.174,772.913 154.682,772.663Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g id="limits-arees" transform="matrix(1,0,0,1,83.2784,66.1766)">
|
|
|
|
|
<path d="M44.741,124.392L88.09,87.544" style="fill:none;fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<path d="M43.94,125.028C56.537,114.312 65.425,106.795 85.723,89.432" style="fill:none;fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;stroke-dasharray:0,0,0,0,5,5,0,0;"/>
|
|
|
|
|
<path d="M163.966,110.52L146.18,136.531" style="fill:none;fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;"/>
|
|
|
|
|
<path d="M162.292,112.97L147.301,134.894" style="fill:none;fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:1px;stroke-dasharray:0,0,0,0,5,5,0,0;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<path d="M1005.3,785.864L993.251,752.249L984.744,743.236L975.482,721.834L967.569,709.353L968.432,705.757L964.547,700.577L975.482,656.408L990.641,613.969L1025.89,497.04L905.176,471.507L828.258,486.249L822.736,524.243L730.342,523.375L490.463,529.547L456.629,527.713L442.801,517.736L427.566,495.109L416.075,459.213L404.2,393.441L403.497,348.188L431.634,344.436L448.281,321.927L448.516,294.024L457.123,223.682L450.861,188.46L443.763,188.46L443.763,177.217L446.316,138.879L447.856,118.713L453.061,105.129L464.226,50.172L469.544,33.589L444.075,24.96L444.075,0.5L385.835,5.53L389.584,36.466L338.803,35.027L160.205,93.298L87.781,46.538L27.907,17.76L0.5,34.308C0.5,34.308 15.717,81.004 16.114,84.972C16.511,88.939 22.462,96.877 22.462,96.877C28.016,102.038 27.907,104.809 27.907,104.809C34.543,109.57 28.413,118.695 34.761,158.766C41.109,198.837 36.958,209.946 36.958,209.946L42.696,234.061L38.728,235.732L43.489,265.747C43.489,265.747 28.016,324.604 22.462,343.411C16.908,362.218 27.907,381.735 27.907,381.735C27.907,381.735 35.951,391.257 65.31,425.886C94.669,460.515 84.75,492.273 84.75,492.273L72.232,553.525L53.011,601.86C22.462,652.576 23.255,673.936 23.255,673.936C23.255,673.936 12.94,775.105 16.114,805.655C19.288,836.204 8.973,891.748 9.369,913.172C9.766,934.596 27.62,948.085 27.62,948.085L11.024,958.97L22.491,984.197L24.784,1007.89L55.903,1023.95L76.766,1024.71L104.606,1020.12L131.04,998.721L173.713,1059.11L196.315,1043.06L158.052,982.668L164.789,975.024L209.782,952.855L264.051,901.863L307.766,881.282L361.797,842.478L390.255,830.457C413.801,808.612 417.615,796.798 417.615,796.798L462.49,781.08L493.97,790.904L534.677,776.659L657.981,774.695L748.681,761.856C749.388,756.28 767.441,748.199 767.441,748.199C767.441,748.199 886.208,749.002 911.019,748.199C935.831,747.397 945.755,763.18 952.135,793.644C958.515,824.109 959.224,871.64 959.224,871.64L960.275,1020.16L1332.94,1020.16L1332.94,785.634L1005.3,785.864Z" style="fill:none;fill-rule:nonzero;stroke:rgb(0,170,125);stroke-width:1px;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
<path d="M917.899,574.226L918.135,628.156" style="fill:none;fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:0.98px;stroke-dasharray:0,0,0,0,4.9,4.9,0,0;"/>
|
|
|
|
|
<path d="M889.283,573.774L886.442,630.649" style="fill:none;fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:0.95px;stroke-dasharray:0,0,0,0,4.76,4.76,0,0;"/>
|
|
|
|
|
<path d="M857.095,572.857L853.519,628.049" style="fill:none;fill-rule:nonzero;stroke:rgb(82,84,83);stroke-width:0.98px;stroke-dasharray:0,0,0,0,4.9,4.9,0,0;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g id="icones">
|
|
|
|
|
<g id="fonts" transform="matrix(1,0,0,1,83.2784,66.1766)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g id="aixeta">
|
|
|
|
|
<circle cx="344.249" cy="713.276" r="13.939" style="fill:white;"/>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="Capa-1" transform="matrix(0.247622,0,0,0.247622,338.249,704.841)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,1.9996,40.5697)">
|
|
|
|
|
<path d="M0,-26.667L35.339,-26.667C40.377,-26.667 44.462,-22.583 44.462,-17.545L44.462,0L32.838,0L32.838,-14.783L0,-14.783" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,46.4609,11.9023)">
|
|
|
|
|
<path d="M0,30.667L-11.624,30.667C-12.729,30.667 -13.624,29.771 -13.624,28.667L-13.624,15.884L-44.461,15.884C-45.565,15.884 -46.461,14.989 -46.461,13.884C-46.461,12.78 -45.565,11.884 -44.461,11.884L-11.624,11.884C-10.52,11.884 -9.624,12.78 -9.624,13.884L-9.624,26.667L-2,26.667L-2,11.123C-2,7.196 -5.195,4 -9.122,4L-44.461,4C-45.565,4 -46.461,3.105 -46.461,2C-46.461,0.896 -45.565,0 -44.461,0L-9.122,0C-2.989,0 2,4.99 2,11.123L2,28.667C2,29.771 1.104,30.667 0,30.667" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,41.0783,66.5383)">
|
|
|
|
|
<path d="M0,-18.05L4.517,-7.399C5.374,-5.378 4.822,-3.035 3.153,-1.61C1.322,-0.047 -1.36,0 -3.244,-1.499L-3.319,-1.559C-5.126,-2.996 -5.722,-5.478 -4.766,-7.579L0,-18.05Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,41.0137,61.1595)">
|
|
|
|
|
<path d="M0,-7.701L-2.881,-1.371C-3.458,-0.103 -3.1,1.388 -2.01,2.255C-2.009,2.256 -1.933,2.317 -1.932,2.318C-0.803,3.215 0.818,3.186 1.918,2.248C2.929,1.385 3.26,-0.016 2.741,-1.239L0,-7.701ZM-0.049,6.97C-1.596,6.97 -3.145,6.464 -4.425,5.445C-4.426,5.445 -4.502,5.383 -4.503,5.382C-7.029,3.374 -7.86,-0.086 -6.521,-3.028L-1.756,-13.5C-1.427,-14.222 -0.722,-14.653 0.091,-14.671C0.884,-14.661 1.596,-14.182 1.905,-13.452L6.423,-2.801C7.627,0.037 6.86,3.289 4.516,5.291C3.206,6.408 1.58,6.97 -0.049,6.97" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,11.4414,0.6971)">
|
|
|
|
|
<path d="M0,15.051C-1.104,15.051 -2,14.155 -2,13.051L-2,2C-2,0.895 -1.104,0 0,0C1.104,0 2,0.895 2,2L2,13.051C2,14.155 1.104,15.051 0,15.051" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,18.9658,0)">
|
|
|
|
|
<path d="M0,4L-15.606,4C-16.711,4 -17.606,3.104 -17.606,2C-17.606,0.896 -16.711,0 -15.606,0L0,0C1.104,0 2,0.896 2,2C2,3.104 1.104,4 0,4" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="aixeta1" transform="matrix(1,0,0,1,133.841,-129.855)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<circle cx="344.249" cy="713.276" r="13.939" style="fill:white;"/>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="Capa-11" transform="matrix(0.247622,0,0,0.247622,338.249,704.841)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,1.9996,40.5697)">
|
|
|
|
|
<path d="M0,-26.667L35.339,-26.667C40.377,-26.667 44.462,-22.583 44.462,-17.545L44.462,0L32.838,0L32.838,-14.783L0,-14.783" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,46.4609,11.9023)">
|
|
|
|
|
<path d="M0,30.667L-11.624,30.667C-12.729,30.667 -13.624,29.771 -13.624,28.667L-13.624,15.884L-44.461,15.884C-45.565,15.884 -46.461,14.989 -46.461,13.884C-46.461,12.78 -45.565,11.884 -44.461,11.884L-11.624,11.884C-10.52,11.884 -9.624,12.78 -9.624,13.884L-9.624,26.667L-2,26.667L-2,11.123C-2,7.196 -5.195,4 -9.122,4L-44.461,4C-45.565,4 -46.461,3.105 -46.461,2C-46.461,0.896 -45.565,0 -44.461,0L-9.122,0C-2.989,0 2,4.99 2,11.123L2,28.667C2,29.771 1.104,30.667 0,30.667" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,41.0783,66.5383)">
|
|
|
|
|
<path d="M0,-18.05L4.517,-7.399C5.374,-5.378 4.822,-3.035 3.153,-1.61C1.322,-0.047 -1.36,0 -3.244,-1.499L-3.319,-1.559C-5.126,-2.996 -5.722,-5.478 -4.766,-7.579L0,-18.05Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,41.0137,61.1595)">
|
|
|
|
|
<path d="M0,-7.701L-2.881,-1.371C-3.458,-0.103 -3.1,1.388 -2.01,2.255C-2.009,2.256 -1.933,2.317 -1.932,2.318C-0.803,3.215 0.818,3.186 1.918,2.248C2.929,1.385 3.26,-0.016 2.741,-1.239L0,-7.701ZM-0.049,6.97C-1.596,6.97 -3.145,6.464 -4.425,5.445C-4.426,5.445 -4.502,5.383 -4.503,5.382C-7.029,3.374 -7.86,-0.086 -6.521,-3.028L-1.756,-13.5C-1.427,-14.222 -0.722,-14.653 0.091,-14.671C0.884,-14.661 1.596,-14.182 1.905,-13.452L6.423,-2.801C7.627,0.037 6.86,3.289 4.516,5.291C3.206,6.408 1.58,6.97 -0.049,6.97" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,11.4414,0.6971)">
|
|
|
|
|
<path d="M0,15.051C-1.104,15.051 -2,14.155 -2,13.051L-2,2C-2,0.895 -1.104,0 0,0C1.104,0 2,0.895 2,2L2,13.051C2,14.155 1.104,15.051 0,15.051" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,18.9658,0)">
|
|
|
|
|
<path d="M0,4L-15.606,4C-16.711,4 -17.606,3.104 -17.606,2C-17.606,0.896 -16.711,0 -15.606,0L0,0C1.104,0 2,0.896 2,2C2,3.104 1.104,4 0,4" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="aixeta2" transform="matrix(1,0,0,1,-209.023,-198.124)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<circle cx="344.249" cy="713.276" r="13.939" style="fill:white;"/>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="Capa-12" transform="matrix(0.247622,0,0,0.247622,338.249,704.841)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,1.9996,40.5697)">
|
|
|
|
|
<path d="M0,-26.667L35.339,-26.667C40.377,-26.667 44.462,-22.583 44.462,-17.545L44.462,0L32.838,0L32.838,-14.783L0,-14.783" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,46.4609,11.9023)">
|
|
|
|
|
<path d="M0,30.667L-11.624,30.667C-12.729,30.667 -13.624,29.771 -13.624,28.667L-13.624,15.884L-44.461,15.884C-45.565,15.884 -46.461,14.989 -46.461,13.884C-46.461,12.78 -45.565,11.884 -44.461,11.884L-11.624,11.884C-10.52,11.884 -9.624,12.78 -9.624,13.884L-9.624,26.667L-2,26.667L-2,11.123C-2,7.196 -5.195,4 -9.122,4L-44.461,4C-45.565,4 -46.461,3.105 -46.461,2C-46.461,0.896 -45.565,0 -44.461,0L-9.122,0C-2.989,0 2,4.99 2,11.123L2,28.667C2,29.771 1.104,30.667 0,30.667" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,41.0783,66.5383)">
|
|
|
|
|
<path d="M0,-18.05L4.517,-7.399C5.374,-5.378 4.822,-3.035 3.153,-1.61C1.322,-0.047 -1.36,0 -3.244,-1.499L-3.319,-1.559C-5.126,-2.996 -5.722,-5.478 -4.766,-7.579L0,-18.05Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,41.0137,61.1595)">
|
|
|
|
|
<path d="M0,-7.701L-2.881,-1.371C-3.458,-0.103 -3.1,1.388 -2.01,2.255C-2.009,2.256 -1.933,2.317 -1.932,2.318C-0.803,3.215 0.818,3.186 1.918,2.248C2.929,1.385 3.26,-0.016 2.741,-1.239L0,-7.701ZM-0.049,6.97C-1.596,6.97 -3.145,6.464 -4.425,5.445C-4.426,5.445 -4.502,5.383 -4.503,5.382C-7.029,3.374 -7.86,-0.086 -6.521,-3.028L-1.756,-13.5C-1.427,-14.222 -0.722,-14.653 0.091,-14.671C0.884,-14.661 1.596,-14.182 1.905,-13.452L6.423,-2.801C7.627,0.037 6.86,3.289 4.516,5.291C3.206,6.408 1.58,6.97 -0.049,6.97" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,11.4414,0.6971)">
|
|
|
|
|
<path d="M0,15.051C-1.104,15.051 -2,14.155 -2,13.051L-2,2C-2,0.895 -1.104,0 0,0C1.104,0 2,0.895 2,2L2,13.051C2,14.155 1.104,15.051 0,15.051" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,18.9658,0)">
|
|
|
|
|
<path d="M0,4L-15.606,4C-16.711,4 -17.606,3.104 -17.606,2C-17.606,0.896 -16.711,0 -15.606,0L0,0C1.104,0 2,0.896 2,2C2,3.104 1.104,4 0,4" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="aixeta3" transform="matrix(1,0,0,1,-228.591,-347.783)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<circle cx="344.249" cy="713.276" r="13.939" style="fill:white;"/>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="Capa-13" transform="matrix(0.247622,0,0,0.247622,338.249,704.841)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,1.9996,40.5697)">
|
|
|
|
|
<path d="M0,-26.667L35.339,-26.667C40.377,-26.667 44.462,-22.583 44.462,-17.545L44.462,0L32.838,0L32.838,-14.783L0,-14.783" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,46.4609,11.9023)">
|
|
|
|
|
<path d="M0,30.667L-11.624,30.667C-12.729,30.667 -13.624,29.771 -13.624,28.667L-13.624,15.884L-44.461,15.884C-45.565,15.884 -46.461,14.989 -46.461,13.884C-46.461,12.78 -45.565,11.884 -44.461,11.884L-11.624,11.884C-10.52,11.884 -9.624,12.78 -9.624,13.884L-9.624,26.667L-2,26.667L-2,11.123C-2,7.196 -5.195,4 -9.122,4L-44.461,4C-45.565,4 -46.461,3.105 -46.461,2C-46.461,0.896 -45.565,0 -44.461,0L-9.122,0C-2.989,0 2,4.99 2,11.123L2,28.667C2,29.771 1.104,30.667 0,30.667" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,41.0783,66.5383)">
|
|
|
|
|
<path d="M0,-18.05L4.517,-7.399C5.374,-5.378 4.822,-3.035 3.153,-1.61C1.322,-0.047 -1.36,0 -3.244,-1.499L-3.319,-1.559C-5.126,-2.996 -5.722,-5.478 -4.766,-7.579L0,-18.05Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,41.0137,61.1595)">
|
|
|
|
|
<path d="M0,-7.701L-2.881,-1.371C-3.458,-0.103 -3.1,1.388 -2.01,2.255C-2.009,2.256 -1.933,2.317 -1.932,2.318C-0.803,3.215 0.818,3.186 1.918,2.248C2.929,1.385 3.26,-0.016 2.741,-1.239L0,-7.701ZM-0.049,6.97C-1.596,6.97 -3.145,6.464 -4.425,5.445C-4.426,5.445 -4.502,5.383 -4.503,5.382C-7.029,3.374 -7.86,-0.086 -6.521,-3.028L-1.756,-13.5C-1.427,-14.222 -0.722,-14.653 0.091,-14.671C0.884,-14.661 1.596,-14.182 1.905,-13.452L6.423,-2.801C7.627,0.037 6.86,3.289 4.516,5.291C3.206,6.408 1.58,6.97 -0.049,6.97" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,11.4414,0.6971)">
|
|
|
|
|
<path d="M0,15.051C-1.104,15.051 -2,14.155 -2,13.051L-2,2C-2,0.895 -1.104,0 0,0C1.104,0 2,0.895 2,2L2,13.051C2,14.155 1.104,15.051 0,15.051" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,18.9658,0)">
|
|
|
|
|
<path d="M0,4L-15.606,4C-16.711,4 -17.606,3.104 -17.606,2C-17.606,0.896 -16.711,0 -15.606,0L0,0C1.104,0 2,0.896 2,2C2,3.104 1.104,4 0,4" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="aixeta4" transform="matrix(1,0,0,1,40.2221,-459.869)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<circle cx="344.249" cy="713.276" r="13.939" style="fill:white;"/>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="Capa-14" transform="matrix(0.247622,0,0,0.247622,338.249,704.841)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,1.9996,40.5697)">
|
|
|
|
|
<path d="M0,-26.667L35.339,-26.667C40.377,-26.667 44.462,-22.583 44.462,-17.545L44.462,0L32.838,0L32.838,-14.783L0,-14.783" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,46.4609,11.9023)">
|
|
|
|
|
<path d="M0,30.667L-11.624,30.667C-12.729,30.667 -13.624,29.771 -13.624,28.667L-13.624,15.884L-44.461,15.884C-45.565,15.884 -46.461,14.989 -46.461,13.884C-46.461,12.78 -45.565,11.884 -44.461,11.884L-11.624,11.884C-10.52,11.884 -9.624,12.78 -9.624,13.884L-9.624,26.667L-2,26.667L-2,11.123C-2,7.196 -5.195,4 -9.122,4L-44.461,4C-45.565,4 -46.461,3.105 -46.461,2C-46.461,0.896 -45.565,0 -44.461,0L-9.122,0C-2.989,0 2,4.99 2,11.123L2,28.667C2,29.771 1.104,30.667 0,30.667" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,41.0783,66.5383)">
|
|
|
|
|
<path d="M0,-18.05L4.517,-7.399C5.374,-5.378 4.822,-3.035 3.153,-1.61C1.322,-0.047 -1.36,0 -3.244,-1.499L-3.319,-1.559C-5.126,-2.996 -5.722,-5.478 -4.766,-7.579L0,-18.05Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,41.0137,61.1595)">
|
|
|
|
|
<path d="M0,-7.701L-2.881,-1.371C-3.458,-0.103 -3.1,1.388 -2.01,2.255C-2.009,2.256 -1.933,2.317 -1.932,2.318C-0.803,3.215 0.818,3.186 1.918,2.248C2.929,1.385 3.26,-0.016 2.741,-1.239L0,-7.701ZM-0.049,6.97C-1.596,6.97 -3.145,6.464 -4.425,5.445C-4.426,5.445 -4.502,5.383 -4.503,5.382C-7.029,3.374 -7.86,-0.086 -6.521,-3.028L-1.756,-13.5C-1.427,-14.222 -0.722,-14.653 0.091,-14.671C0.884,-14.661 1.596,-14.182 1.905,-13.452L6.423,-2.801C7.627,0.037 6.86,3.289 4.516,5.291C3.206,6.408 1.58,6.97 -0.049,6.97" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,11.4414,0.6971)">
|
|
|
|
|
<path d="M0,15.051C-1.104,15.051 -2,14.155 -2,13.051L-2,2C-2,0.895 -1.104,0 0,0C1.104,0 2,0.895 2,2L2,13.051C2,14.155 1.104,15.051 0,15.051" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,18.9658,0)">
|
|
|
|
|
<path d="M0,4L-15.606,4C-16.711,4 -17.606,3.104 -17.606,2C-17.606,0.896 -16.711,0 -15.606,0L0,0C1.104,0 2,0.896 2,2C2,3.104 1.104,4 0,4" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="aixeta5" transform="matrix(1,0,0,1,-70.2528,-561.759)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<circle cx="344.249" cy="713.276" r="13.939" style="fill:white;"/>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="Capa-15" transform="matrix(0.247622,0,0,0.247622,338.249,704.841)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,1.9996,40.5697)">
|
|
|
|
|
<path d="M0,-26.667L35.339,-26.667C40.377,-26.667 44.462,-22.583 44.462,-17.545L44.462,0L32.838,0L32.838,-14.783L0,-14.783" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,46.4609,11.9023)">
|
|
|
|
|
<path d="M0,30.667L-11.624,30.667C-12.729,30.667 -13.624,29.771 -13.624,28.667L-13.624,15.884L-44.461,15.884C-45.565,15.884 -46.461,14.989 -46.461,13.884C-46.461,12.78 -45.565,11.884 -44.461,11.884L-11.624,11.884C-10.52,11.884 -9.624,12.78 -9.624,13.884L-9.624,26.667L-2,26.667L-2,11.123C-2,7.196 -5.195,4 -9.122,4L-44.461,4C-45.565,4 -46.461,3.105 -46.461,2C-46.461,0.896 -45.565,0 -44.461,0L-9.122,0C-2.989,0 2,4.99 2,11.123L2,28.667C2,29.771 1.104,30.667 0,30.667" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,41.0783,66.5383)">
|
|
|
|
|
<path d="M0,-18.05L4.517,-7.399C5.374,-5.378 4.822,-3.035 3.153,-1.61C1.322,-0.047 -1.36,0 -3.244,-1.499L-3.319,-1.559C-5.126,-2.996 -5.722,-5.478 -4.766,-7.579L0,-18.05Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,41.0137,61.1595)">
|
|
|
|
|
<path d="M0,-7.701L-2.881,-1.371C-3.458,-0.103 -3.1,1.388 -2.01,2.255C-2.009,2.256 -1.933,2.317 -1.932,2.318C-0.803,3.215 0.818,3.186 1.918,2.248C2.929,1.385 3.26,-0.016 2.741,-1.239L0,-7.701ZM-0.049,6.97C-1.596,6.97 -3.145,6.464 -4.425,5.445C-4.426,5.445 -4.502,5.383 -4.503,5.382C-7.029,3.374 -7.86,-0.086 -6.521,-3.028L-1.756,-13.5C-1.427,-14.222 -0.722,-14.653 0.091,-14.671C0.884,-14.661 1.596,-14.182 1.905,-13.452L6.423,-2.801C7.627,0.037 6.86,3.289 4.516,5.291C3.206,6.408 1.58,6.97 -0.049,6.97" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,11.4414,0.6971)">
|
|
|
|
|
<path d="M0,15.051C-1.104,15.051 -2,14.155 -2,13.051L-2,2C-2,0.895 -1.104,0 0,0C1.104,0 2,0.895 2,2L2,13.051C2,14.155 1.104,15.051 0,15.051" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,18.9658,0)">
|
|
|
|
|
<path d="M0,4L-15.606,4C-16.711,4 -17.606,3.104 -17.606,2C-17.606,0.896 -16.711,0 -15.606,0L0,0C1.104,0 2,0.896 2,2C2,3.104 1.104,4 0,4" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="aixeta6" transform="matrix(1,0,0,1,404.858,-93.764)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<circle cx="344.249" cy="713.276" r="13.939" style="fill:white;"/>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="Capa-16" transform="matrix(0.247622,0,0,0.247622,338.249,704.841)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,1.9996,40.5697)">
|
|
|
|
|
<path d="M0,-26.667L35.339,-26.667C40.377,-26.667 44.462,-22.583 44.462,-17.545L44.462,0L32.838,0L32.838,-14.783L0,-14.783" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,46.4609,11.9023)">
|
|
|
|
|
<path d="M0,30.667L-11.624,30.667C-12.729,30.667 -13.624,29.771 -13.624,28.667L-13.624,15.884L-44.461,15.884C-45.565,15.884 -46.461,14.989 -46.461,13.884C-46.461,12.78 -45.565,11.884 -44.461,11.884L-11.624,11.884C-10.52,11.884 -9.624,12.78 -9.624,13.884L-9.624,26.667L-2,26.667L-2,11.123C-2,7.196 -5.195,4 -9.122,4L-44.461,4C-45.565,4 -46.461,3.105 -46.461,2C-46.461,0.896 -45.565,0 -44.461,0L-9.122,0C-2.989,0 2,4.99 2,11.123L2,28.667C2,29.771 1.104,30.667 0,30.667" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,41.0783,66.5383)">
|
|
|
|
|
<path d="M0,-18.05L4.517,-7.399C5.374,-5.378 4.822,-3.035 3.153,-1.61C1.322,-0.047 -1.36,0 -3.244,-1.499L-3.319,-1.559C-5.126,-2.996 -5.722,-5.478 -4.766,-7.579L0,-18.05Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,41.0137,61.1595)">
|
|
|
|
|
<path d="M0,-7.701L-2.881,-1.371C-3.458,-0.103 -3.1,1.388 -2.01,2.255C-2.009,2.256 -1.933,2.317 -1.932,2.318C-0.803,3.215 0.818,3.186 1.918,2.248C2.929,1.385 3.26,-0.016 2.741,-1.239L0,-7.701ZM-0.049,6.97C-1.596,6.97 -3.145,6.464 -4.425,5.445C-4.426,5.445 -4.502,5.383 -4.503,5.382C-7.029,3.374 -7.86,-0.086 -6.521,-3.028L-1.756,-13.5C-1.427,-14.222 -0.722,-14.653 0.091,-14.671C0.884,-14.661 1.596,-14.182 1.905,-13.452L6.423,-2.801C7.627,0.037 6.86,3.289 4.516,5.291C3.206,6.408 1.58,6.97 -0.049,6.97" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,11.4414,0.6971)">
|
|
|
|
|
<path d="M0,15.051C-1.104,15.051 -2,14.155 -2,13.051L-2,2C-2,0.895 -1.104,0 0,0C1.104,0 2,0.895 2,2L2,13.051C2,14.155 1.104,15.051 0,15.051" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,18.9658,0)">
|
|
|
|
|
<path d="M0,4L-15.606,4C-16.711,4 -17.606,3.104 -17.606,2C-17.606,0.896 -16.711,0 -15.606,0L0,0C1.104,0 2,0.896 2,2C2,3.104 1.104,4 0,4" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="aixeta7" transform="matrix(1,0,0,1,527.907,-13.8602)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<circle cx="344.249" cy="713.276" r="13.939" style="fill:white;"/>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="Capa-17" transform="matrix(0.247622,0,0,0.247622,338.249,704.841)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,1.9996,40.5697)">
|
|
|
|
|
<path d="M0,-26.667L35.339,-26.667C40.377,-26.667 44.462,-22.583 44.462,-17.545L44.462,0L32.838,0L32.838,-14.783L0,-14.783" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,46.4609,11.9023)">
|
|
|
|
|
<path d="M0,30.667L-11.624,30.667C-12.729,30.667 -13.624,29.771 -13.624,28.667L-13.624,15.884L-44.461,15.884C-45.565,15.884 -46.461,14.989 -46.461,13.884C-46.461,12.78 -45.565,11.884 -44.461,11.884L-11.624,11.884C-10.52,11.884 -9.624,12.78 -9.624,13.884L-9.624,26.667L-2,26.667L-2,11.123C-2,7.196 -5.195,4 -9.122,4L-44.461,4C-45.565,4 -46.461,3.105 -46.461,2C-46.461,0.896 -45.565,0 -44.461,0L-9.122,0C-2.989,0 2,4.99 2,11.123L2,28.667C2,29.771 1.104,30.667 0,30.667" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,41.0783,66.5383)">
|
|
|
|
|
<path d="M0,-18.05L4.517,-7.399C5.374,-5.378 4.822,-3.035 3.153,-1.61C1.322,-0.047 -1.36,0 -3.244,-1.499L-3.319,-1.559C-5.126,-2.996 -5.722,-5.478 -4.766,-7.579L0,-18.05Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,41.0137,61.1595)">
|
|
|
|
|
<path d="M0,-7.701L-2.881,-1.371C-3.458,-0.103 -3.1,1.388 -2.01,2.255C-2.009,2.256 -1.933,2.317 -1.932,2.318C-0.803,3.215 0.818,3.186 1.918,2.248C2.929,1.385 3.26,-0.016 2.741,-1.239L0,-7.701ZM-0.049,6.97C-1.596,6.97 -3.145,6.464 -4.425,5.445C-4.426,5.445 -4.502,5.383 -4.503,5.382C-7.029,3.374 -7.86,-0.086 -6.521,-3.028L-1.756,-13.5C-1.427,-14.222 -0.722,-14.653 0.091,-14.671C0.884,-14.661 1.596,-14.182 1.905,-13.452L6.423,-2.801C7.627,0.037 6.86,3.289 4.516,5.291C3.206,6.408 1.58,6.97 -0.049,6.97" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,11.4414,0.6971)">
|
|
|
|
|
<path d="M0,15.051C-1.104,15.051 -2,14.155 -2,13.051L-2,2C-2,0.895 -1.104,0 0,0C1.104,0 2,0.895 2,2L2,13.051C2,14.155 1.104,15.051 0,15.051" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,18.9658,0)">
|
|
|
|
|
<path d="M0,4L-15.606,4C-16.711,4 -17.606,3.104 -17.606,2C-17.606,0.896 -16.711,0 -15.606,0L0,0C1.104,0 2,0.896 2,2C2,3.104 1.104,4 0,4" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
<g id="extintors" transform="matrix(1,0,0,1,83.2784,66.1766)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.073451,-4.01863)">
|
|
|
|
|
<circle cx="121.529" cy="685.642" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.924372,-0.0839278)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M13.75,13.125L13.75,18.125C13.75,18.468 13.468,18.75 13.125,18.75L8.125,18.75C7.782,18.75 7.5,18.468 7.5,18.125L7.5,13.125L13.75,13.125Z" style="fill:rgb(252,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M17.055,3.777L12.314,2.355L14.658,1.183C14.868,1.077 15.002,0.86 15.002,0.625C15.002,0.282 14.719,-0 14.377,-0C14.279,-0 14.183,0.022 14.095,0.066L10.469,1.879C7.101,1.966 4.377,4.76 4.375,8.129L4.375,16.25C4.375,16.593 4.657,16.875 5,16.875C5.343,16.875 5.625,16.593 5.625,16.25L5.625,13.75L6.875,13.75L6.875,18.125C6.875,18.811 7.439,19.375 8.125,19.375L13.125,19.375C13.811,19.375 14.375,18.811 14.375,18.125L14.375,8.125C14.372,6.304 13.045,4.734 11.25,4.428L11.25,3.34L16.695,4.973C16.758,4.994 16.823,5.004 16.889,5.004C17.232,5.004 17.514,4.722 17.514,4.379C17.514,4.099 17.325,3.851 17.055,3.777ZM6.875,8.125L6.875,12.5L5.625,12.5L5.625,8.125C5.628,5.619 7.513,3.481 10,3.166L10,4.428C8.205,4.734 6.878,6.304 6.875,8.125ZM13.125,18.125L8.125,18.125L8.125,13.75L13.125,13.75L13.125,18.125ZM13.125,8.125L13.125,12.5L8.125,12.5L8.125,8.125C8.125,6.754 9.254,5.625 10.625,5.625C11.996,5.625 13.125,6.754 13.125,8.125Z" style="fill:rgb(252,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,152.322,-108.3)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.073451,-4.01863)">
|
|
|
|
|
<circle cx="121.529" cy="685.642" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.924372,-0.0839278)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M13.75,13.125L13.75,18.125C13.75,18.468 13.468,18.75 13.125,18.75L8.125,18.75C7.782,18.75 7.5,18.468 7.5,18.125L7.5,13.125L13.75,13.125Z" style="fill:rgb(252,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M17.055,3.777L12.314,2.355L14.658,1.183C14.868,1.077 15.002,0.86 15.002,0.625C15.002,0.282 14.719,-0 14.377,-0C14.279,-0 14.183,0.022 14.095,0.066L10.469,1.879C7.101,1.966 4.377,4.76 4.375,8.129L4.375,16.25C4.375,16.593 4.657,16.875 5,16.875C5.343,16.875 5.625,16.593 5.625,16.25L5.625,13.75L6.875,13.75L6.875,18.125C6.875,18.811 7.439,19.375 8.125,19.375L13.125,19.375C13.811,19.375 14.375,18.811 14.375,18.125L14.375,8.125C14.372,6.304 13.045,4.734 11.25,4.428L11.25,3.34L16.695,4.973C16.758,4.994 16.823,5.004 16.889,5.004C17.232,5.004 17.514,4.722 17.514,4.379C17.514,4.099 17.325,3.851 17.055,3.777ZM6.875,8.125L6.875,12.5L5.625,12.5L5.625,8.125C5.628,5.619 7.513,3.481 10,3.166L10,4.428C8.205,4.734 6.878,6.304 6.875,8.125ZM13.125,18.125L8.125,18.125L8.125,13.75L13.125,13.75L13.125,18.125ZM13.125,8.125L13.125,12.5L8.125,12.5L8.125,8.125C8.125,6.754 9.254,5.625 10.625,5.625C11.996,5.625 13.125,6.754 13.125,8.125Z" style="fill:rgb(252,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,210.154,-170.756)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.073451,-4.01863)">
|
|
|
|
|
<circle cx="121.529" cy="685.642" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.924372,-0.0839278)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M13.75,13.125L13.75,18.125C13.75,18.468 13.468,18.75 13.125,18.75L8.125,18.75C7.782,18.75 7.5,18.468 7.5,18.125L7.5,13.125L13.75,13.125Z" style="fill:rgb(252,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M17.055,3.777L12.314,2.355L14.658,1.183C14.868,1.077 15.002,0.86 15.002,0.625C15.002,0.282 14.719,-0 14.377,-0C14.279,-0 14.183,0.022 14.095,0.066L10.469,1.879C7.101,1.966 4.377,4.76 4.375,8.129L4.375,16.25C4.375,16.593 4.657,16.875 5,16.875C5.343,16.875 5.625,16.593 5.625,16.25L5.625,13.75L6.875,13.75L6.875,18.125C6.875,18.811 7.439,19.375 8.125,19.375L13.125,19.375C13.811,19.375 14.375,18.811 14.375,18.125L14.375,8.125C14.372,6.304 13.045,4.734 11.25,4.428L11.25,3.34L16.695,4.973C16.758,4.994 16.823,5.004 16.889,5.004C17.232,5.004 17.514,4.722 17.514,4.379C17.514,4.099 17.325,3.851 17.055,3.777ZM6.875,8.125L6.875,12.5L5.625,12.5L5.625,8.125C5.628,5.619 7.513,3.481 10,3.166L10,4.428C8.205,4.734 6.878,6.304 6.875,8.125ZM13.125,18.125L8.125,18.125L8.125,13.75L13.125,13.75L13.125,18.125ZM13.125,8.125L13.125,12.5L8.125,12.5L8.125,8.125C8.125,6.754 9.254,5.625 10.625,5.625C11.996,5.625 13.125,6.754 13.125,8.125Z" style="fill:rgb(252,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-36.8442,-325.325)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.073451,-4.01863)">
|
|
|
|
|
<circle cx="121.529" cy="685.642" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.924372,-0.0839278)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M13.75,13.125L13.75,18.125C13.75,18.468 13.468,18.75 13.125,18.75L8.125,18.75C7.782,18.75 7.5,18.468 7.5,18.125L7.5,13.125L13.75,13.125Z" style="fill:rgb(252,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M17.055,3.777L12.314,2.355L14.658,1.183C14.868,1.077 15.002,0.86 15.002,0.625C15.002,0.282 14.719,-0 14.377,-0C14.279,-0 14.183,0.022 14.095,0.066L10.469,1.879C7.101,1.966 4.377,4.76 4.375,8.129L4.375,16.25C4.375,16.593 4.657,16.875 5,16.875C5.343,16.875 5.625,16.593 5.625,16.25L5.625,13.75L6.875,13.75L6.875,18.125C6.875,18.811 7.439,19.375 8.125,19.375L13.125,19.375C13.811,19.375 14.375,18.811 14.375,18.125L14.375,8.125C14.372,6.304 13.045,4.734 11.25,4.428L11.25,3.34L16.695,4.973C16.758,4.994 16.823,5.004 16.889,5.004C17.232,5.004 17.514,4.722 17.514,4.379C17.514,4.099 17.325,3.851 17.055,3.777ZM6.875,8.125L6.875,12.5L5.625,12.5L5.625,8.125C5.628,5.619 7.513,3.481 10,3.166L10,4.428C8.205,4.734 6.878,6.304 6.875,8.125ZM13.125,18.125L8.125,18.125L8.125,13.75L13.125,13.75L13.125,18.125ZM13.125,8.125L13.125,12.5L8.125,12.5L8.125,8.125C8.125,6.754 9.254,5.625 10.625,5.625C11.996,5.625 13.125,6.754 13.125,8.125Z" style="fill:rgb(252,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,292.83,-417.06)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.073451,-4.01863)">
|
|
|
|
|
<circle cx="121.529" cy="685.642" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.924372,-0.0839278)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M13.75,13.125L13.75,18.125C13.75,18.468 13.468,18.75 13.125,18.75L8.125,18.75C7.782,18.75 7.5,18.468 7.5,18.125L7.5,13.125L13.75,13.125Z" style="fill:rgb(252,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M17.055,3.777L12.314,2.355L14.658,1.183C14.868,1.077 15.002,0.86 15.002,0.625C15.002,0.282 14.719,-0 14.377,-0C14.279,-0 14.183,0.022 14.095,0.066L10.469,1.879C7.101,1.966 4.377,4.76 4.375,8.129L4.375,16.25C4.375,16.593 4.657,16.875 5,16.875C5.343,16.875 5.625,16.593 5.625,16.25L5.625,13.75L6.875,13.75L6.875,18.125C6.875,18.811 7.439,19.375 8.125,19.375L13.125,19.375C13.811,19.375 14.375,18.811 14.375,18.125L14.375,8.125C14.372,6.304 13.045,4.734 11.25,4.428L11.25,3.34L16.695,4.973C16.758,4.994 16.823,5.004 16.889,5.004C17.232,5.004 17.514,4.722 17.514,4.379C17.514,4.099 17.325,3.851 17.055,3.777ZM6.875,8.125L6.875,12.5L5.625,12.5L5.625,8.125C5.628,5.619 7.513,3.481 10,3.166L10,4.428C8.205,4.734 6.878,6.304 6.875,8.125ZM13.125,18.125L8.125,18.125L8.125,13.75L13.125,13.75L13.125,18.125ZM13.125,8.125L13.125,12.5L8.125,12.5L8.125,8.125C8.125,6.754 9.254,5.625 10.625,5.625C11.996,5.625 13.125,6.754 13.125,8.125Z" style="fill:rgb(252,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,122.152,-525.555)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.073451,-4.01863)">
|
|
|
|
|
<circle cx="121.529" cy="685.642" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.924372,-0.0839278)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M13.75,13.125L13.75,18.125C13.75,18.468 13.468,18.75 13.125,18.75L8.125,18.75C7.782,18.75 7.5,18.468 7.5,18.125L7.5,13.125L13.75,13.125Z" style="fill:rgb(252,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M17.055,3.777L12.314,2.355L14.658,1.183C14.868,1.077 15.002,0.86 15.002,0.625C15.002,0.282 14.719,-0 14.377,-0C14.279,-0 14.183,0.022 14.095,0.066L10.469,1.879C7.101,1.966 4.377,4.76 4.375,8.129L4.375,16.25C4.375,16.593 4.657,16.875 5,16.875C5.343,16.875 5.625,16.593 5.625,16.25L5.625,13.75L6.875,13.75L6.875,18.125C6.875,18.811 7.439,19.375 8.125,19.375L13.125,19.375C13.811,19.375 14.375,18.811 14.375,18.125L14.375,8.125C14.372,6.304 13.045,4.734 11.25,4.428L11.25,3.34L16.695,4.973C16.758,4.994 16.823,5.004 16.889,5.004C17.232,5.004 17.514,4.722 17.514,4.379C17.514,4.099 17.325,3.851 17.055,3.777ZM6.875,8.125L6.875,12.5L5.625,12.5L5.625,8.125C5.628,5.619 7.513,3.481 10,3.166L10,4.428C8.205,4.734 6.878,6.304 6.875,8.125ZM13.125,18.125L8.125,18.125L8.125,13.75L13.125,13.75L13.125,18.125ZM13.125,8.125L13.125,12.5L8.125,12.5L8.125,8.125C8.125,6.754 9.254,5.625 10.625,5.625C11.996,5.625 13.125,6.754 13.125,8.125Z" style="fill:rgb(252,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,175.539,-446.527)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.073451,-4.01863)">
|
|
|
|
|
<circle cx="121.529" cy="685.642" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.924372,-0.0839278)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M13.75,13.125L13.75,18.125C13.75,18.468 13.468,18.75 13.125,18.75L8.125,18.75C7.782,18.75 7.5,18.468 7.5,18.125L7.5,13.125L13.75,13.125Z" style="fill:rgb(252,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M17.055,3.777L12.314,2.355L14.658,1.183C14.868,1.077 15.002,0.86 15.002,0.625C15.002,0.282 14.719,-0 14.377,-0C14.279,-0 14.183,0.022 14.095,0.066L10.469,1.879C7.101,1.966 4.377,4.76 4.375,8.129L4.375,16.25C4.375,16.593 4.657,16.875 5,16.875C5.343,16.875 5.625,16.593 5.625,16.25L5.625,13.75L6.875,13.75L6.875,18.125C6.875,18.811 7.439,19.375 8.125,19.375L13.125,19.375C13.811,19.375 14.375,18.811 14.375,18.125L14.375,8.125C14.372,6.304 13.045,4.734 11.25,4.428L11.25,3.34L16.695,4.973C16.758,4.994 16.823,5.004 16.889,5.004C17.232,5.004 17.514,4.722 17.514,4.379C17.514,4.099 17.325,3.851 17.055,3.777ZM6.875,8.125L6.875,12.5L5.625,12.5L5.625,8.125C5.628,5.619 7.513,3.481 10,3.166L10,4.428C8.205,4.734 6.878,6.304 6.875,8.125ZM13.125,18.125L8.125,18.125L8.125,13.75L13.125,13.75L13.125,18.125ZM13.125,8.125L13.125,12.5L8.125,12.5L8.125,8.125C8.125,6.754 9.254,5.625 10.625,5.625C11.996,5.625 13.125,6.754 13.125,8.125Z" style="fill:rgb(252,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,121.756,-441.485)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.073451,-4.01863)">
|
|
|
|
|
<circle cx="121.529" cy="685.642" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.924372,-0.0839278)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M13.75,13.125L13.75,18.125C13.75,18.468 13.468,18.75 13.125,18.75L8.125,18.75C7.782,18.75 7.5,18.468 7.5,18.125L7.5,13.125L13.75,13.125Z" style="fill:rgb(252,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M17.055,3.777L12.314,2.355L14.658,1.183C14.868,1.077 15.002,0.86 15.002,0.625C15.002,0.282 14.719,-0 14.377,-0C14.279,-0 14.183,0.022 14.095,0.066L10.469,1.879C7.101,1.966 4.377,4.76 4.375,8.129L4.375,16.25C4.375,16.593 4.657,16.875 5,16.875C5.343,16.875 5.625,16.593 5.625,16.25L5.625,13.75L6.875,13.75L6.875,18.125C6.875,18.811 7.439,19.375 8.125,19.375L13.125,19.375C13.811,19.375 14.375,18.811 14.375,18.125L14.375,8.125C14.372,6.304 13.045,4.734 11.25,4.428L11.25,3.34L16.695,4.973C16.758,4.994 16.823,5.004 16.889,5.004C17.232,5.004 17.514,4.722 17.514,4.379C17.514,4.099 17.325,3.851 17.055,3.777ZM6.875,8.125L6.875,12.5L5.625,12.5L5.625,8.125C5.628,5.619 7.513,3.481 10,3.166L10,4.428C8.205,4.734 6.878,6.304 6.875,8.125ZM13.125,18.125L8.125,18.125L8.125,13.75L13.125,13.75L13.125,18.125ZM13.125,8.125L13.125,12.5L8.125,12.5L8.125,8.125C8.125,6.754 9.254,5.625 10.625,5.625C11.996,5.625 13.125,6.754 13.125,8.125Z" style="fill:rgb(252,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,64.3828,-441.156)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.073451,-4.01863)">
|
|
|
|
|
<circle cx="121.529" cy="685.642" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.924372,-0.0839278)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M13.75,13.125L13.75,18.125C13.75,18.468 13.468,18.75 13.125,18.75L8.125,18.75C7.782,18.75 7.5,18.468 7.5,18.125L7.5,13.125L13.75,13.125Z" style="fill:rgb(252,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M17.055,3.777L12.314,2.355L14.658,1.183C14.868,1.077 15.002,0.86 15.002,0.625C15.002,0.282 14.719,-0 14.377,-0C14.279,-0 14.183,0.022 14.095,0.066L10.469,1.879C7.101,1.966 4.377,4.76 4.375,8.129L4.375,16.25C4.375,16.593 4.657,16.875 5,16.875C5.343,16.875 5.625,16.593 5.625,16.25L5.625,13.75L6.875,13.75L6.875,18.125C6.875,18.811 7.439,19.375 8.125,19.375L13.125,19.375C13.811,19.375 14.375,18.811 14.375,18.125L14.375,8.125C14.372,6.304 13.045,4.734 11.25,4.428L11.25,3.34L16.695,4.973C16.758,4.994 16.823,5.004 16.889,5.004C17.232,5.004 17.514,4.722 17.514,4.379C17.514,4.099 17.325,3.851 17.055,3.777ZM6.875,8.125L6.875,12.5L5.625,12.5L5.625,8.125C5.628,5.619 7.513,3.481 10,3.166L10,4.428C8.205,4.734 6.878,6.304 6.875,8.125ZM13.125,18.125L8.125,18.125L8.125,13.75L13.125,13.75L13.125,18.125ZM13.125,8.125L13.125,12.5L8.125,12.5L8.125,8.125C8.125,6.754 9.254,5.625 10.625,5.625C11.996,5.625 13.125,6.754 13.125,8.125Z" style="fill:rgb(252,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,17.7826,-482.116)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.073451,-4.01863)">
|
|
|
|
|
<circle cx="121.529" cy="685.642" r="13.939" style="fill:white;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,-0.924372,-0.0839278)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M13.75,13.125L13.75,18.125C13.75,18.468 13.468,18.75 13.125,18.75L8.125,18.75C7.782,18.75 7.5,18.468 7.5,18.125L7.5,13.125L13.75,13.125Z" style="fill:rgb(252,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M17.055,3.777L12.314,2.355L14.658,1.183C14.868,1.077 15.002,0.86 15.002,0.625C15.002,0.282 14.719,-0 14.377,-0C14.279,-0 14.183,0.022 14.095,0.066L10.469,1.879C7.101,1.966 4.377,4.76 4.375,8.129L4.375,16.25C4.375,16.593 4.657,16.875 5,16.875C5.343,16.875 5.625,16.593 5.625,16.25L5.625,13.75L6.875,13.75L6.875,18.125C6.875,18.811 7.439,19.375 8.125,19.375L13.125,19.375C13.811,19.375 14.375,18.811 14.375,18.125L14.375,8.125C14.372,6.304 13.045,4.734 11.25,4.428L11.25,3.34L16.695,4.973C16.758,4.994 16.823,5.004 16.889,5.004C17.232,5.004 17.514,4.722 17.514,4.379C17.514,4.099 17.325,3.851 17.055,3.777ZM6.875,8.125L6.875,12.5L5.625,12.5L5.625,8.125C5.628,5.619 7.513,3.481 10,3.166L10,4.428C8.205,4.734 6.878,6.304 6.875,8.125ZM13.125,18.125L8.125,18.125L8.125,13.75L13.125,13.75L13.125,18.125ZM13.125,8.125L13.125,12.5L8.125,12.5L8.125,8.125C8.125,6.754 9.254,5.625 10.625,5.625C11.996,5.625 13.125,6.754 13.125,8.125Z" style="fill:rgb(252,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,693.942,-54.9751)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.073451,-4.01863)">
|
|
|
|
|
<circle cx="121.529" cy="685.642" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.924372,-0.0839278)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M13.75,13.125L13.75,18.125C13.75,18.468 13.468,18.75 13.125,18.75L8.125,18.75C7.782,18.75 7.5,18.468 7.5,18.125L7.5,13.125L13.75,13.125Z" style="fill:rgb(252,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,111.435,672.02)">
|
|
|
|
|
<path d="M17.055,3.777L12.314,2.355L14.658,1.183C14.868,1.077 15.002,0.86 15.002,0.625C15.002,0.282 14.719,-0 14.377,-0C14.279,-0 14.183,0.022 14.095,0.066L10.469,1.879C7.101,1.966 4.377,4.76 4.375,8.129L4.375,16.25C4.375,16.593 4.657,16.875 5,16.875C5.343,16.875 5.625,16.593 5.625,16.25L5.625,13.75L6.875,13.75L6.875,18.125C6.875,18.811 7.439,19.375 8.125,19.375L13.125,19.375C13.811,19.375 14.375,18.811 14.375,18.125L14.375,8.125C14.372,6.304 13.045,4.734 11.25,4.428L11.25,3.34L16.695,4.973C16.758,4.994 16.823,5.004 16.889,5.004C17.232,5.004 17.514,4.722 17.514,4.379C17.514,4.099 17.325,3.851 17.055,3.777ZM6.875,8.125L6.875,12.5L5.625,12.5L5.625,8.125C5.628,5.619 7.513,3.481 10,3.166L10,4.428C8.205,4.734 6.878,6.304 6.875,8.125ZM13.125,18.125L8.125,18.125L8.125,13.75L13.125,13.75L13.125,18.125ZM13.125,8.125L13.125,12.5L8.125,12.5L8.125,8.125C8.125,6.754 9.254,5.625 10.625,5.625C11.996,5.625 13.125,6.754 13.125,8.125Z" style="fill:rgb(252,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
<g id="icones_serveis" transform="matrix(1,0,0,1,83.2784,66.1766)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g id="uuid-f9ecffcd-4884-44ce-8f66-e671c5da4dbb" transform="matrix(1,0,0,1,5.71357,-5.40223)">
|
2023-12-21 10:59:01 +00:00
|
|
|
<circle cx="152.724" cy="867.324" r="13.939" style="fill:white;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(0.85,0,0,0.85,22.9086,130.099)">
|
|
|
|
|
<g transform="matrix(0.769231,0,0,0.769231,140.416,855.016)">
|
|
|
|
|
<path d="M28,16C28,22.583 22.583,28 16,28C9.417,28 4,22.583 4,16C4,9.417 9.417,4 16,4C22.583,4 28,9.417 28,16Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(0.769231,0,0,0.769231,140.416,855.016)">
|
|
|
|
|
<path d="M18,22C18,22.549 17.549,23 17,23C15.903,23 15,22.097 15,21L15,16C14.451,16 14,15.549 14,15C14,14.451 14.451,14 15,14C16.097,14 17,14.903 17,16L17,21C17.549,21 18,21.451 18,22ZM29,16C29,23.132 23.132,29 16,29C8.868,29 3,23.132 3,16C3,8.868 8.868,3 16,3C23.129,3.008 28.992,8.871 29,16ZM27,16C27,9.966 22.034,5 16,5C9.966,5 5,9.966 5,16C5,22.034 9.966,27 16,27C22.032,26.993 26.993,22.032 27,16ZM15.5,12C16.323,12 17,11.323 17,10.5C17,9.677 16.323,9 15.5,9C14.677,9 14,9.677 14,10.5C14,11.323 14.677,12 15.5,12Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g id="uuid-dc8ecd85-8fb4-4f9b-9700-88b7aeb3a245" transform="matrix(1,0,0,1,4.8826,-5.52126)">
|
2023-12-21 10:59:01 +00:00
|
|
|
<circle cx="175.852" cy="900.825" r="13.939" style="fill:white;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(0.85,0,0,0.85,26.3778,135.092)">
|
|
|
|
|
<g transform="matrix(0.714283,0,0,0.714283,164.423,890.504)">
|
|
|
|
|
<path d="M28.991,12.133L27.258,25.133C27.191,25.627 26.765,26 26.266,26L5.734,26C5.235,26 4.809,25.627 4.743,25.133L3.009,12.133C3.003,12.089 3,12.044 3,12C3,11.451 3.451,11 4,11L28,11C28.549,11 29,11.451 29,12C29,12.044 28.997,12.089 28.991,12.133Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(0.714283,0,0,0.714283,164.424,890.504)">
|
|
|
|
|
<path d="M17,15L17,22C17,22.549 16.549,23 16,23C15.451,23 15,22.549 15,22L15,15C15,14.451 15.451,14 16,14C16.549,14 17,14.451 17,15ZM29.983,12.264L28.25,25.265C28.118,26.254 27.264,27.001 26.266,27L5.734,27C4.736,27.001 3.882,26.254 3.75,25.265L2.016,12.265C2.005,12.177 1.999,12.089 1.999,12C1.999,10.903 2.901,10 3.999,10C3.999,10 4,10 4,10L8.546,10L15.25,2.341C15.44,2.126 15.713,2.003 16,2.003C16.287,2.003 16.56,2.126 16.75,2.341L23.454,10L28,10C29.097,10.001 29.999,10.903 29.999,12C29.999,12.088 29.993,12.176 29.981,12.264L29.983,12.264ZM11.204,10L20.796,10L16,4.519L11.204,10ZM28,12L4,12L5.734,25L26.266,25L28,12ZM21.605,14.9L20.905,21.9C20.901,21.935 20.899,21.97 20.899,22.005C20.899,22.516 21.291,22.949 21.8,23C21.834,23.002 21.868,23.002 21.901,23C22.412,22.999 22.844,22.608 22.895,22.1L23.595,15.1C23.598,15.067 23.6,15.033 23.6,15C23.6,14.451 23.149,14 22.6,14C22.089,14 21.656,14.392 21.605,14.9ZM10.395,14.9C10.344,14.392 9.911,14 9.4,14C8.851,14 8.4,14.451 8.4,15C8.4,15.033 8.402,15.067 8.405,15.1L9.105,22.1C9.156,22.61 9.592,23.003 10.105,23C10.139,23.002 10.173,23.002 10.206,23C10.715,22.949 11.106,22.516 11.106,22.005C11.106,21.972 11.105,21.938 11.101,21.905L10.395,14.9Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,178.308,40.202)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,-13.8446,24.9864)">
|
|
|
|
|
<circle cx="226.954" cy="865.428" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1.14313,0,0,1.14313,-22.4913,-114.871)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,198.101,871.661)">
|
|
|
|
|
<path d="M14.5,8.999L14.5,9.001C14.5,10.647 13.146,12.001 11.5,12.001C10.493,12.001 9.55,11.493 8.996,10.653L10,14L6,14L7.004,10.653C6.45,11.493 5.508,11.999 4.501,11.999C2.855,11.999 1.501,10.645 1.501,8.999C1.501,7.354 2.855,5.999 4.501,5.999C4.845,5.999 5.187,6.059 5.511,6.174C5.178,5.68 5,5.097 5,4.5C5,2.854 6.354,1.5 8,1.5C9.646,1.5 11,2.854 11,4.5C11,5.097 10.822,5.68 10.489,6.174C10.814,6.058 11.156,5.999 11.5,5.999C13.146,5.999 14.5,7.353 14.5,8.999Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,198.101,871.661)">
|
|
|
|
|
<path d="M11.5,5.5L11.354,5.5C11.451,5.176 11.5,4.839 11.5,4.501C11.5,2.581 9.92,1.001 8,1.001C6.08,1.001 4.5,2.581 4.5,4.501C4.5,4.839 4.549,5.176 4.646,5.5L4.5,5.5C2.581,5.501 1.002,7.081 1.002,9C1.002,10.92 2.582,12.5 4.502,12.5C5.033,12.5 5.556,12.379 6.034,12.147L5.521,13.856C5.507,13.903 5.5,13.951 5.5,14C5.5,14.274 5.726,14.5 6,14.5L10,14.5C10.274,14.5 10.5,14.274 10.5,14C10.5,13.951 10.493,13.903 10.479,13.856L9.966,12.147C10.444,12.379 10.967,12.5 11.498,12.5C13.418,12.5 14.998,10.92 14.998,9C14.998,7.081 13.419,5.501 11.5,5.5ZM11.5,11.5C10.66,11.5 9.874,11.076 9.413,10.375C9.32,10.236 9.163,10.152 8.996,10.152C8.722,10.152 8.496,10.378 8.496,10.652C8.496,10.7 8.503,10.748 8.517,10.794L9.329,13.498L6.673,13.498L7.486,10.794C7.501,10.746 7.509,10.695 7.509,10.645C7.509,10.37 7.283,10.145 7.009,10.145C6.838,10.145 6.679,10.232 6.588,10.375C6.125,11.075 5.34,11.498 4.501,11.498C3.13,11.498 2.001,10.369 2.001,8.998C2.001,7.626 3.13,6.498 4.501,6.498C4.788,6.498 5.072,6.547 5.342,6.643C5.396,6.662 5.453,6.672 5.51,6.672C5.784,6.672 6.01,6.447 6.01,6.172C6.01,6.073 5.981,5.976 5.925,5.893C5.648,5.481 5.5,4.995 5.5,4.499C5.5,3.127 6.629,1.999 8,1.999C9.371,1.999 10.5,3.127 10.5,4.499C10.5,4.995 10.352,5.481 10.075,5.893C10.019,5.976 9.99,6.073 9.99,6.172C9.99,6.447 10.216,6.672 10.49,6.672C10.547,6.672 10.604,6.662 10.658,6.643C10.926,6.548 11.208,6.5 11.492,6.5C12.863,6.5 13.992,7.629 13.992,9C13.992,10.368 12.868,11.496 11.5,11.5Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,158.533,58.7125)">
|
|
|
|
|
<g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-27.2018,6.47599)">
|
|
|
|
|
<circle cx="226.954" cy="865.428" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1.23077,0,0,1.23077,-41.9219,-201.791)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,188.36,865.127)">
|
|
|
|
|
<path d="M9.5,4.5L9.5,13L2.5,13C2.226,13 2,12.774 2,12.5L2,5C2,4.726 2.226,4.5 2.5,4.5L9.5,4.5Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,188.36,865.127)">
|
|
|
|
|
<path d="M13.5,4L9.207,4L11.354,1.854C11.448,1.76 11.5,1.633 11.5,1.5C11.5,1.226 11.274,1 11,1C10.867,1 10.74,1.052 10.646,1.146L8,3.793L5.354,1.146C5.26,1.052 5.133,1 5,1C4.726,1 4.5,1.226 4.5,1.5C4.5,1.633 4.552,1.76 4.646,1.854L6.793,4L2.5,4C1.951,4 1.5,4.451 1.5,5L1.5,12.5C1.5,13.049 1.951,13.5 2.5,13.5L13.5,13.5C14.049,13.5 14.5,13.049 14.5,12.5L14.5,5C14.5,4.451 14.049,4 13.5,4ZM2.5,5L9,5L9,12.5L2.5,12.5L2.5,5ZM13.5,12.5L10,12.5L10,5L13.5,5L13.5,12.5ZM12.5,7.25C12.5,7.661 12.161,8 11.75,8C11.339,8 11,7.661 11,7.25C11,6.839 11.339,6.5 11.75,6.5C12.161,6.5 12.5,6.839 12.5,7.25ZM12.5,10.25C12.5,10.661 12.161,11 11.75,11C11.339,11 11,10.661 11,10.25C11,9.839 11.339,9.5 11.75,9.5C12.161,9.5 12.5,9.839 12.5,10.25Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g id="uuid-9520a557-04bb-47ee-8bb2-59d046264b9f" transform="matrix(1,0,0,1,121.245,98.9885)">
|
|
|
|
|
<circle cx="203.907" cy="831.628" r="13.939" style="fill:white;"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,0.0716483,0.0478721)">
|
|
|
|
|
<g transform="matrix(1.14286,0,0,1.14286,195.121,823.009)">
|
|
|
|
|
<path d="M13,5.5L13,8.5C13,10.646 11.744,12.605 9.794,13.5L5.206,13.5C3.256,12.605 2,10.646 2,8.5L2,5.5L13,5.5Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1.14286,0,0,1.14286,195.121,823.009)">
|
|
|
|
|
<path d="M5,3.5L5,1.5C5,1.226 5.226,1 5.5,1C5.774,1 6,1.226 6,1.5L6,3.5C6,3.774 5.774,4 5.5,4C5.226,4 5,3.774 5,3.5ZM7.5,4C7.774,4 8,3.774 8,3.5L8,1.5C8,1.226 7.774,1 7.5,1C7.226,1 7,1.226 7,1.5L7,3.5C7,3.774 7.226,4 7.5,4ZM9.5,4C9.774,4 10,3.774 10,3.5L10,1.5C10,1.226 9.774,1 9.5,1C9.226,1 9,1.226 9,1.5L9,3.5C9,3.774 9.226,4 9.5,4ZM15.5,7.5L15.5,8C15.5,9.313 14.466,10.413 13.156,10.494C12.815,11.459 12.234,12.321 11.468,13L13,13C13.274,13 13.5,13.226 13.5,13.5C13.5,13.774 13.274,14 13,14L2,14C1.726,14 1.5,13.774 1.5,13.5C1.5,13.226 1.726,13 2,13L3.534,13C2.244,11.861 1.503,10.221 1.5,8.5L1.5,5.5C1.5,5.226 1.726,5 2,5L13,5C14.371,5 15.5,6.129 15.5,7.5ZM12.5,6L2.5,6L2.5,8.5C2.504,10.412 3.601,12.163 5.32,13L9.68,13C11.399,12.163 12.496,10.412 12.5,8.5L12.5,6ZM14.5,7.5C14.5,6.866 14.098,6.298 13.5,6.086L13.5,8.5C13.5,8.814 13.475,9.127 13.425,9.438C14.06,9.25 14.5,8.662 14.5,8L14.5,7.5Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g id="uuid-8e009b57-e4dc-4bb1-907c-8ad009e16bf1" transform="matrix(1,0,0,1,58.4525,65.1885)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,6.61301,0)">
|
|
|
|
|
<circle cx="226.954" cy="865.428" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(0.8,0,0,0.8,38.2718,171.657)">
|
|
|
|
|
<g transform="matrix(0.869565,0,0,0.869565,230.641,852.873)">
|
|
|
|
|
<path d="M26,5L26,21L19,21C19,21 19,8 26,5Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(0.869565,0,0,0.869565,230.641,852.873)">
|
|
|
|
|
<path d="M9,11L9,5C9,4.451 9.451,4 10,4C10.549,4 11,4.451 11,5L11,11C11,11.549 10.549,12 10,12C9.451,12 9,11.549 9,11ZM27,5L27,28C27,28.549 26.549,29 26,29C25.451,29 25,28.549 25,28L25,22L19,22C18.451,22 18,21.549 18,21C18.046,18.605 18.349,16.221 18.902,13.89C20.125,8.829 22.443,5.436 25.606,4.081C25.731,4.028 25.865,4 26,4C26.548,4 27,4.452 27,5ZM25,6.738C20.979,9.809 20.191,17.29 20.038,20L25,20L25,6.738ZM14.986,4.836C14.914,4.349 14.49,3.984 13.997,3.984C13.449,3.984 12.997,4.435 12.997,4.984C12.997,5.045 13.003,5.105 13.014,5.165L14,11.079C14,13.273 12.194,15.079 10,15.079C7.806,15.079 6,13.273 6,11.079L6.985,5.165C6.996,5.105 7.002,5.045 7.002,4.984C7.002,4.435 6.55,3.984 6.002,3.984C5.508,3.984 5.085,4.349 5.013,4.836L4.013,10.836C4.004,10.89 4,10.945 4,11C4.004,13.914 6.127,16.426 9,16.915L9,28C9,28.549 9.451,29 10,29C10.549,29 11,28.549 11,28L11,16.915C13.873,16.426 15.996,13.914 16,11C16,10.945 15.995,10.89 15.986,10.836L14.986,4.836Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g id="uuid-b3055e8b-7aae-4345-9204-c0670bc97a63">
|
|
|
|
|
<circle cx="266.695" cy="775.082" r="13.939" style="fill:white;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,-0.464543,-0.207976)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,257.16,765.29)">
|
|
|
|
|
<path d="M17.5,13.125L17.5,16.25C15.625,16.25 15.625,17.5 13.75,17.5C11.875,17.5 11.875,16.25 10,16.25C8.125,16.25 8.125,17.5 6.25,17.5C4.375,17.5 4.375,16.25 2.5,16.25L2.5,13.125C4.375,13.125 4.375,14.375 6.25,14.375C8.125,14.375 8.125,13.125 10,13.125C11.875,13.125 11.875,14.375 13.75,14.375C15.625,14.375 15.625,13.125 17.5,13.125Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,257.16,765.29)">
|
|
|
|
|
<path d="M6.875,11.671C7.218,11.671 7.5,11.389 7.5,11.046L7.5,10L12.5,10L12.5,11.195C12.5,11.537 12.782,11.82 13.125,11.82C13.468,11.82 13.75,11.537 13.75,11.195L13.75,2.5C13.75,2.157 13.468,1.875 13.125,1.875C12.782,1.875 12.5,2.157 12.5,2.5L12.5,3.75L7.5,3.75L7.5,2.5C7.5,2.157 7.218,1.875 6.875,1.875C6.532,1.875 6.25,2.157 6.25,2.5L6.25,11.046C6.25,11.389 6.532,11.671 6.875,11.671ZM7.5,8.75L7.5,7.5L12.5,7.5L12.5,8.75L7.5,8.75ZM12.5,5L12.5,6.25L7.5,6.25L7.5,5L12.5,5ZM1.875,13.125C1.875,12.782 2.157,12.5 2.5,12.5C3.627,12.5 4.234,12.905 4.722,13.23C5.156,13.52 5.502,13.75 6.25,13.75C6.998,13.75 7.344,13.52 7.778,13.23C8.266,12.905 8.872,12.5 9.999,12.5C11.127,12.5 11.734,12.905 12.221,13.23C12.657,13.52 13.002,13.75 13.75,13.75C14.498,13.75 14.844,13.52 15.278,13.23C15.766,12.905 16.372,12.5 17.5,12.5C17.843,12.5 18.125,12.782 18.125,13.125C18.125,13.468 17.843,13.75 17.5,13.75C16.752,13.75 16.406,13.98 15.972,14.27C15.484,14.595 14.878,15 13.75,15C12.622,15 12.016,14.595 11.528,14.27C11.094,13.98 10.748,13.75 10,13.75C9.252,13.75 8.906,13.98 8.472,14.27C7.984,14.595 7.378,15 6.251,15C5.123,15 4.517,14.595 4.029,14.27C3.594,13.98 3.248,13.75 2.5,13.75C2.157,13.75 1.875,13.468 1.875,13.125ZM18.125,16.25C18.125,16.593 17.843,16.875 17.5,16.875C16.752,16.875 16.406,17.105 15.972,17.395C15.484,17.72 14.878,18.125 13.75,18.125C12.622,18.125 12.016,17.72 11.528,17.395C11.094,17.105 10.748,16.875 10,16.875C9.252,16.875 8.906,17.105 8.472,17.395C7.984,17.72 7.378,18.125 6.251,18.125C5.123,18.125 4.517,17.72 4.029,17.395C3.594,17.105 3.248,16.875 2.5,16.875C2.157,16.875 1.875,16.593 1.875,16.25C1.875,15.907 2.157,15.625 2.5,15.625C3.627,15.625 4.234,16.03 4.722,16.355C5.156,16.645 5.502,16.875 6.25,16.875C6.998,16.875 7.344,16.645 7.778,16.355C8.266,16.03 8.872,15.625 9.999,15.625C11.127,15.625 11.734,16.03 12.221,16.355C12.657,16.645 13.002,16.875 13.75,16.875C14.498,16.875 14.844,16.645 15.278,16.355C15.766,16.03 16.372,15.625 17.5,15.625C17.843,15.625 18.125,15.907 18.125,16.25Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g id="uuid-cf40bad1-972c-42da-a35a-d8d7d680506f">
|
|
|
|
|
<circle cx="409.612" cy="748.627" r="13.939" style="fill:white;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,0.162468,-0.773307)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,399.45,739.4)">
|
|
|
|
|
<path d="M16.25,3.125L16.25,6.875L15,8.125L15,16.875C15,17.218 14.718,17.5 14.375,17.5L11.875,17.5L11.875,11.875C11.875,10.846 11.029,10 10,10C8.971,10 8.125,10.846 8.125,11.875L8.125,17.5L5.625,17.5C5.282,17.5 5,17.218 5,16.875L5,8.125L3.75,6.875L3.75,3.125C3.75,2.782 4.032,2.5 4.375,2.5L5.625,2.5C5.968,2.5 6.25,2.782 6.25,3.125L6.25,4.375C6.25,4.718 6.532,5 6.875,5L8.125,5C8.468,5 8.75,4.718 8.75,4.375L8.75,3.125C8.75,2.782 9.032,2.5 9.375,2.5L10.625,2.5C10.968,2.5 11.25,2.782 11.25,3.125L11.25,4.375C11.25,4.718 11.532,5 11.875,5L13.125,5C13.468,5 13.75,4.718 13.75,4.375L13.75,3.125C13.75,2.782 14.032,2.5 14.375,2.5L15.625,2.5C15.968,2.5 16.25,2.782 16.25,3.125Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,399.45,739.4)">
|
|
|
|
|
<path d="M15.625,1.875L14.375,1.875C13.689,1.875 13.125,2.439 13.125,3.125L13.125,4.375L11.875,4.375L11.875,3.125C11.875,2.439 11.311,1.875 10.625,1.875L9.375,1.875C8.689,1.875 8.125,2.439 8.125,3.125L8.125,4.375L6.875,4.375L6.875,3.125C6.875,2.439 6.311,1.875 5.625,1.875L4.375,1.875C3.689,1.875 3.125,2.439 3.125,3.125L3.125,6.616C3.124,6.948 3.256,7.266 3.491,7.5L4.375,8.384L4.375,16.875C4.375,17.561 4.939,18.125 5.625,18.125L14.375,18.125C15.061,18.125 15.625,17.561 15.625,16.875L15.625,8.384L16.509,7.5C16.744,7.266 16.876,6.948 16.875,6.616L16.875,3.125C16.875,2.439 16.311,1.875 15.625,1.875ZM11.25,16.875L8.75,16.875L8.75,11.875C8.75,11.189 9.314,10.625 10,10.625C10.686,10.625 11.25,11.189 11.25,11.875L11.25,16.875ZM15.625,6.616L14.741,7.5C14.506,7.734 14.374,8.052 14.375,8.384L14.375,16.875L12.5,16.875L12.5,11.875C12.5,10.504 11.371,9.375 10,9.375C8.629,9.375 7.5,10.504 7.5,11.875L7.5,16.875L5.625,16.875L5.625,8.384C5.626,8.052 5.494,7.734 5.259,7.5L4.375,6.616L4.375,3.125L5.625,3.125L5.625,4.375C5.625,5.061 6.189,5.625 6.875,5.625L8.125,5.625C8.811,5.625 9.375,5.061 9.375,4.375L9.375,3.125L10.625,3.125L10.625,4.375C10.625,5.061 11.189,5.625 11.875,5.625L13.125,5.625C13.811,5.625 14.375,5.061 14.375,4.375L14.375,3.125L15.625,3.125L15.625,6.616Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g id="uuid-606bc616-7d45-4d3d-bd68-f57b4b57afa2">
|
|
|
|
|
<g id="uuid-a7f13a91-129d-4f7c-88ea-0c7296bfa5e8">
|
|
|
|
|
<circle cx="161.533" cy="965.207" r="13.939" style="fill:white;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,-2.72734,-1.8087)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,-118.103,-82.7689)">
|
|
|
|
|
<circle cx="161.533" cy="965.207" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.0502431,1.72025)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,33.4802,871.343)">
|
|
|
|
|
<path d="M16.25,11.25C16.25,14.679 13.429,17.5 10,17.5C6.571,17.5 3.75,14.679 3.75,11.25C3.751,10.831 3.785,10.413 3.852,10L16.148,10C16.215,10.413 16.249,10.831 16.25,11.25Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,33.4802,871.343)">
|
|
|
|
|
<path d="M13.594,3.73C12.629,2.616 11.543,1.612 10.355,0.738C10.141,0.588 9.853,0.588 9.638,0.738C8.453,1.613 7.369,2.616 6.406,3.73C4.259,6.197 3.125,8.797 3.125,11.25C3.125,15.022 6.228,18.125 10,18.125C13.772,18.125 16.875,15.022 16.875,11.25C16.875,8.797 15.741,6.197 13.594,3.73ZM10,2.031C11.106,2.898 14.442,5.761 15.378,9.375L4.622,9.375C5.558,5.763 8.894,2.9 10,2.031ZM10,16.875C6.916,16.872 4.378,14.334 4.375,11.25C4.375,11.042 4.384,10.833 4.403,10.625L15.597,10.625C15.616,10.833 15.625,11.042 15.625,11.25C15.622,14.334 13.084,16.872 10,16.875Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.286813,0.340201)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,151.82,955.492)">
|
|
|
|
|
<path d="M15.625,4.375L15.625,16.25C15.625,16.593 15.343,16.875 15,16.875L5,16.875C4.657,16.875 4.375,16.593 4.375,16.25L4.375,4.375L15.625,4.375Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,151.82,955.492)">
|
|
|
|
|
<path d="M16.875,3.75L13.75,3.75L13.75,3.125C13.75,2.096 12.904,1.25 11.875,1.25L8.125,1.25C7.096,1.25 6.25,2.096 6.25,3.125L6.25,3.75L3.125,3.75C2.782,3.75 2.5,4.032 2.5,4.375C2.5,4.718 2.782,5 3.125,5L3.75,5L3.75,16.25C3.75,16.936 4.314,17.5 5,17.5L15,17.5C15.686,17.5 16.25,16.936 16.25,16.25L16.25,5L16.875,5C17.218,5 17.5,4.718 17.5,4.375C17.5,4.032 17.218,3.75 16.875,3.75ZM7.5,3.125C7.5,2.782 7.782,2.5 8.125,2.5L11.875,2.5C12.218,2.5 12.5,2.782 12.5,3.125L12.5,3.75L7.5,3.75L7.5,3.125ZM15,16.25L5,16.25L5,5L15,5L15,16.25ZM8.75,8.125L8.75,13.125C8.75,13.468 8.468,13.75 8.125,13.75C7.782,13.75 7.5,13.468 7.5,13.125L7.5,8.125C7.5,7.782 7.782,7.5 8.125,7.5C8.468,7.5 8.75,7.782 8.75,8.125ZM12.5,8.125L12.5,13.125C12.5,13.468 12.218,13.75 11.875,13.75C11.532,13.75 11.25,13.468 11.25,13.125L11.25,8.125C11.25,7.782 11.532,7.5 11.875,7.5C12.218,7.5 12.5,7.782 12.5,8.125Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
<g id="uuid-b42ec64b-4383-4390-93af-61df6e4743d2">
|
|
|
|
|
<circle cx="188.701" cy="949.024" r="13.939" style="fill:white;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,-1.08436,0.0172463)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,179.785,939.006)">
|
|
|
|
|
<path d="M16.875,16.25L3.125,16.25C2.44,16.249 1.876,15.685 1.876,15C1.876,14.781 1.934,14.565 2.044,14.375L8.919,2.5C9.142,2.114 9.555,1.876 10.001,1.876C10.446,1.876 10.86,2.114 11.083,2.5L17.958,14.375C18.068,14.565 18.125,14.781 18.125,15C18.125,15.686 17.561,16.25 16.875,16.25Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,179.785,939.006)">
|
|
|
|
|
<path d="M7.5,16.25C7.5,16.593 7.218,16.875 6.875,16.875L3.125,16.875C2.097,16.874 1.251,16.028 1.251,15C1.251,14.671 1.338,14.348 1.502,14.063L4.181,9.434L3.084,9.727C3.031,9.741 2.976,9.748 2.922,9.748C2.578,9.748 2.295,9.465 2.295,9.121C2.295,8.838 2.487,8.589 2.76,8.516L5.32,7.83C5.373,7.816 5.428,7.809 5.482,7.809C5.764,7.809 6.013,8 6.086,8.273L6.773,10.833C6.787,10.886 6.795,10.942 6.795,10.997C6.795,11.28 6.602,11.53 6.328,11.602C6.275,11.615 6.22,11.622 6.166,11.623C5.884,11.622 5.635,11.432 5.563,11.159L5.266,10.054L2.587,14.688C2.532,14.783 2.503,14.89 2.503,15C2.503,15.342 2.783,15.623 3.125,15.625L6.875,15.625C7.218,15.625 7.5,15.907 7.5,16.25ZM18.495,14.063L16.687,10.938C16.572,10.757 16.373,10.648 16.159,10.648C15.816,10.648 15.534,10.93 15.534,11.273C15.534,11.374 15.559,11.473 15.605,11.563L17.413,14.688C17.468,14.783 17.497,14.89 17.497,15C17.497,15.342 17.217,15.623 16.875,15.625L11.509,15.625L12.316,14.817C12.434,14.7 12.5,14.541 12.5,14.375C12.5,14.032 12.218,13.75 11.875,13.75C11.709,13.75 11.55,13.816 11.433,13.933L9.558,15.808C9.44,15.925 9.375,16.084 9.375,16.25C9.375,16.416 9.44,16.575 9.558,16.692L11.433,18.567C11.55,18.684 11.709,18.75 11.875,18.75C12.218,18.75 12.5,18.468 12.5,18.125C12.5,17.959 12.434,17.8 12.316,17.683L11.509,16.875L16.875,16.875C17.903,16.874 18.749,16.028 18.749,15C18.749,14.671 18.662,14.348 18.498,14.063L18.495,14.063ZM10,2.5C10.223,2.498 10.431,2.618 10.541,2.813L13.22,7.441L12.12,7.146C12.073,7.135 12.025,7.13 11.977,7.13C11.634,7.13 11.352,7.412 11.352,7.755C11.352,8.03 11.533,8.274 11.797,8.353L14.358,9.04C14.411,9.054 14.465,9.061 14.52,9.061C14.801,9.061 15.05,8.87 15.123,8.598L15.809,6.036C15.826,5.979 15.835,5.919 15.835,5.859C15.835,5.516 15.553,5.234 15.21,5.234C14.922,5.234 14.67,5.433 14.602,5.713L14.305,6.82L11.623,2.188C11.288,1.609 10.668,1.252 10,1.252C9.332,1.252 8.712,1.609 8.377,2.188L6.568,5.313C6.518,5.404 6.492,5.507 6.492,5.611C6.492,5.954 6.774,6.236 7.117,6.236C7.334,6.236 7.536,6.123 7.65,5.938L9.459,2.813C9.569,2.618 9.777,2.498 10,2.5Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
<g id="esports">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,73.3526,-57.409)">
|
2023-12-21 10:59:01 +00:00
|
|
|
<g transform="matrix(1,0,0,1,852.347,-1.02456)">
|
|
|
|
|
<circle cx="161.533" cy="965.207" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,-0.239073,1.02802)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,1003.5,952.845)">
|
|
|
|
|
<path d="M11.875,4.375C11.875,5.404 11.029,6.25 10,6.25C8.971,6.25 8.125,5.404 8.125,4.375C8.125,3.346 8.971,2.5 10,2.5C11.029,2.5 11.875,3.346 11.875,4.375Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,1003.5,952.845)">
|
|
|
|
|
<path d="M10,6.875C11.371,6.875 12.5,5.746 12.5,4.375C12.5,3.004 11.371,1.875 10,1.875C8.629,1.875 7.5,3.004 7.5,4.375C7.5,5.746 8.629,6.875 10,6.875ZM10,3.125C10.686,3.125 11.25,3.689 11.25,4.375C11.25,5.061 10.686,5.625 10,5.625C9.314,5.625 8.75,5.061 8.75,4.375C8.75,3.689 9.314,3.125 10,3.125ZM3.75,7.5C3.75,6.814 4.314,6.25 5,6.25C5.686,6.25 6.25,6.814 6.25,7.5C6.25,8.186 5.686,8.75 5,8.75C4.314,8.75 3.75,8.186 3.75,7.5ZM17.363,8.641C17.149,8.909 16.752,8.954 16.484,8.74C16.395,8.67 14.632,7.357 11.85,8.788C11.828,9.582 11.75,10.375 11.616,11.159L14.149,13.268C14.347,13.432 14.423,13.702 14.342,13.946L13.092,17.696C13.007,17.951 12.768,18.123 12.499,18.123C12.156,18.123 11.874,17.841 11.874,17.498C11.874,17.431 11.885,17.365 11.906,17.301L13.021,13.955L11.296,12.518C11.183,12.898 11.05,13.272 10.898,13.638C9.823,16.195 7.899,17.905 5.179,18.722C5.125,18.737 5.069,18.744 5.013,18.744C4.67,18.744 4.388,18.462 4.388,18.119C4.388,17.849 4.563,17.609 4.82,17.525C9.56,16.102 10.377,11.883 10.555,9.584C8.438,10.928 6.763,11.25 5.653,11.25C5.13,11.252 4.611,11.165 4.116,10.995C3.889,10.895 3.742,10.67 3.742,10.422C3.742,10.079 4.024,9.797 4.367,9.797C4.369,9.797 4.372,9.797 4.375,9.797C4.464,9.797 4.553,9.816 4.634,9.854C4.715,9.892 6.724,10.688 10.273,8.276C14.359,5.499 17.148,7.669 17.266,7.763C17.414,7.881 17.5,8.061 17.5,8.25C17.5,8.392 17.452,8.53 17.363,8.641Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,65.5238,-66.6199)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,904.202,8.18632)">
|
2023-12-21 10:59:01 +00:00
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<circle cx="161.533" cy="965.207" r="13.939" style="fill:white;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-35.0188,10.8134)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,1090.75,952.58)">
|
|
|
|
|
<path d="M5.091,8.444L2.513,10.423C2.505,10.283 2.502,10.142 2.502,10C2.499,8.289 3.084,6.627 4.159,5.295L5.091,8.444ZM3.666,14.017C4.685,15.623 6.278,16.783 8.119,17.261L6.97,14.017L3.666,14.017ZM11.885,17.261C13.726,16.783 15.319,15.623 16.338,14.017L13.034,14.017L11.885,17.261ZM15.841,5.295L14.909,8.444L17.487,10.423C17.495,10.283 17.498,10.142 17.498,10C17.501,8.289 16.916,6.627 15.841,5.295ZM12.832,3.053C11.017,2.316 8.983,2.316 7.168,3.053L10,5L12.832,3.053ZM11.931,12.5L13.125,9.023L10,6.875L6.875,9.023L8.069,12.5L11.931,12.5Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,1090.75,952.58)">
|
|
|
|
|
<path d="M10,1.875C5.543,1.875 1.875,5.543 1.875,10C1.875,14.457 5.543,18.125 10,18.125C14.457,18.125 18.125,14.457 18.125,10C18.12,5.545 14.455,1.88 10,1.875ZM15.978,13.392L13.352,13.392L12.628,12.395L13.615,9.522L14.787,9.14L16.837,10.713C16.74,11.656 16.447,12.568 15.978,13.392ZM3.166,10.713L5.212,9.141L6.384,9.523L7.37,12.396L6.648,13.392L4.022,13.392C3.552,12.568 3.259,11.656 3.162,10.713L3.166,10.713ZM3.947,6.756L4.377,8.209L3.18,9.123C3.287,8.294 3.544,7.492 3.94,6.756L3.947,6.756ZM8.516,11.875L7.62,9.27L10,7.634L12.38,9.27L11.484,11.875L8.516,11.875ZM15.63,8.209L16.061,6.756C16.457,7.492 16.714,8.294 16.82,9.123L15.63,8.209ZM15.146,5.445L14.403,7.952L13.226,8.334L10.625,6.546L10.625,5.329L12.898,3.766C13.754,4.167 14.519,4.738 15.145,5.445L15.146,5.445ZM11.412,3.271L10,4.241L8.588,3.271C9.519,3.076 10.481,3.076 11.412,3.271ZM7.102,3.766L9.375,5.329L9.375,6.546L6.775,8.334L5.598,7.952L4.855,5.445C5.481,4.738 6.246,4.167 7.102,3.766ZM4.934,14.642L6.525,14.642L7.085,16.226C6.272,15.843 5.541,15.305 4.934,14.642ZM8.594,16.729L7.666,14.118L8.387,13.125L11.613,13.125L12.334,14.118L11.41,16.729C10.48,16.924 9.52,16.924 8.59,16.729L8.594,16.729ZM12.919,16.226L13.479,14.642L15.07,14.642C14.462,15.305 13.73,15.843 12.915,16.226L12.919,16.226Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,59.5325,-56.4931)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,954.219,-1.94046)">
|
2023-12-21 10:59:01 +00:00
|
|
|
<circle cx="161.533" cy="965.207" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="Capa-18" transform="matrix(0.317441,0,0,0.317441,1103.13,953.267)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(0.707107,-0.707107,-0.707107,-0.707107,74.7393,30.3674)">
|
|
|
|
|
<path d="M-8.061,-3.339C-17.17,-3.339 -24.555,1.765 -24.555,8.061C-24.554,14.358 -17.17,19.463 -8.061,19.462C1.047,19.463 8.431,14.358 8.432,8.061C8.432,1.765 1.047,-3.339 -8.061,-3.339" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(-0.707107,-0.707107,-0.707107,0.707107,4.74262,30.7491)">
|
|
|
|
|
<path d="M-8.062,-19.462C-17.17,-19.462 -24.555,-14.358 -24.555,-8.062C-24.554,-1.765 -17.17,3.34 -8.062,3.339C1.047,3.34 8.431,-1.765 8.432,-8.062C8.432,-14.358 1.047,-19.462 -8.062,-19.462" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(-1,0,0,1,39.7407,11.5389)">
|
|
|
|
|
<path d="M0,-9.539C-2.634,-9.539 -4.769,-7.404 -4.769,-4.77C-4.769,-2.135 -2.634,0 0,0C2.634,0 4.769,-2.135 4.769,-4.77C4.769,-7.404 2.634,-9.539 0,-9.539" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,68.389,40.368)">
|
|
|
|
|
<path d="M0,-22.161C-3.689,-22.161 -8.141,-20.206 -11.698,-16.648C-14.529,-13.818 -16.422,-10.426 -17.03,-7.096C-17.588,-4.036 -16.974,-1.428 -15.299,0.247C-11.695,3.852 -3.958,2.201 1.597,-3.353C4.428,-6.183 6.321,-9.576 6.929,-12.906C7.487,-15.966 6.873,-18.574 5.198,-20.249C3.902,-21.545 2.071,-22.161 0,-22.161M-10.097,6.142C-13.218,6.142 -16.057,5.146 -18.127,3.075C-20.759,0.443 -21.767,-3.424 -20.965,-7.814C-20.213,-11.935 -17.926,-16.077 -14.526,-19.476C-7.317,-26.686 2.8,-28.303 8.026,-23.077C10.658,-20.445 11.666,-16.578 10.864,-12.187C10.112,-8.066 7.825,-3.925 4.425,-0.525C4.425,-0.525 4.426,-0.525 4.425,-0.525C0.072,3.828 -5.341,6.142 -10.097,6.142" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,33.0838,40.0249)">
|
|
|
|
|
<path d="M0,22.979C-0.512,22.979 -1.023,22.784 -1.414,22.393C-2.195,21.612 -2.195,20.346 -1.414,19.565L17.37,0.782C18.15,0 19.417,0 20.198,0.782C20.979,1.563 20.979,2.829 20.198,3.61L1.414,22.393C1.024,22.784 0.512,22.979 0,22.979" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,11.0921,40.7909)">
|
|
|
|
|
<path d="M0,-22.202C-2.071,-22.202 -3.901,-21.586 -5.197,-20.29C-8.8,-16.686 -7.151,-8.949 -1.597,-3.393C1.234,-0.563 4.626,1.33 7.956,1.938C11.015,2.497 13.624,1.882 15.299,0.206C18.902,-3.396 17.252,-11.134 11.699,-16.689C8.141,-20.246 3.688,-22.202 0,-22.202M10.102,6.142C9.179,6.142 8.222,6.053 7.238,5.873C3.117,5.121 -1.025,2.834 -4.425,-0.565C-11.635,-7.776 -13.25,-17.893 -8.025,-23.118C-2.802,-28.344 7.316,-26.728 14.527,-19.517C21.737,-12.306 23.352,-2.19 18.127,3.034C16.085,5.076 13.299,6.142 10.102,6.142" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,46.7796,40.0249)">
|
|
|
|
|
<path d="M0,22.979C-0.512,22.979 -1.024,22.784 -1.414,22.393L-20.197,3.61C-20.979,2.829 -20.979,1.563 -20.197,0.782C-19.417,0 -18.149,0 -17.369,0.782L1.414,19.565C2.195,20.346 2.195,21.612 1.414,22.393C1.024,22.784 0.512,22.979 0,22.979" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,39.7405,9.539)">
|
|
|
|
|
<path d="M0,-5.539C-1.527,-5.539 -2.77,-4.297 -2.77,-2.769C-2.77,-1.242 -1.527,0 0,0C1.527,0 2.77,-1.242 2.77,-2.769C2.77,-4.297 1.527,-5.539 0,-5.539M0,4C-3.733,4 -6.77,0.963 -6.77,-2.769C-6.77,-6.502 -3.733,-9.539 0,-9.539C3.733,-9.539 6.77,-6.502 6.77,-2.769C6.77,0.963 3.733,4 0,4" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,76.6713,-66.1513)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,981.106,7.71776)">
|
2023-12-21 10:59:01 +00:00
|
|
|
<g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<circle cx="161.533" cy="965.207" r="13.939" style="fill:white;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="Capa-19" transform="matrix(0.296955,0,0,0.296955,1133.64,963.829)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,58.6134,0.1039)">
|
|
|
|
|
<path d="M0,61.151C-1.027,61.151 -1.9,60.365 -1.99,59.323L-6.409,8.107C-6.617,5.707 -8.59,3.896 -11,3.896L-45.611,3.896C-48.021,3.896 -49.994,5.707 -50.201,8.107L-54.621,59.323C-54.716,60.423 -55.682,61.255 -56.785,61.143C-57.886,61.048 -58.701,60.08 -58.606,58.979L-54.187,7.763C-53.8,3.278 -50.113,-0.104 -45.611,-0.104L-11,-0.104C-6.498,-0.104 -2.812,3.278 -2.425,7.763L1.994,58.979C2.09,60.08 1.274,61.048 0.174,61.143C0.115,61.149 0.058,61.151 0,61.151" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,18.4572,0.0005)">
|
|
|
|
|
<path d="M0,46.396C-1.104,46.396 -2,45.5 -2,44.396L-2,2C-2,0.895 -1.104,0 0,0C1.104,0 2,0.895 2,2L2,44.396C2,45.5 1.104,46.396 0,46.396" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,42.1584,0.0005)">
|
|
|
|
|
<path d="M0,46.396C-1.104,46.396 -2,45.5 -2,44.396L-2,2C-2,0.895 -1.104,0 0,0C1.104,0 2,0.895 2,2L2,44.396C2,45.5 1.104,46.396 0,46.396" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,46.1554,43.8896)">
|
|
|
|
|
<path d="M0,4L-31.695,4C-32.799,4 -33.695,3.104 -33.695,2C-33.695,0.896 -32.799,0 -31.695,0L0,0C1.104,0 2,0.896 2,2C2,3.104 1.104,4 0,4" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="Capa-110" transform="matrix(1,0,0,1,310.716,890.505)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,292.649,-78.4733)">
|
2023-12-21 10:59:01 +00:00
|
|
|
<g transform="matrix(1,0,0,1,-184.141,-723.485)">
|
|
|
|
|
<circle cx="344.249" cy="713.276" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="Capa-111" transform="matrix(0.216078,0,0,0.216078,150.108,-17.1149)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,0,-4.3006)">
|
|
|
|
|
<path d="M75.637,36.921L41.349,36.921L41.349,20.085L75.637,20.085L75.637,36.921ZM82.272,12.3L10.286,12.3L10.286,55.921L16.921,55.921L16.921,20.084L35.522,20.084L35.522,55.921L82.272,55.921L82.272,12.3Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,37.5225,20.5824)">
|
|
|
|
|
<path d="M0,28.756L0,-4.799C0,-5.903 -0.896,-6.799 -2,-6.799L-20.602,-6.799C-21.706,-6.799 -22.602,-5.903 -22.602,-4.799L-22.602,28.756L-25.236,28.756L-25.236,-10.582L42.75,-10.582L42.75,28.756L0,28.756ZM-18.602,-2.799L-4,-2.799L-4,28.756L-18.602,28.756L-18.602,-2.799ZM53.036,28.756L46.75,28.756L46.75,-12.582C46.75,-13.687 45.854,-14.582 44.75,-14.582L-27.236,-14.582C-28.341,-14.582 -29.236,-13.687 -29.236,-12.582L-29.236,28.756L-35.522,28.756C-36.627,28.756 -37.522,29.652 -37.522,30.756C-37.522,31.67 -36.905,32.433 -36.067,32.671L-36.067,41.338C-36.067,42.443 -35.172,43.338 -34.067,43.338C-32.963,43.338 -32.067,42.443 -32.067,41.338L-32.067,32.756L49.581,32.756L49.581,41.338C49.581,42.443 50.477,43.338 51.581,43.338C52.686,43.338 53.581,42.443 53.581,41.338L53.581,32.671C54.419,32.433 55.036,31.67 55.036,30.756C55.036,29.652 54.141,28.756 53.036,28.756" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,0,-15.5166)">
|
|
|
|
|
<path d="M73.638,46.137L43.349,46.137L43.349,33.301L73.638,33.301L73.638,46.137ZM75.638,29.3L41.349,29.3C40.244,29.3 39.349,30.196 39.349,31.3L39.349,48.137C39.349,49.241 40.244,50.137 41.349,50.137L75.638,50.137C76.742,50.137 77.638,49.241 77.638,48.137L77.638,31.3C77.638,30.196 76.742,29.3 75.638,29.3" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,2,0)">
|
|
|
|
|
<path d="M0,4L88.559,4C89.663,4 90.559,3.104 90.559,2C90.559,0.896 89.663,0 88.559,0L0,0C-1.104,0 -2,0.896 -2,2C-2,3.104 -1.104,4 0,4" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,611.49,-196.839)">
|
2023-12-21 10:59:01 +00:00
|
|
|
<g transform="matrix(1,0,0,1,-220.571,-724.111)">
|
|
|
|
|
<circle cx="344.249" cy="713.276" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="Capa-112" transform="matrix(0.216081,0,0,0.216081,113.678,-17.7812)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,0,1.456)">
|
|
|
|
|
<path d="M53.635,27.973L68.917,27.973L68.917,34.865L53.635,34.865L53.635,27.973ZM51.635,38.864L70.917,38.864C72.022,38.864 72.917,37.969 72.917,36.864L72.917,25.973C72.917,24.868 72.022,23.973 70.917,23.973L51.635,23.973C50.531,23.973 49.635,24.868 49.635,25.973L49.635,36.864C49.635,37.969 50.531,38.864 51.635,38.864" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,40.9058,14.544)">
|
|
|
|
|
<path d="M0,35.167L-23.093,35.167C-21.94,14.85 -6.007,5.523 0,2.721L0,35.167ZM-31.155,14.906L4,-10.09L39.155,14.906L39.155,35.167L4,35.167L4,1.976C4,0.78 3.402,-0.323 2.402,-0.975C1.402,-1.626 0.152,-1.728 -0.942,-1.244C-6.878,1.379 -25.889,11.621 -27.093,35.167L-31.155,35.167L-31.155,14.906ZM51.652,37.167C51.652,36.063 50.757,35.167 49.652,35.167L43.155,35.167L43.155,13.875C43.155,13.227 42.842,12.62 42.314,12.245L5.197,-14.147C5.019,-14.28 4.821,-14.381 4.613,-14.448C4.48,-14.49 4.344,-14.519 4.207,-14.533C3.74,-14.582 3.257,-14.468 2.845,-14.177C2.845,-14.176 2.844,-14.176 2.844,-14.176C2.843,-14.177 2.842,-14.174 2.841,-14.174L-34.314,12.245C-34.841,12.62 -35.155,13.227 -35.155,13.875L-35.155,35.167L-38.906,35.167C-40.01,35.167 -40.906,36.063 -40.906,37.167C-40.906,38.081 -40.289,38.844 -39.451,39.082L-39.451,47.749C-39.451,48.854 -38.555,49.749 -37.451,49.749C-36.346,49.749 -35.451,48.854 -35.451,47.749L-35.451,39.167L46.197,39.167L46.197,47.749C46.197,48.854 47.093,49.749 48.197,49.749C49.302,49.749 50.197,48.854 50.197,47.749L50.197,39.082C51.035,38.844 51.652,38.081 51.652,37.167" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,41.2485,62.293)">
|
|
|
|
|
<path d="M0,-4L-23.003,-4C-24.108,-4 -25.003,-3.104 -25.003,-2C-25.003,-0.896 -24.108,0 -23.003,0L0,0C1.104,0 2,-0.896 2,-2C2,-3.104 1.104,-4 0,-4" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,0,-10.328)">
|
|
|
|
|
<path d="M71.304,48.648L51.518,48.648L51.518,37.925L71.304,37.925L71.304,48.648ZM44.906,14.682L9.751,39.678L9.751,59.939L13.813,59.939C15.017,36.395 34.028,26.151 39.964,23.527C41.058,23.044 42.307,23.145 43.307,23.796C44.308,24.448 44.906,25.551 44.906,26.748L44.906,59.939L80.061,59.939L80.061,39.678L44.906,14.682Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,74.4626,-682.155)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,-184.141,-723.485)">
|
|
|
|
|
<circle cx="344.249" cy="713.276" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="Capa-113" transform="matrix(0.216078,0,0,0.216078,150.108,-17.1149)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,0,-4.3006)">
|
|
|
|
|
<path d="M75.637,36.921L41.349,36.921L41.349,20.085L75.637,20.085L75.637,36.921ZM82.272,12.3L10.286,12.3L10.286,55.921L16.921,55.921L16.921,20.084L35.522,20.084L35.522,55.921L82.272,55.921L82.272,12.3Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,37.5225,20.5824)">
|
|
|
|
|
<path d="M0,28.756L0,-4.799C0,-5.903 -0.896,-6.799 -2,-6.799L-20.602,-6.799C-21.706,-6.799 -22.602,-5.903 -22.602,-4.799L-22.602,28.756L-25.236,28.756L-25.236,-10.582L42.75,-10.582L42.75,28.756L0,28.756ZM-18.602,-2.799L-4,-2.799L-4,28.756L-18.602,28.756L-18.602,-2.799ZM53.036,28.756L46.75,28.756L46.75,-12.582C46.75,-13.687 45.854,-14.582 44.75,-14.582L-27.236,-14.582C-28.341,-14.582 -29.236,-13.687 -29.236,-12.582L-29.236,28.756L-35.522,28.756C-36.627,28.756 -37.522,29.652 -37.522,30.756C-37.522,31.67 -36.905,32.433 -36.067,32.671L-36.067,41.338C-36.067,42.443 -35.172,43.338 -34.067,43.338C-32.963,43.338 -32.067,42.443 -32.067,41.338L-32.067,32.756L49.581,32.756L49.581,41.338C49.581,42.443 50.477,43.338 51.581,43.338C52.686,43.338 53.581,42.443 53.581,41.338L53.581,32.671C54.419,32.433 55.036,31.67 55.036,30.756C55.036,29.652 54.141,28.756 53.036,28.756" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,0,-15.5166)">
|
|
|
|
|
<path d="M73.638,46.137L43.349,46.137L43.349,33.301L73.638,33.301L73.638,46.137ZM75.638,29.3L41.349,29.3C40.244,29.3 39.349,30.196 39.349,31.3L39.349,48.137C39.349,49.241 40.244,50.137 41.349,50.137L75.638,50.137C76.742,50.137 77.638,49.241 77.638,48.137L77.638,31.3C77.638,30.196 76.742,29.3 75.638,29.3" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,2,0)">
|
|
|
|
|
<path d="M0,4L88.559,4C89.663,4 90.559,3.104 90.559,2C90.559,0.896 89.663,0 88.559,0L0,0C-1.104,0 -2,0.896 -2,2C-2,3.104 -1.104,4 0,4" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-473.699,-1193.53)">
|
|
|
|
|
<path d="M394.999,559.274C394.335,559.768 393.394,559.631 392.9,558.967C392.405,558.304 392.542,557.363 393.206,556.868C393.869,556.374 394.81,556.511 395.305,557.174C395.8,557.838 395.662,558.779 394.999,559.274Z" style="fill:rgb(82,84,83);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-473.216,-1193.67)">
|
|
|
|
|
<path d="M394.102,558.571C393.95,558.571 393.799,558.501 393.701,558.37C393.536,558.148 393.582,557.835 393.803,557.67L690.806,505.102C691.027,504.936 691.34,504.981 691.506,505.204C691.671,505.425 691.625,505.738 691.404,505.903L394.401,558.471C394.311,558.538 394.206,558.571 394.102,558.571Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-414.148,-1195.16)">
|
|
|
|
|
<path d="M394.999,559.274C394.335,559.768 393.394,559.631 392.9,558.967C392.405,558.304 392.542,557.363 393.206,556.868C393.869,556.374 394.81,556.511 395.305,557.174C395.8,557.838 395.662,558.779 394.999,559.274Z" style="fill:rgb(82,84,83);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-372.933,-1194.46)">
|
|
|
|
|
<path d="M394.999,559.274C394.335,559.768 393.394,559.631 392.9,558.967C392.405,558.304 392.542,557.363 393.206,556.868C393.869,556.374 394.81,556.511 395.305,557.174C395.8,557.838 395.662,558.779 394.999,559.274Z" style="fill:rgb(82,84,83);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-413.665,-1195.3)">
|
|
|
|
|
<path d="M394.102,558.571C393.95,558.571 393.799,558.501 393.701,558.37C393.536,558.148 393.582,557.835 393.803,557.67L631.232,506.719C631.452,506.553 631.766,506.598 631.931,506.821C632.097,507.042 632.051,507.355 631.829,507.52L394.401,558.471C394.311,558.538 394.206,558.571 394.102,558.571Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-372.45,-1194.6)">
|
|
|
|
|
<path d="M394.102,558.571C393.95,558.571 393.799,558.501 393.701,558.37C393.536,558.148 393.582,557.835 393.803,557.67L589.979,506.068C590.2,505.902 590.514,505.947 590.679,506.17C590.844,506.391 590.798,506.704 590.577,506.869L394.401,558.471C394.311,558.538 394.206,558.571 394.102,558.571Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-509.137,-679.404)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,-148.311,-722.85)">
|
|
|
|
|
<circle cx="344.249" cy="713.276" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="Capa-114" transform="matrix(0.216076,0,0,0.216076,185.938,-18.4439)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,0,-0.0006)">
|
|
|
|
|
<path d="M17.96,46.498L28.69,46.498L28.69,67.518L17.96,67.518L17.96,46.498ZM44.814,46.498L74.599,46.498L74.599,67.518L44.814,67.518L44.814,46.498ZM11.12,67.518L11.12,29.449L46.28,4.454L81.43,29.449L81.43,67.518L78.6,67.518L78.6,44.498C78.6,43.393 77.704,42.498 76.6,42.498L42.814,42.498C41.71,42.498 40.814,43.393 40.814,44.498L40.814,67.518L32.69,67.518L32.69,44.498C32.69,43.393 31.795,42.498 30.69,42.498L15.96,42.498C14.855,42.498 13.96,43.393 13.96,44.498L13.96,67.518L11.12,67.518ZM92.56,69.518C92.56,68.414 91.664,67.518 90.56,67.518L85.43,67.518L85.43,28.418C85.43,27.773 85.118,27.167 84.593,26.791L47.44,0.369C47.429,0.361 47.414,0.358 47.402,0.35C47.249,0.246 47.086,0.164 46.913,0.106C46.883,0.096 46.852,0.09 46.822,0.082C46.658,0.036 46.49,0.008 46.32,0.005C46.301,0.004 46.284,0 46.266,0.001C46.086,0.002 45.908,0.032 45.732,0.083C45.695,0.093 45.659,0.106 45.623,0.119C45.449,0.18 45.279,0.257 45.121,0.369L7.957,26.791C7.432,27.167 7.12,27.773 7.12,28.418L7.12,67.518L2,67.518C0.896,67.518 0,68.414 0,69.518C0,70.432 0.617,71.195 1.454,71.433L1.454,80.1C1.454,81.204 2.35,82.1 3.454,82.1C4.559,82.1 5.454,81.204 5.454,80.1L5.454,71.518L87.103,71.518L87.103,80.1C87.103,81.204 87.998,82.1 89.103,82.1C90.207,82.1 91.103,81.204 91.103,80.1L91.103,71.434C91.941,71.197 92.56,70.433 92.56,69.518" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,0,-34.2946)">
|
|
|
|
|
<path d="M37.264,53.732L55.297,53.732L55.297,62.662L37.264,62.662L37.264,53.732ZM35.264,66.662L57.297,66.662C58.401,66.662 59.297,65.767 59.297,64.662L59.297,51.732C59.297,50.628 58.401,49.732 57.297,49.732L35.264,49.732C34.159,49.732 33.264,50.628 33.264,51.732L33.264,64.662C33.264,65.767 34.159,66.662 35.264,66.662" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,0,-10.5846)">
|
|
|
|
|
<path d="M57.296,40.952L35.263,40.952L35.263,28.022L57.296,28.022L57.296,40.952ZM83.08,38.752L76.53,34.092L69.99,29.442L63.43,24.782L56.9,20.132L50.34,15.472L46.28,12.582L42.22,15.472L35.66,20.132L29.12,24.782L22.57,29.442L16.03,34.092L9.47,38.752L9.12,39.002L9.12,80.102L15.96,80.102L15.96,55.082L30.69,55.082L30.69,80.102L42.814,80.102L42.814,55.082L76.6,55.082L76.6,80.102L83.43,80.102L83.43,39.002L83.08,38.752Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,81.7947,-573.211)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,-220.571,-724.111)">
|
|
|
|
|
<circle cx="344.249" cy="713.276" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="Capa-115" transform="matrix(0.216081,0,0,0.216081,113.678,-17.7812)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,0,1.456)">
|
|
|
|
|
<path d="M53.635,27.973L68.917,27.973L68.917,34.865L53.635,34.865L53.635,27.973ZM51.635,38.864L70.917,38.864C72.022,38.864 72.917,37.969 72.917,36.864L72.917,25.973C72.917,24.868 72.022,23.973 70.917,23.973L51.635,23.973C50.531,23.973 49.635,24.868 49.635,25.973L49.635,36.864C49.635,37.969 50.531,38.864 51.635,38.864" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,40.9058,14.544)">
|
|
|
|
|
<path d="M0,35.167L-23.093,35.167C-21.94,14.85 -6.007,5.523 0,2.721L0,35.167ZM-31.155,14.906L4,-10.09L39.155,14.906L39.155,35.167L4,35.167L4,1.976C4,0.78 3.402,-0.323 2.402,-0.975C1.402,-1.626 0.152,-1.728 -0.942,-1.244C-6.878,1.379 -25.889,11.621 -27.093,35.167L-31.155,35.167L-31.155,14.906ZM51.652,37.167C51.652,36.063 50.757,35.167 49.652,35.167L43.155,35.167L43.155,13.875C43.155,13.227 42.842,12.62 42.314,12.245L5.197,-14.147C5.019,-14.28 4.821,-14.381 4.613,-14.448C4.48,-14.49 4.344,-14.519 4.207,-14.533C3.74,-14.582 3.257,-14.468 2.845,-14.177C2.845,-14.176 2.844,-14.176 2.844,-14.176C2.843,-14.177 2.842,-14.174 2.841,-14.174L-34.314,12.245C-34.841,12.62 -35.155,13.227 -35.155,13.875L-35.155,35.167L-38.906,35.167C-40.01,35.167 -40.906,36.063 -40.906,37.167C-40.906,38.081 -40.289,38.844 -39.451,39.082L-39.451,47.749C-39.451,48.854 -38.555,49.749 -37.451,49.749C-36.346,49.749 -35.451,48.854 -35.451,47.749L-35.451,39.167L46.197,39.167L46.197,47.749C46.197,48.854 47.093,49.749 48.197,49.749C49.302,49.749 50.197,48.854 50.197,47.749L50.197,39.082C51.035,38.844 51.652,38.081 51.652,37.167" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,41.2485,62.293)">
|
|
|
|
|
<path d="M0,-4L-23.003,-4C-24.108,-4 -25.003,-3.104 -25.003,-2C-25.003,-0.896 -24.108,0 -23.003,0L0,0C1.104,0 2,-0.896 2,-2C2,-3.104 1.104,-4 0,-4" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,0,-10.328)">
|
|
|
|
|
<path d="M71.304,48.648L51.518,48.648L51.518,37.925L71.304,37.925L71.304,48.648ZM44.906,14.682L9.751,39.678L9.751,59.939L13.813,59.939C15.017,36.395 34.028,26.151 39.964,23.527C41.058,23.044 42.307,23.145 43.307,23.796C44.308,24.448 44.906,25.551 44.906,26.748L44.906,59.939L80.061,59.939L80.061,39.678L44.906,14.682Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(0.595028,0,0,0.595028,122.636,79.7672)">
|
|
|
|
|
<g transform="matrix(0.586223,0.663123,-0.663123,0.586223,600.41,-893.961)">
|
|
|
|
|
<circle cx="689.538" cy="1046.65" r="40.312" style="fill:white;stroke:rgb(82,84,83);stroke-width:3.8px;stroke-miterlimit:1.5;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(0.586223,0.663123,-0.523363,0.46267,455.429,-764.047)">
|
|
|
|
|
<path d="M687.276,972.955L688.06,1047.02" style="fill:none;stroke:rgb(82,84,83);stroke-width:4.22px;stroke-miterlimit:1.5;"/>
|
|
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(2.28742,0,0,2.46141,357.228,147.927)">
|
|
|
|
|
<text x="0px" y="0px" style="font-family:'MabryPro-Bold', 'Mabry Pro', sans-serif;font-weight:700;font-size:12px;fill:rgb(82,84,83);">N</text>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,29.6752,-242.088)">
|
|
|
|
|
<g id="uuid-3b572a01-4dfd-46ea-8020-0c5b78c1a352">
|
|
|
|
|
<g>
|
|
|
|
|
<path d="M394.999,559.274C394.335,559.768 393.394,559.631 392.9,558.967C392.405,558.304 392.542,557.363 393.206,556.868C393.869,556.374 394.81,556.511 395.305,557.174C395.8,557.838 395.662,558.779 394.999,559.274Z" style="fill:rgb(82,84,83);"/>
|
|
|
|
|
<path d="M394.102,558.571C393.95,558.571 393.799,558.501 393.701,558.37C393.536,558.148 393.582,557.835 393.803,557.67L468.466,551.648C468.687,551.482 469.001,551.527 469.166,551.75C469.331,551.971 469.285,552.285 469.064,552.45L394.401,558.471C394.311,558.538 394.206,558.571 394.102,558.571Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g id="uuid-03f3a4be-be8b-483d-a61f-3ebfa5930046">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,-12.9735,-27.1574)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,-46.0237,27.309)">
|
2023-12-21 10:59:01 +00:00
|
|
|
<circle cx="545.217" cy="432.913" r="13.939" style="fill:white;"/>
|
2024-01-24 13:42:47 +00:00
|
|
|
<g id="Capa-116" transform="matrix(0.26833,0,0,0.26833,537.217,423.829)">
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,5.7033,63.0478)">
|
|
|
|
|
<path d="M0,-58.385L48.222,-58.385C48.796,-58.385 49.262,-57.918 49.262,-57.345L49.262,-49.772L-1.04,-49.772L-1.04,-57.345C-1.04,-57.918 -0.574,-58.385 0,-58.385M49.262,-0L-1.041,-0L-1.041,-45.11L49.262,-45.11L49.262,-0ZM48.222,-63.048L0,-63.048C-3.144,-63.048 -5.703,-60.489 -5.703,-57.345L-5.703,2.332C-5.703,3.618 -4.658,4.663 -3.372,4.663L51.594,4.663C52.88,4.663 53.925,3.618 53.925,2.332L53.925,-57.345C53.925,-60.489 51.366,-63.048 48.222,-63.048" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,10.3092,7.0601)">
|
|
|
|
|
<path d="M0,4.663L1.289,4.663C2.575,4.663 3.62,3.618 3.62,2.332C3.62,1.045 2.575,0 1.289,0L0,0C-1.286,0 -2.331,1.045 -2.331,2.332C-2.331,3.618 -1.286,4.663 0,4.663" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,17.481,7.0601)">
|
|
|
|
|
<path d="M0,4.663L1.291,4.663C2.577,4.663 3.622,3.618 3.622,2.332C3.622,1.045 2.577,0 1.291,0L0,0C-1.286,0 -2.331,1.045 -2.331,2.332C-2.331,3.618 -1.286,4.663 0,4.663" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,24.1315,41.0416)">
|
|
|
|
|
<path d="M0,-1.551C2.188,-1.551 3.545,-0.604 5.266,0.596C7.359,2.058 9.963,3.877 14.339,3.877C17.144,3.875 19.603,3.05 21.525,2.085C20.177,9.673 13.599,15.338 5.683,15.338C-1.862,15.338 -8.358,10.108 -10.016,2.807C-9.305,2.124 -5.248,-1.551 0,-1.551M5.683,-16.89C13.588,-16.89 20.3,-11.136 21.57,-3.397C20.6,-2.68 17.722,-0.788 14.33,-0.786C11.434,-0.786 9.813,-1.918 7.935,-3.229C5.926,-4.629 3.654,-6.214 0,-6.214C-4.301,-6.214 -7.869,-4.522 -10.289,-2.913C-9.239,-10.79 -2.477,-16.89 5.683,-16.89M5.683,20.001C17.14,20.001 26.458,10.682 26.458,-0.775C26.458,-12.231 17.14,-21.552 5.683,-21.552C-5.774,-21.552 -15.093,-12.231 -15.093,-0.775C-15.093,10.682 -5.774,20.001 5.683,20.001" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g opacity="0.2">
|
|
|
|
|
<g transform="matrix(1,0,0,1,36.3661,37.6388)">
|
|
|
|
|
<path d="M0,5.709L-12.308,-0.343L-22.976,4.17L-25.456,0.581L-22.976,-6.394L-16.472,-12.856L-8.513,-14.908L0.615,-14.265L10.052,-5.471L11.898,2.119L0,5.709ZM-32.911,26.963L19.723,26.963L19.723,-21.254L-32.911,-21.254L-32.911,26.963Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,-45.3818,28.4851)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,31.9408,-1.17601)">
|
|
|
|
|
<circle cx="545.217" cy="432.913" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-1.00386,-2.18)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,568.161,423.917)">
|
|
|
|
|
<path d="M19.305,6.154L17.8,9.03C17.684,9.244 17.458,9.377 17.214,9.375L15,9.375L15,3.125L19.045,5.332C19.342,5.486 19.459,5.857 19.305,6.154ZM0.695,6.154L2.2,9.03C2.316,9.244 2.542,9.377 2.786,9.375L5,9.375L5,3.125L0.955,5.332C0.658,5.486 0.541,5.857 0.695,6.154Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,568.161,423.917)">
|
|
|
|
|
<path d="M19.343,4.783L15.299,2.578C15.208,2.527 15.105,2.501 15,2.5L12.5,2.5C12.157,2.5 11.875,2.782 11.875,3.125C11.875,4.154 11.029,5 10,5C8.971,5 8.125,4.154 8.125,3.125C8.125,2.782 7.843,2.5 7.5,2.5L5,2.5C4.895,2.5 4.792,2.527 4.7,2.578L0.657,4.783C0.061,5.098 -0.171,5.847 0.142,6.444L1.648,9.32C1.87,9.74 2.311,10.003 2.787,10L4.375,10L4.375,16.25C4.375,16.936 4.939,17.5 5.625,17.5L14.375,17.5C15.061,17.5 15.625,16.936 15.625,16.25L15.625,10L17.214,10C17.69,10.003 18.13,9.74 18.353,9.32L19.859,6.444C20.172,5.847 19.939,5.098 19.343,4.783ZM2.787,8.75C2.775,8.751 2.764,8.747 2.755,8.74L1.257,5.88L4.375,4.178L4.375,8.75L2.787,8.75ZM14.375,16.25L5.625,16.25L5.625,3.75L6.938,3.75C7.234,5.199 8.52,6.249 9.999,6.249C11.478,6.249 12.765,5.199 13.061,3.75L14.375,3.75L14.375,16.25ZM17.246,8.739C17.237,8.747 17.226,8.751 17.214,8.75L15.625,8.75L15.625,4.178L18.744,5.88L17.246,8.739Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,-16.4727,-19.7016)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,-92.7178,53.743)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,64.4056,-0.734731)">
|
|
|
|
|
<circle cx="545.217" cy="432.913" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.525547,-0.203548)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,600.148,422.382)">
|
|
|
|
|
<path d="M14.063,8.438C14.063,10.666 12.229,12.5 10,12.5C11.029,12.5 11.875,11.654 11.875,10.625C11.875,8.75 10,7.5 10,7.5C10,7.5 8.125,8.75 8.125,10.625C8.125,11.654 8.971,12.5 10,12.5C7.771,12.5 5.938,10.666 5.938,8.438C5.938,5 10,2.5 10,2.5C10,2.5 14.063,5 14.063,8.438Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,600.148,422.382)">
|
|
|
|
|
<path d="M10,13.125C12.57,13.122 14.685,11.008 14.688,8.438C14.688,4.694 10.505,2.077 10.327,1.968C10.127,1.845 9.873,1.845 9.673,1.968C8.889,2.477 8.166,3.075 7.519,3.75C6.076,5.245 5.313,6.867 5.313,8.438C5.315,11.008 7.43,13.122 10,13.125ZM8.75,10.625C8.75,9.565 9.531,8.714 10,8.298C10.469,8.714 11.25,9.565 11.25,10.625C11.25,11.311 10.686,11.875 10,11.875C9.314,11.875 8.75,11.311 8.75,10.625ZM10,3.255C10.917,3.906 13.438,5.938 13.438,8.438C13.438,9.317 13.099,10.163 12.493,10.8C12.497,10.742 12.5,10.684 12.5,10.625C12.5,8.438 10.434,7.038 10.347,6.98C10.137,6.84 9.863,6.84 9.653,6.98C9.566,7.038 7.5,8.438 7.5,10.625C7.5,10.684 7.5,10.742 7.507,10.8C6.901,10.163 6.562,9.317 6.563,8.438C6.563,5.938 9.084,3.906 10,3.255ZM17.47,17.689C17.388,17.948 17.146,18.125 16.875,18.125C16.81,18.125 16.746,18.115 16.685,18.095L10,15.968L3.315,18.095C3.254,18.115 3.19,18.125 3.125,18.125C2.782,18.125 2.5,17.843 2.5,17.5C2.5,17.228 2.677,16.986 2.936,16.904L7.936,15.313L2.936,13.72C2.669,13.644 2.483,13.398 2.483,13.119C2.483,12.777 2.765,12.494 3.108,12.494C3.178,12.494 3.248,12.506 3.315,12.53L10,14.656L16.685,12.53C16.752,12.506 16.822,12.494 16.892,12.494C17.235,12.494 17.517,12.777 17.517,13.119C17.517,13.398 17.331,13.644 17.064,13.72L12.064,15.313L17.064,16.904C17.323,16.986 17.5,17.228 17.5,17.5C17.5,17.564 17.49,17.628 17.47,17.689Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-29.142,-44.4339)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,419.296,-434.852)">
|
|
|
|
|
<circle cx="161.533" cy="965.207" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1.33356,0,0,1.33356,523.744,-643.941)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,34.8056,872.825)">
|
|
|
|
|
<path d="M13,13.5L3,13.5C2.726,13.5 2.5,13.274 2.5,13C2.5,12.909 2.525,12.82 2.571,12.743L4.476,9.567C5.303,9.413 6.476,9.479 7.999,10.25C10.015,11.271 11.421,11.057 12.218,10.728L13.427,12.742C13.474,12.82 13.498,12.909 13.498,13C13.498,13.274 13.274,13.499 13,13.5Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,34.8056,872.825)">
|
|
|
|
|
<path d="M13.856,12.486L10,6.058L10,2.5L10.5,2.5C10.774,2.5 11,2.274 11,2C11,1.726 10.774,1.5 10.5,1.5L5.5,1.5C5.226,1.5 5,1.726 5,2C5,2.274 5.226,2.5 5.5,2.5L6,2.5L6,6.058L2.144,12.486C2.051,12.641 2.002,12.819 2.002,13C2.002,13.548 2.452,13.999 3,14L13,14C13.549,14 14,13.549 14,13C14,12.819 13.951,12.641 13.858,12.486L13.856,12.486ZM6.929,6.453C6.976,6.376 7,6.287 7,6.196L7,2.5L9,2.5L9,6.196C9,6.287 9.024,6.376 9.071,6.453L11.46,10.438C10.71,10.586 9.643,10.523 8.226,9.806C7.231,9.302 6.285,9.036 5.399,9.005L6.929,6.453ZM3,13L4.784,10.026C5.674,9.918 6.678,10.142 7.772,10.696C8.96,11.297 9.96,11.501 10.772,11.501C11.186,11.503 11.597,11.446 11.994,11.333L13,13L3,13Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,-12.3129,-31.2948)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,33.5524,-1.70847)">
|
|
|
|
|
<circle cx="479.46" cy="432.913" r="13.939" style="fill:white;"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,0.0477142,-0.65147)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,469.412,423.252)">
|
|
|
|
|
<path d="M13.119,17.412C13.123,17.441 13.125,17.47 13.125,17.5C13.125,17.843 12.843,18.125 12.5,18.125L7.5,18.125C7.157,18.125 6.875,17.843 6.875,17.5C6.875,17.47 6.877,17.441 6.881,17.412L7.22,15.04C8.99,15.82 11.009,15.82 12.778,15.04L13.119,17.412ZM14.375,2.5L5.625,2.5C5.282,2.5 5,2.782 5,3.125L5,8.75L15,8.75L15,3.125C15,2.782 14.718,2.5 14.375,2.5Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,469.412,423.252)">
|
|
|
|
|
<path d="M9.375,5C9.375,5.343 9.093,5.625 8.75,5.625L7.5,5.625C7.157,5.625 6.875,5.343 6.875,5C6.875,4.657 7.157,4.375 7.5,4.375L8.75,4.375C9.093,4.375 9.375,4.657 9.375,5ZM13.462,15.402L13.738,17.323C13.746,17.382 13.75,17.441 13.75,17.5C13.75,18.186 13.186,18.75 12.5,18.75L7.5,18.75C6.814,18.75 6.25,18.186 6.25,17.5C6.25,17.441 6.254,17.382 6.262,17.323L6.537,15.402C4.062,14.111 2.502,11.542 2.5,8.75C2.5,8.407 2.782,8.125 3.125,8.125L4.375,8.125L4.375,3.125C4.375,2.439 4.939,1.875 5.625,1.875L14.375,1.875C15.061,1.875 15.625,2.439 15.625,3.125L15.625,8.125L16.875,8.125C17.218,8.125 17.5,8.407 17.5,8.75C17.498,11.542 15.938,14.111 13.462,15.402ZM5.625,8.125L14.375,8.125L14.375,3.125L5.625,3.125L5.625,8.125ZM12.271,15.898C10.794,16.367 9.206,16.367 7.729,15.898L7.5,17.5L12.5,17.5L12.271,15.898ZM16.219,9.375L3.781,9.375C4.1,12.553 6.806,15.001 10,15.001C13.194,15.001 15.9,12.553 16.219,9.375Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,36.6427,-1.70847)">
|
|
|
|
|
<circle cx="512.338" cy="432.913" r="13.939" style="fill:white;"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-1.19769,-1.45678)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,503.223,423.432)">
|
|
|
|
|
<path d="M14.375,5.625L12.649,15.727C12.599,16.027 12.337,16.249 12.033,16.249C11.867,16.249 11.709,16.183 11.591,16.066L3.935,8.41C3.818,8.293 3.753,8.134 3.753,7.969C3.753,7.665 3.974,7.403 4.274,7.352L14.375,5.625Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,503.223,423.432)">
|
|
|
|
|
<path d="M5,18.438C5,18.952 4.577,19.375 4.063,19.375C3.548,19.375 3.125,18.952 3.125,18.438C3.125,17.923 3.548,17.5 4.063,17.5C4.577,17.5 5,17.923 5,18.438ZM6.563,15C6.048,15 5.625,15.423 5.625,15.938C5.625,16.452 6.048,16.875 6.563,16.875C7.077,16.875 7.5,16.452 7.5,15.938C7.5,15.423 7.077,15 6.563,15ZM1.563,15C1.048,15 0.625,15.423 0.625,15.938C0.625,16.452 1.048,16.875 1.563,16.875C2.077,16.875 2.5,16.452 2.5,15.938C2.5,15.423 2.077,15 1.563,15ZM4.063,12.5C3.548,12.5 3.125,12.923 3.125,13.438C3.125,13.952 3.548,14.375 4.063,14.375C4.577,14.375 5,13.952 5,13.438C5,12.923 4.577,12.5 4.063,12.5ZM20,3.125C20,3.468 19.718,3.75 19.375,3.75L17.134,3.75L14.958,5.927L13.266,15.832C13.165,16.431 12.641,16.875 12.033,16.875C11.702,16.875 11.384,16.743 11.149,16.509L3.493,8.852C3.259,8.618 3.127,8.3 3.127,7.968C3.127,7.36 3.571,6.835 4.172,6.735L14.073,5.042L16.25,2.866C16.484,2.631 16.802,2.499 17.134,2.5L19.375,2.5C19.718,2.5 20,2.782 20,3.125ZM13.61,6.39L4.375,7.969L12.031,15.625L13.61,6.39Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-32.667,-99.034)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,452.145,-434.968)">
|
|
|
|
|
<circle cx="161.533" cy="965.207" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,0.710989,0.268483)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,602.967,519.97)">
|
|
|
|
|
<path d="M17.5,10C17.5,14.114 14.114,17.5 10,17.5C5.886,17.5 2.5,14.114 2.5,10C2.5,5.886 5.886,2.5 10,2.5C14.114,2.5 17.5,5.886 17.5,10Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,602.967,519.97)">
|
|
|
|
|
<path d="M7.188,10.938C6.673,10.938 6.25,10.514 6.25,10C6.25,9.486 6.673,9.063 7.188,9.063C7.702,9.063 8.125,9.486 8.125,10C8.125,10.514 7.702,10.938 7.188,10.938ZM12.813,9.063C12.298,9.063 11.875,9.486 11.875,10C11.875,10.514 12.298,10.938 12.813,10.938C13.327,10.938 13.75,10.514 13.75,10C13.75,9.486 13.327,9.063 12.813,9.063ZM11.854,12.596C10.72,13.3 9.28,13.3 8.146,12.596C8.046,12.533 7.931,12.5 7.813,12.5C7.469,12.5 7.187,12.782 7.187,13.125C7.187,13.339 7.298,13.539 7.479,13.654C9.02,14.614 10.98,14.614 12.521,13.654C12.702,13.539 12.813,13.339 12.813,13.125C12.813,12.782 12.531,12.5 12.187,12.5C12.069,12.5 11.954,12.533 11.854,12.596ZM18.125,10C18.125,14.457 14.457,18.125 10,18.125C5.543,18.125 1.875,14.457 1.875,10C1.875,5.543 5.543,1.875 10,1.875C14.455,1.88 18.12,5.545 18.125,10ZM16.875,10C16.871,6.345 13.956,3.299 10.305,3.132C9.4,4.405 9.375,5.616 9.375,5.625C9.375,5.968 9.657,6.25 10,6.25C10.343,6.25 10.625,5.968 10.625,5.625C10.625,5.282 10.907,5 11.25,5C11.593,5 11.875,5.282 11.875,5.625C11.875,6.654 11.029,7.5 10,7.5C8.971,7.5 8.125,6.654 8.125,5.625C8.125,5.568 8.135,4.508 8.786,3.232C5.523,3.817 3.125,6.684 3.125,9.999C3.125,13.77 6.228,16.874 10,16.874C13.771,16.874 16.874,13.771 16.875,10Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-170.174,-100.534)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,488.601,-433.469)">
|
|
|
|
|
<circle cx="161.533" cy="965.207" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-10.0606,-6.75596)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,650.523,528.807)">
|
|
|
|
|
<path d="M15.625,3.75C15.625,4.779 14.779,5.625 13.75,5.625C12.721,5.625 11.875,4.779 11.875,3.75C11.875,2.721 12.721,1.875 13.75,1.875C14.779,1.875 15.625,2.721 15.625,3.75Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,650.523,528.807)">
|
|
|
|
|
<path d="M13.75,6.25C15.121,6.25 16.25,5.121 16.25,3.75C16.25,2.379 15.121,1.25 13.75,1.25C12.379,1.25 11.25,2.379 11.25,3.75C11.25,5.121 12.379,6.25 13.75,6.25ZM13.75,2.5C14.436,2.5 15,3.064 15,3.75C15,4.436 14.436,5 13.75,5C13.064,5 12.5,4.436 12.5,3.75C12.5,3.064 13.064,2.5 13.75,2.5ZM13.125,13.125C13.125,15.868 10.868,18.125 8.125,18.125C5.382,18.125 3.125,15.868 3.125,13.125C3.125,10.382 5.382,8.125 8.125,8.125C8.468,8.125 8.75,8.407 8.75,8.75C8.75,9.093 8.468,9.375 8.125,9.375C6.068,9.375 4.375,11.068 4.375,13.125C4.375,15.182 6.068,16.875 8.125,16.875C10.182,16.875 11.875,15.182 11.875,13.125C11.875,12.782 12.157,12.5 12.5,12.5C12.843,12.5 13.125,12.782 13.125,13.125ZM16.109,10.229C16.227,10.374 16.274,10.564 16.237,10.748L14.988,16.998C14.929,17.289 14.672,17.5 14.375,17.5C14.334,17.5 14.292,17.496 14.252,17.488C13.916,17.42 13.695,17.088 13.762,16.752L14.863,11.25L10,11.25C10,11.25 9.999,11.25 9.999,11.25C9.656,11.25 9.374,10.968 9.374,10.625C9.374,10.515 9.403,10.408 9.458,10.313L11.025,7.586C8.802,6.425 6.086,6.708 4.15,8.302C4.034,8.413 3.879,8.475 3.718,8.475C3.375,8.475 3.093,8.193 3.093,7.85C3.093,7.65 3.19,7.461 3.352,7.344C5.873,5.264 9.477,5.06 12.216,6.842C12.493,7.022 12.582,7.391 12.417,7.677L11.08,10L15.625,10C15.812,10 15.99,10.084 16.109,10.229Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
</g>
|
|
|
|
|
<path d="M315.467,547.01C314.803,547.504 313.863,547.367 313.368,546.704C312.873,546.04 313.01,545.099 313.674,544.604C314.337,544.11 315.278,544.247 315.773,544.911C316.268,545.574 316.131,546.515 315.467,547.01Z" style="fill:rgb(82,84,83);"/>
|
|
|
|
|
<path d="M314.57,546.307C314.417,546.307 314.267,546.238 314.169,546.106C314.004,545.884 314.05,545.572 314.271,545.407L459.408,437.207C459.629,437.041 459.942,437.088 460.107,437.309C460.272,437.531 460.227,437.844 460.005,438.009L314.869,546.207C314.779,546.275 314.674,546.307 314.57,546.307Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(0.197545,0.980294,-0.980294,0.197545,664.837,415.121)">
|
|
|
|
|
<path d="M315.467,547.01C314.803,547.504 313.863,547.367 313.368,546.704C312.873,546.04 313.01,545.099 313.674,544.604C314.337,544.11 315.278,544.247 315.773,544.911C316.268,545.574 316.131,546.515 315.467,547.01Z" style="fill:rgb(82,84,83);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(0.197545,0.980294,-0.980294,0.197545,664.837,415.121)">
|
|
|
|
|
<path d="M314.57,546.307C314.417,546.307 314.267,546.238 314.169,546.106C314.004,545.884 314.05,545.572 314.271,545.407L419.785,481.445C420.006,481.279 420.319,481.326 420.484,481.547C420.649,481.769 420.604,482.082 420.382,482.247L314.869,546.207C314.779,546.275 314.674,546.307 314.57,546.307Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g transform="matrix(-0.768233,-0.640171,0.640171,-0.768233,43.0079,891.563)">
|
|
|
|
|
<path d="M394.999,559.274C394.335,559.768 393.394,559.631 392.9,558.967C392.405,558.304 392.542,557.363 393.206,556.868C393.869,556.374 394.81,556.511 395.305,557.174C395.8,557.838 395.662,558.779 394.999,559.274Z" style="fill:rgb(82,84,83);"/>
|
|
|
|
|
<path d="M394.102,558.571C393.95,558.571 393.799,558.501 393.701,558.37C393.536,558.148 393.582,557.835 393.803,557.67L459.647,508.584C459.868,508.418 460.181,508.463 460.347,508.686C460.512,508.907 460.466,509.221 460.245,509.386L394.401,558.471C394.311,558.538 394.206,558.571 394.102,558.571Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g transform="matrix(-0.768233,-0.640171,0.640171,-0.768233,81.2915,916.38)">
|
|
|
|
|
<path d="M394.999,559.274C394.335,559.768 393.394,559.631 392.9,558.967C392.405,558.304 392.542,557.363 393.206,556.868C393.869,556.374 394.81,556.511 395.305,557.174C395.8,557.838 395.662,558.779 394.999,559.274Z" style="fill:rgb(82,84,83);"/>
|
|
|
|
|
<path d="M394.102,558.571C393.95,558.571 393.799,558.501 393.701,558.37C393.536,558.148 393.582,557.835 393.803,557.67L504.777,503.098C504.998,502.932 505.311,502.977 505.477,503.2C505.642,503.421 505.596,503.735 505.375,503.9L394.401,558.471C394.311,558.538 394.206,558.571 394.102,558.571Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g transform="matrix(0.818526,0.57447,-0.57447,0.818526,943.818,3.24841)">
|
|
|
|
|
<path d="M394.999,559.274C394.335,559.768 393.394,559.631 392.9,558.967C392.405,558.304 392.542,557.363 393.206,556.868C393.869,556.374 394.81,556.511 395.305,557.174C395.8,557.838 395.662,558.779 394.999,559.274Z" style="fill:rgb(82,84,83);"/>
|
|
|
|
|
<path d="M394.102,558.571C393.95,558.571 393.799,558.501 393.701,558.37C393.536,558.148 393.582,557.835 393.803,557.67L459.647,508.584C459.868,508.418 460.181,508.463 460.347,508.686C460.512,508.907 460.466,509.221 460.245,509.386L394.401,558.471C394.311,558.538 394.206,558.571 394.102,558.571Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g transform="matrix(-0.751315,0.659944,-0.659944,-0.751315,1443.9,859.899)">
|
|
|
|
|
<path d="M394.999,559.274C394.335,559.768 393.394,559.631 392.9,558.967C392.405,558.304 392.542,557.363 393.206,556.868C393.869,556.374 394.81,556.511 395.305,557.174C395.8,557.838 395.662,558.779 394.999,559.274Z" style="fill:rgb(82,84,83);"/>
|
|
|
|
|
<path d="M394.102,558.571C393.95,558.571 393.799,558.501 393.701,558.37C393.536,558.148 393.582,557.835 393.803,557.67L400.089,552.984L463.537,506.504C463.757,506.338 464.071,506.384 464.236,506.606C464.401,506.827 464.356,507.141 464.134,507.306L394.401,558.471C394.311,558.538 394.206,558.571 394.102,558.571Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g transform="matrix(0.27409,0.961704,-0.961704,0.27409,1115.25,195.271)">
|
|
|
|
|
<path d="M394.999,559.274C394.335,559.768 393.394,559.631 392.9,558.967C392.405,558.304 392.542,557.363 393.206,556.868C393.869,556.374 394.81,556.511 395.305,557.174C395.8,557.838 395.662,558.779 394.999,559.274Z" style="fill:rgb(82,84,83);"/>
|
|
|
|
|
<path d="M394.102,558.571C393.95,558.571 393.799,558.501 393.701,558.37C393.536,558.148 393.582,557.835 393.803,557.67L400.089,552.984L469.981,502.382C470.202,502.216 470.516,502.261 470.681,502.484C470.846,502.705 470.8,503.019 470.579,503.184L394.401,558.471C394.311,558.538 394.206,558.571 394.102,558.571Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g transform="matrix(-0.258056,0.96613,-0.96613,-0.258056,1374.26,476.357)">
|
|
|
|
|
<path d="M394.999,559.274C394.335,559.768 393.394,559.631 392.9,558.967C392.405,558.304 392.542,557.363 393.206,556.868C393.869,556.374 394.81,556.511 395.305,557.174C395.8,557.838 395.662,558.779 394.999,559.274Z" style="fill:rgb(82,84,83);"/>
|
|
|
|
|
<path d="M394.102,558.571C393.95,558.571 393.799,558.501 393.701,558.37C393.536,558.148 393.582,557.835 393.803,557.67L400.089,552.984L456.55,512.475C456.771,512.309 457.085,512.355 457.25,512.577C457.415,512.799 457.369,513.112 457.148,513.277L394.401,558.471C394.311,558.538 394.206,558.571 394.102,558.571Z" style="fill:rgb(82,84,83);fill-rule:nonzero;"/>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
|
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,5.20986,-0.738652)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,-2.02794,13.2978)">
|
|
|
|
|
<circle cx="152.724" cy="867.324" r="13.939" style="fill:white;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g id="prohibit" transform="matrix(0.636364,0,0,0.636364,50.804,322.226)">
|
|
|
|
|
<g transform="matrix(1,0,0,1,140.973,861.478)">
|
|
|
|
|
<path d="M26,14.5L26,19C26,24.486 21.486,29 16,29C10.514,29 6,24.486 6,19L6,9.5C6,8.129 7.129,7 8.5,7C9.871,7 11,8.129 11,9.5L11,5.5C11,4.129 12.129,3 13.5,3C14.871,3 16,4.129 16,5.5L16,7.5C16,6.129 17.129,5 18.5,5C19.871,5 21,6.129 21,7.5L21,14.5C21,13.129 22.129,12 23.5,12C24.871,12 26,13.129 26,14.5Z" style="fill:rgb(81,84,83);fill-opacity:0.2;fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,140.973,861.478)">
|
|
|
|
|
<path d="M23.5,11C22.981,10.999 22.468,11.115 22,11.339L22,7.5C22,5.58 20.42,4.001 18.5,4.001C17.917,4.001 17.343,4.147 16.83,4.425C16.364,2.985 15.014,2.003 13.5,2.003C11.581,2.003 10.001,3.581 10,5.5L10,6.339C9.532,6.115 9.019,5.999 8.5,6C6.58,6 5,7.58 5,9.5L5,19C5,25.034 9.966,30 16,30C22.034,30 27,25.034 27,19L27,14.5C27,12.58 25.42,11 23.5,11ZM25,19C25,23.937 20.937,28 16,28C11.063,28 7,23.937 7,19L7,9.5C7,8.677 7.677,8 8.5,8C9.323,8 10,8.677 10,9.5L10,15C10,15.549 10.451,16 11,16C11.549,16 12,15.549 12,15L12,5.5C12,4.677 12.677,4 13.5,4C14.323,4 15,4.677 15,5.5L15,14C15,14.549 15.451,15 16,15C16.549,15 17,14.549 17,14L17,7.5C17,6.677 17.677,6 18.5,6C19.323,6 20,6.677 20,7.5L20,16.084C17.127,16.573 15.004,19.086 15,22C15,22.549 15.451,23 16,23C16.549,23 17,22.549 17,22C17,19.806 18.806,18 21,18C21.549,18 22,17.549 22,17L22,14.5C22,13.677 22.677,13 23.5,13C24.323,13 25,13.677 25,14.5L25,19Z" style="fill:rgb(81,84,83);fill-rule:nonzero;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1.12978,0.0423296,-0.0413103,1.10258,11.1948,-100.931)">
|
|
|
|
|
<g transform="matrix(0.883886,-0.0339336,0.0331166,0.905693,-6.55248,91.792)">
|
|
|
|
|
<path d="M196.158,888.896L192.841,891.132" style="fill:none;stroke:rgb(82,84,83);stroke-width:1px;stroke-linejoin:miter;stroke-miterlimit:10;"/>
|
|
|
|
|
<path d="M214.488,916.092L211.171,918.327" style="fill:none;stroke:rgb(82,84,83);stroke-width:1px;stroke-linejoin:miter;stroke-miterlimit:10;"/>
|
|
|
|
|
<path d="M194.499,890.014C196.659,893.219 210.67,914.005 212.83,917.209" style="fill:none;stroke:rgb(82,84,83);stroke-width:1px;stroke-linejoin:miter;stroke-miterlimit:2;stroke-dasharray:2,4,0,0;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1.12978,0.0423296,-0.0413103,1.10258,13.154,-102.182)">
|
|
|
|
|
<g transform="matrix(0.883886,-0.0339336,0.0331166,0.905693,-8.24275,92.9919)">
|
|
|
|
|
<path d="M198.117,887.645L194.8,889.88" style="fill:none;stroke:rgb(82,84,83);stroke-width:1px;stroke-linejoin:miter;stroke-miterlimit:10;"/>
|
|
|
|
|
<path d="M216.447,914.84L213.13,917.076" style="fill:none;stroke:rgb(82,84,83);stroke-width:1px;stroke-linejoin:miter;stroke-miterlimit:10;"/>
|
|
|
|
|
<path d="M196.459,888.763C198.619,891.967 212.629,912.753 214.789,915.958" style="fill:none;stroke:rgb(82,84,83);stroke-width:1px;stroke-linejoin:miter;stroke-miterlimit:2;stroke-dasharray:2,4,0,0;"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
<g id="arbres" transform="matrix(1,0,0,1,83.2784,66.1766)">
|
|
|
|
|
<circle cx="358.497" cy="804.747" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="396.242" cy="784.802" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="322.379" cy="718.665" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="423.578" cy="774.49" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="458.103" cy="762.031" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="453.224" cy="735.44" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="428.154" cy="728.175" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="484.436" cy="766.909" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="511.394" cy="753.241" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="501.223" cy="722.908" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="548.83" cy="747.207" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="555.367" cy="716.889" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="583.185" cy="746.705" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="611.071" cy="741.59" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="610.858" cy="709.266" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="647.65" cy="739.882" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="673.677" cy="738.794" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="655.178" cy="700.898" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="704.335" cy="730.431" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="704.335" cy="693.047" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="730.491" cy="727.595" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="763.42" cy="716.438" r="11.111" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="741.92" cy="686.24" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,8.37325,-0.542829)">
|
|
|
|
|
<circle cx="797.833" cy="709.869" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<circle cx="772.406" cy="664.922" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-1.02302,1.48582)">
|
|
|
|
|
<circle cx="839.111" cy="705.76" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<circle cx="840.379" cy="671.458" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="862.971" cy="746.566" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="927.506" cy="750.952" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,14.6448,0.699414)">
|
|
|
|
|
<circle cx="969.04" cy="737.917" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,5.7229,1.39303)">
|
|
|
|
|
<circle cx="955.103" cy="705.577" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<circle cx="920.942" cy="704.802" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="882.968" cy="671.429" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="947.881" cy="666.887" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="955.716" cy="626.253" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="970.431" cy="594.583" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="937.65" cy="581.746" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="909.027" cy="578.114" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="908.624" cy="620.835" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="877.841" cy="619.556" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="879.364" cy="579.546" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="842.025" cy="623.367" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="842.025" cy="623.367" r="11.111" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="845.135" cy="575.982" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="837.276" cy="546.87" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="864.992" cy="550.912" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-2.50072,-2.00545)">
|
|
|
|
|
<circle cx="811.584" cy="540.512" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,0,2.9496)">
|
|
|
|
|
<circle cx="808.413" cy="621.476" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,6.78768,-1.96833)">
|
|
|
|
|
<circle cx="810.23" cy="565.9" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-5.85165,0)">
|
|
|
|
|
<circle cx="781.276" cy="618.396" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<circle cx="779.048" cy="583.529" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="753.706" cy="565.555" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,0.630981,-4.95273)">
|
|
|
|
|
<circle cx="769.718" cy="543.814" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<circle cx="708.597" cy="562.196" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="676.775" cy="539.215" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,0,6.83756)">
|
|
|
|
|
<circle cx="643.981" cy="558.344" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<circle cx="616.581" cy="540.469" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,0,9.23737)">
|
|
|
|
|
<circle cx="588.498" cy="560.485" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<circle cx="559.733" cy="543.754" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,0,5.50136)">
|
|
|
|
|
<circle cx="531.291" cy="566.915" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-25.4642,-3.56318)">
|
|
|
|
|
<circle cx="502.816" cy="546.382" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<circle cx="473.613" cy="568.664" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-13.9117,-7.32123)">
|
|
|
|
|
<circle cx="418.957" cy="577.635" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,6.36432,1.93122)">
|
|
|
|
|
<circle cx="438.366" cy="531.131" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-58.121,3.70933)">
|
|
|
|
|
<circle cx="438.366" cy="531.131" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-2.1168,-1.85467)">
|
|
|
|
|
<circle cx="424.054" cy="509.775" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-23.2662,-36.3974)">
|
|
|
|
|
<circle cx="399.45" cy="521.163" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<circle cx="406.029" cy="436.606" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="367.564" cy="424.414" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="346.311" cy="468.794" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="287.56" cy="472.692" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="225.429" cy="469.17" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="167.726" cy="472.538" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="161.953" cy="522.331" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="154.667" cy="552.678" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="190.498" cy="557.751" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="195.333" cy="524.112" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="228.652" cy="520.309" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="228.797" cy="548.836" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="146.176" cy="617.136" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,2.75776,11.9305)">
|
|
|
|
|
<circle cx="125.653" cy="694.226" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<circle cx="174.682" cy="706.456" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="158.027" cy="677.425" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="188.438" cy="662.319" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="204.939" cy="682.294" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="218.712" cy="638.225" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="233.81" cy="660.678" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="248.351" cy="617.534" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="286.349" cy="610.555" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="291.499" cy="634.159" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="325.915" cy="606.437" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="325.978" cy="631.921" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="316.833" cy="664.196" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="279.352" cy="669.812" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="279.352" cy="701.455" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="235.262" cy="698.029" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="253.417" cy="718.765" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="204.531" cy="721.928" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="219.453" cy="745.999" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="174.01" cy="746.994" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="187.101" cy="770.428" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="147.354" cy="793.574" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="134.319" cy="767.747" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="122.962" cy="880.96" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="144.399" cy="911.109" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="89.411" cy="965.393" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="70.348" cy="949.466" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="70.348" cy="949.466" r="11.111" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="45.361" cy="910.977" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="21.284" cy="911.622" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="17.932" cy="885.838" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="22.651" cy="853.756" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="21.193" cy="824.973" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="46.777" cy="817.6" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="97.787" cy="821.612" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="109.796" cy="806.61" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="107.723" cy="772.922" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="105.276" cy="750.887" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="94.302" cy="684.284" r="11.596" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="71.768" cy="680.631" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="38.829" cy="674.746" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="51.506" cy="641.563" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="77.629" cy="645.705" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="60.438" cy="610.24" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="87.848" cy="610.42" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="78.726" cy="564.717" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="104.38" cy="562.024" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="92.884" cy="513.044" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="120.908" cy="511.679" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="93.484" cy="485.61" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="129.908" cy="444.79" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="88.827" cy="440.79" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="72.472" cy="414.956" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="95.173" cy="399.656" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="40.8" cy="372.708" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="70.091" cy="359.197" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="31.789" cy="343.382" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="44.805" cy="310.228" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="77.643" cy="311.824" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="50.152" cy="279.293" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="113.498" cy="248.485" r="11.594" style="fill:rgb(128,222,128);"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,16.0149,26.5774)">
|
|
|
|
|
<circle cx="113.498" cy="248.485" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-32.899,9.71866)">
|
|
|
|
|
<circle cx="113.498" cy="248.485" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-54.5475,-14.8289)">
|
|
|
|
|
<circle cx="113.498" cy="248.485" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
<circle cx="153.566" cy="260.685" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="172.146" cy="239.769" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="207.596" cy="274.026" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="248.644" cy="273.101" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,0,5)">
|
|
|
|
|
<circle cx="346.028" cy="258.327" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-16.2028,-4.46127)">
|
|
|
|
|
<circle cx="315.921" cy="270.709" r="11.111" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<circle cx="121.105" cy="348.441" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="130.487" cy="377.993" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="164.756" cy="341.37" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="163.291" cy="372.65" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="203.464" cy="338.573" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="203.29" cy="371.13" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="238.103" cy="338.517" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="237.599" cy="370.624" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="275.974" cy="345.734" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="273.757" cy="370.199" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="319.074" cy="355.058" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.0316927,6.87098)">
|
|
|
|
|
<circle cx="316.155" cy="374.534" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<circle cx="351.537" cy="380.919" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,5.15223,1.86626)">
|
|
|
|
|
<circle cx="378.704" cy="329.362" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-0.053355,9.72568)">
|
|
|
|
|
<circle cx="430.164" cy="324.252" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,9.91127,-0.234298)">
|
|
|
|
|
<circle cx="429.371" cy="296.443" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,32.579,10.7394)">
|
|
|
|
|
<circle cx="411.282" cy="252.946" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,7.5996,29.4983)">
|
|
|
|
|
<circle cx="393.758" cy="228.527" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-8.11575,2.47405)">
|
|
|
|
|
<circle cx="415.132" cy="207.843" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,34.2748,-4.54213)">
|
|
|
|
|
<circle cx="415.132" cy="207.843" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-6.31328,-1.28864)">
|
|
|
|
|
<circle cx="405.614" cy="171.805" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,31.5977,3.84504)">
|
|
|
|
|
<circle cx="405.614" cy="171.805" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<circle cx="361.428" cy="171.47" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="337.876" cy="204.38" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="295.3" cy="207.118" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="259.292" cy="212.564" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="299.665" cy="138.6" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,9.13414,-1.80015)">
|
|
|
|
|
<circle cx="324.389" cy="128.671" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,46.4687,-6.09639)">
|
|
|
|
|
<circle cx="324.389" cy="128.671" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,4.85878,-8.43936)">
|
|
|
|
|
<circle cx="280.638" cy="115.071" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<circle cx="271.499" cy="131.563" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="381.579" cy="95.532" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,7.3769,13.674)">
|
|
|
|
|
<circle cx="400.115" cy="104.128" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,6.94311,-3.16418)">
|
|
|
|
|
<circle cx="446.044" cy="102.903" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-9.41019,9.01467)">
|
|
|
|
|
<circle cx="444.979" cy="66.999" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-26.6195,23.5307)">
|
|
|
|
|
<circle cx="373.252" cy="60.827" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<circle cx="232.294" cy="99.091" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="198.913" cy="109.8" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="226.473" cy="211.946" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<g transform="matrix(1,0,0,1,-7.0533,-5.68578)">
|
|
|
|
|
<circle cx="169.313" cy="192.525" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
|
|
|
|
<circle cx="189.271" cy="207.394" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="129.531" cy="216.517" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="17.697" cy="791.966" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="17.997" cy="761.995" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="19.278" cy="730.879" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="21.188" cy="696.464" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="174.314" cy="587.261" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="177.213" cy="617.972" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="227.002" cy="576.18" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="169.103" cy="431.819" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="200.912" cy="443.412" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="228.919" cy="437.511" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="227.28" cy="410.981" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="261.314" cy="443.498" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="288.309" cy="441.371" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="282.992" cy="410.221" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="316.138" cy="442.038" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="341.249" cy="436.779" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="362.498" cy="689.707" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="359.244" cy="665.194" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="385.064" cy="651.731" r="11.594" style="fill:rgb(128,222,128);"/>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g transform="matrix(1,0,0,1,-2.80657,0)">
|
|
|
|
|
<circle cx="399.403" cy="671.575" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
2023-12-21 10:59:01 +00:00
|
|
|
<circle cx="442.79" cy="696.064" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="446.694" cy="670.718" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="493.245" cy="668.94" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="494.203" cy="692.527" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="539.245" cy="657.878" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="540.787" cy="690.117" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="582.813" cy="652.168" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="586.356" cy="678.467" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="631.937" cy="642.252" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="633.695" cy="668.282" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="677.759" cy="638.032" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="680.204" cy="665.077" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="732.34" cy="655.441" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="739.806" cy="612.564" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="714.273" cy="614.743" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="679.738" cy="602.452" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="654.118" cy="623.706" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="627.303" cy="619.989" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="626.347" cy="601.102" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="576.37" cy="600.135" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="579.154" cy="628.057" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="537.346" cy="635.301" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="535.554" cy="603.676" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="499.568" cy="605.316" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="499.548" cy="643.997" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="459.013" cy="644.207" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="460.147" cy="607.471" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="396.914" cy="694.51" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="373.288" cy="611.616" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="417.867" cy="612.169" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="421.606" cy="646.55" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
<circle cx="931.816" cy="622.937" r="11.594" style="fill:rgb(128,222,128);"/>
|
|
|
|
|
</g>
|
2024-01-14 20:36:03 +00:00
|
|
|
<g id="zones">
|
2024-01-24 13:42:47 +00:00
|
|
|
<path id="zona-7" d="M541.642,137.124C515.284,141.168 498.423,138.81 471.842,140.935C450.749,142.622 428.97,140.312 408.553,145.869C338.883,164.833 349.183,186.503 282.178,213.433C261.828,221.612 239.315,222.832 217.692,226.507C189.141,231.36 151.994,218.333 131.714,239.008C117.595,253.403 132.812,284.361 148.399,297.153C197.288,337.277 268.061,349.656 329.217,351.891C350.216,352.658 373.194,340.492 392.208,349.436C403.151,354.584 394.044,374.193 399.533,384.969C403.104,391.978 410.166,398.246 417.874,399.819C449.449,406.262 482.134,411.818 514.174,408.362C525.014,407.193 536.544,397.459 538.754,386.783C546.165,350.982 540.243,313.678 541.338,277.135C542.251,246.708 542.598,216.24 544.777,185.877C546.015,168.624 557.452,134.699 541.642,137.124Z" style="fill:rgb(255,183,126);stroke:rgb(82,84,83);stroke-opacity:0;stroke-width:2px;stroke-miterlimit:1.5;"/>
|
|
|
|
|
<path id="zona-6" d="M121.374,329.874C126.923,321.993 137.078,320.965 144.96,323.137C213.883,342.132 213.332,343.726 283.089,359.149C287.16,360.05 289.102,369.961 285.218,371.475C259.68,381.427 230.982,380.821 205.01,389.577C196.109,392.578 186.71,397.923 182.247,406.188C178.133,413.808 177.798,424.603 182.016,432.165C192.672,451.268 235.094,481.513 238.109,511.55C239.918,529.567 235.324,547.694 232.535,565.585C224.728,615.668 215.545,665.531 206.337,715.377C202.989,733.503 193.968,751.063 194.87,769.474C196.566,804.11 210.733,837.21 213.995,871.734C214.62,878.348 211.181,885.635 206.267,890.106C200.224,895.604 191.607,897.834 183.588,899.399C166.043,902.823 147.513,900.311 130.247,904.942C118.779,908.018 110.864,921.232 99.021,922.081C92.985,922.514 88.262,914.013 87.561,908.002C72.716,780.77 79.998,779.75 118.531,657.498C131.438,616.548 152.913,575.518 150.272,532.664C148.584,505.278 120.898,486.31 106.539,462.929C100.445,453.006 87.629,444.337 88.919,432.764C92.905,397.023 101.845,357.609 121.374,329.874Z" style="fill:rgb(255,183,126);stroke:rgb(128,222,128);stroke-opacity:0;stroke-width:2px;stroke-miterlimit:1.5;"/>
|
|
|
|
|
<path id="zona-5" d="M505.085,519.04C506.317,527.744 479.629,536.05 459.016,537.538C450.539,538.15 458.745,518.173 451.978,513.031C445.845,508.371 421.067,514.571 413.369,514.315C347.187,512.108 314.471,516.008 245.194,517.465C233.272,517.715 245.309,493.023 240.879,481.951C230.155,455.144 216.739,465.411 200.339,444.982C194.626,437.865 182.177,414.713 193.406,403.672C209.736,387.616 262.09,389.719 272.45,389.114C356.341,384.215 355.344,394.896 448.975,419.044C459.56,421.774 475.298,418.734 480.408,428.398C496.237,458.332 500.34,485.513 505.085,519.04Z" style="fill:rgb(255,183,126);stroke:rgb(128,222,128);stroke-opacity:0;stroke-width:2px;stroke-miterlimit:1.5;"/>
|
|
|
|
|
<path id="zona-4" d="M246.246,524.789C307.577,518.894 367.119,516.165 431.002,517.003C440.188,517.123 434.544,536.358 441.324,542.557C445.444,546.324 452.522,542.503 458.051,541.736C470.705,539.981 483.737,530.743 495.781,535.003C504.121,537.953 502.288,551.568 507.005,559.051C513.57,569.465 521.74,578.783 529.436,588.393C531.916,591.489 533.182,600.06 527.506,603.657C513.128,612.769 513.269,613.26 500.607,622.747C494.75,627.135 488.57,631.647 481.558,633.744C425.669,650.451 387.039,635.819 323.876,646.343C318.705,647.205 322.02,657.051 318.897,661.262C315.531,665.802 310.508,669.195 305.302,671.394C277.685,683.058 258.359,696.898 235.165,716.084C229.126,721.08 211.625,720.556 211.895,712.723C213.606,662.96 231.472,615.076 240.325,566.077C242.925,551.683 244.587,539.321 246.246,524.789Z" style="fill:rgb(255,183,126);stroke:rgb(128,222,128);stroke-opacity:0;stroke-width:2px;stroke-miterlimit:1.5;"/>
|
|
|
|
|
<path id="zona-3" d="M912.192,620.954C916.224,624.5 920.744,628.476 926.074,629.126C964.803,633.843 1004.44,630.129 1042.86,636.872C1052.12,638.495 1063.11,644.524 1065.55,653.597C1071.22,674.725 1067.03,697.443 1064.97,719.222C1063.61,733.706 1057.5,747.404 1055.35,761.791C1054.75,765.776 1057.15,769.777 1056.81,773.792C1056.53,776.978 1056.72,782.881 1053.53,782.809C1023.92,782.138 994.971,772.627 965.367,771.719C941.832,770.996 918.526,776.869 895.005,777.943C892.644,778.05 889.107,776.765 889.491,774.433C893.046,752.857 895.253,734.687 897.762,713.643C901.227,684.581 903.781,657.726 906.259,627.137C906.453,624.741 909.912,621.713 912.192,620.954Z" style="fill:rgb(255,183,126);stroke:rgb(128,222,128);stroke-opacity:0;stroke-width:2px;stroke-miterlimit:1.5;"/>
|
|
|
|
|
<path id="zona-2" d="M450.743,668.938C454.141,659.657 473.269,645.426 484.324,636.812C502.981,622.273 528.906,604.104 539.574,599.714C569.364,587.455 772.249,596.754 888.587,597.523C902.051,597.612 904.915,614.799 904.413,627.166C903.578,647.744 896.873,727.261 885.498,782.859C884.914,785.712 861.945,788.945 850.405,791.451C820.954,797.846 792.468,809.048 762.582,812.939C706.434,820.249 649.315,817.825 593.143,824.943C589.673,825.382 548.337,846.073 546.125,839.557C538.522,817.154 536.68,801.458 528.441,783.475C524.418,774.694 510.615,778.999 501.095,777.369C481.637,774.038 460.506,774.783 443.064,765.537C434.96,761.241 430.864,749.669 431.591,740.526C433.548,715.902 442.25,692.134 450.743,668.938Z" style="fill:rgb(255,183,126);stroke:rgb(128,222,128);stroke-opacity:0;stroke-width:2px;stroke-miterlimit:1.5;"/>
|
|
|
|
|
<path id="zona-1" d="M418.073,661.097C397.86,658.619 377.163,653.716 357.103,657.224C311.276,665.237 220.533,726.479 203.105,745.401C192.157,757.287 201.273,777.836 203.208,793.879C206.247,819.079 209.713,844.578 217.958,868.584C219.439,872.894 226.629,875.898 230.629,873.716C287.589,842.633 362.358,806.747 410.055,743.843C422.698,727.17 423.149,703.808 426.204,683.107C427.345,675.37 422.334,667.656 418.073,661.097Z" style="fill:rgb(255,183,126);stroke:rgb(128,222,128);stroke-opacity:0;stroke-width:2px;stroke-miterlimit:1.5;"/>
|
2023-12-20 12:02:41 +00:00
|
|
|
</g>
|
Add campsite map in SVG
I intend to use the same SVG file for customers and employees, so i had
to change Oriol’s design to add a class to layers that are supposed to
be only for customers, like trees. These are hidden in the admin area.
I understood that customers and employees have to click on a campsite to
select it, and then they can book or whatever they need to do to them.
Since customers and employees most certainly will need to have different
listeners on campsites, i decided to add the link with JavaScript. To
do so, i need a custom XML attribute with the campsite’s identifier.
Since i have seen that all campsites have a label, i changed the
“identifier” to the unique combination (company_id, label). The
company_id is there because different companies could have the same
label; i left the campsite_id primary key for foreign constraints.
In this case, as a test, i add an <a> element to the campsite with a
link to edit it; we’ll discuss with Oriol what exactly it needs to do.
However, the original design had the labels in a different layer, that
interfered with the link, as the numbers must be above the path and
the link must wrap the path in order to “inherit” its shape. I had no
other recourse than to move the labels in the same layer as the paths’.
2023-09-24 01:17:13 +00:00
|
|
|
</svg>
|
