0

我正在为点击缩放(API!=缩放)的谷歌地理图表创建一个库

我需要获取 svg 路径的宽度或高度,以便过滤它们并将它们的坐标存储在数组对象中。我能够存储阿拉斯加和夏威夷的元素坐标,但是对于美国大陆,我必须更深入地走上一层,并且很难意识到我哪里出错了。

我在大陆节点列表上变得不确定。

google.visualization.events.addOneTimeListener(chart, 'ready', function (e){
            google.visualization.events.addListener(chart, 'select', function (e){

              var selection = chart.getSelection(),
                  selectedState = '',
                  nodes = document.querySelectorAll("g[clip-path]")[0].childNodes[0],
                  continental = nodes.childNodes[0],
                  alaska = nodes.childNodes[1],
                  hawaii = nodes.childNodes[2],
                  stateCoords = {},
                  nl = null,
                  zoomX = null,
                  zoomY = null;

              //////////////////////////////
              //Get Coordinates of States//
              /////////////////////////////

              getCoords(alaska);
              getCoords(hawaii);
              // getCoords(continental);
              console.log(stateCoords);

              function getCoords(nodeList){

                function getZoom(nodeList, s){
                  nl = nodeList.getBoundingClientRect();
                  zoomY = nl.top + (nl.height/2);
                  zoomX = nl.left + (nl.width/2);
                  stateCoords[s] = [zoomX, zoomY];
                }

                if (nodeList == alaska) {
                    getZoom(nodeList, 1);
                } 
                else if (nodeList == hawaii){
                    getZoom(nodeList, 11);
                } 
                else {
                    console.log('continental');
                    var nodeListLength = nodeList.childNodes.length,
                        i = 0,
                        s = 0;

                    for (i; i < nodeListLength; i++) {
                      console.log(nodeList.childNodes[i]);
                      var pathBound = nodeList.childNodes[i].getBoundingClientRect();

                      if (pathBound.height > 3 && s != 1 && s!= 11) {
                          getZoom(nodeList[i], s);
                          s++;
                      } else { s++; }
                    }

                  }
              }
4

0 回答 0