如何在不突出阿拉斯加的情况下使用Highcharts突出显示美国?

问题描述 投票:0回答:1

我正在使用world.geo.json highcharts地图。是否可以编辑代码,以便在hc-key ='us'时不会突出显示阿拉斯加?

world.geo.json代码:

{"title":"World, Miller projection, medium resolution","version":"1.1.2","type":"FeatureCollection","copyright":"Copyright (c) 2015 Highsoft AS, Based on data from Natural Earth","copyrightShort":"Natural Earth","copyrightUrl":"http://www.naturalearthdata.com","crs":{"type":"name","properties":{"name":"urn:ogc:def:crs:EPSG:54003"}},"hc-transform":{"default":{"crs":"+proj=mill +lat_0=0 +lon_0=0 +x_0=0 +y_0=0 +R_A +datum=WGS84 +units=m +no_defs","scale":1.72182781654e-05,"jsonres":15.5,"jsonmarginX":-999,"jsonmarginY":9851.0,"xoffset":-19495356.3693,"yoffset":12635908.1982}},
"features":[{"type":"Feature","id":"US","properties":{"hc-group":"admin0","hc-middle-x":0.68,"hc-middle-y":0.68,"hc-key":"us","hc-a2":"US","name":"United States of America","labelrank":"2","country-abbrev":"U.S.A.","subregion":"Northern America","region-wb":"North America","iso-a3":"USA","iso-a2":"US","woe-id":"23424977","continent":"North America"},"geometry":{"type":"MultiPolygon","coordinates":[[[[556,8034],[559,8032],[549,8036],[550,8040],[556,8034]]],[[[558,8043],[561,8042],[558,8039],[553,8040],[558,8043]]],[[[265,8289],[268,8289],[267,8283],[263,8288],[265,8289]]],[[[263,8300],[267,8295],[264,8292],[261,8294],[263,8300]]],[[[255,8300],[267,8279],[253,8290],[251,8302],[255,8300]]],[[[306,8298],[305,8293],[298,8293],[300,8304],[306,8298]]],[[[249,8306],[250,8302],[245,8301],[244,8305],[249,8306]]],[[[292,8310],[298,8305],[294,8298],[291,8308],[292,8310]]],[[[238,8311],[244,8313],[244,8308],[238,8304],[238,8311]]],[[[249,8311],[248,8310],[244,8314],[249,8314],[249,8311]]],[[[232,8330],[237,8337],[249,8340],[245,8335],[232,8330]]],[[[272,8342],[284,8338],[278,8330],[268,8336],[272,8342]]],[[[268,8353],[268,8346],[255,8348],[259,8353],[268,8353]]],[[[282,8349],[285,8339],[276,8346],[276,8355],[282,8349]]],[[[261,8368],[271,8358],[264,8355],[259,8356],[261,8368]]],[[[234,8379],[258,8373],[253,8353],[237,8353],[234,8379]]],[[[181,8386],[179,8377],[173,8376],[177,8383],[181,8386]]],[[[158,8420],[155,8412],[152,8416],[154,8423],[158,8420]]],[[[1578,8023],[1574,8018],[1559,8010],[1556,8013],[1578,8023]]],[[[1623,7918],[1621,7909],[1614,7899],[1610,7903],[1623,7918]]],[[[1667,7934],[1667,7928],[1663,7927],[1665,7933],[1667,7934]]],[[[1724,7944],[1726,7939],[1717,7939],[1721,7943],[1724,7944]]],[[[224,8331],[215,8369],[227,8371],[236,8359],[224,8331]]],[[[-726,8256],[-740,8233],[-777,8227],[-811,8206],[-792,8230],[-757,8230],[-757,8246],[-726,8256]]],[[[193,8378],[186,8400],[202,8387],[208,8341],[193,8378]]],[[[183,8412],[177,8392],[156,8412],[174,8431],[183,8412]]],[[[199,8431],[221,8424],[229,8389],[214,8393],[199,8431]]],[[[-826,8660],[-803,8657],[-834,8641],[-862,8661],[-896,8667],[-850,8675],[-826,8660]]],[[[553,8054],[551,8053],[551,8054],[553,8054]]],[[[1261,7281],[1260,7293],[1252,7296],[1228,7335],[1206,7373],[1202,7375],[1200,7378],[1167,7387],[1143,7358],[1102,7380],[1091,7409],[1043,7449],[993,7449],[993,7434],[908,7434],[797,7472],[799,7479],[728,7473],[722,7492],[686,7523],[648,7524],[624,7541],[571,7629],[568,7651],[532,7689],[528,7720],[512,7742],[522,7777],[507,7826],[520,7864],[527,7925],[507,8030],[563,8020],[563,8024],[573,8014],[562,8025],[562,8026],[566,8031],[562,8027],[561,8054],[1379,8054],[1455,8037],[1491,8018],[1546,8016],[1503,7997],[1471,7971],[1510,7975],[1520,7963],[1574,7988],[1575,7986],[1575,7988],[1591,7997],[1601,7995],[1583,7981],[1612,7961],[1683,7971],[1697,7959],[1708,7961],[1708,7954],[1689,7936],[1622,7938],[1592,7889],[1612,7898],[1595,7842],[1598,7806],[1614,7783],[1632,7792],[1645,7831],[1636,7855],[1644,7893],[1694,7935],[1726,7918],[1730,7880],[1715,7868],[1750,7865],[1758,7833],[1755,7820],[1751,7816],[1746,7820],[1739,7807],[1727,7787],[1756,7775],[1780,7780],[1855,7817],[1862,7830],[1858,7836],[1858,7842],[1927,7844],[1955,7886],[1970,7900],[1987,7905],[1987,7905],[2082,7905],[2118,7937],[2126,7968],[2149,7996],[2192,7982],[2192,7933],[2196,7927],[2203,7927],[2202,7914],[2210,7911],[2216,7898],[2179,7882],[2181,7881],[2174,7874],[2173,7879],[2173,7879],[2164,7875],[2168,7876],[2168,7870],[2163,7871],[2161,7874],[2155,7872],[2110,7843],[2108,7787],[2041,7770],[2006,7747],[2005,7718],[1959,7656],[1937,7700],[1941,7654],[1934,7620],[1948,7620],[1956,7577],[1933,7542],[1915,7545],[1890,7517],[1854,7495],[1795,7447],[1786,7414],[1814,7342],[1829,7289],[1819,7237],[1797,7235],[1766,7277],[1746,7323],[1752,7355],[1710,7394],[1682,7378],[1650,7401],[1567,7404],[1544,7395],[1558,7358],[1533,7373],[1514,7361],[1485,7382],[1464,7376],[1411,7380],[1340,7337],[1309,7290],[1321,7262],[1289,7265],[1261,7281]]],[[[247,8324],[243,8322],[239,8327],[247,8327],[248,8327],[252,8348],[288,8301],[287,8280],[261,8307],[246,8319],[247,8324]]],[[[-425,7092],[-433,7100],[-433,7100],[-426,7097],[-425,7092],[-425,7092],[-425,7092]]],[[[-425,7092],[-390,7060],[-422,7047],[-425,7092],[-425,7092],[-425,7092]]],[[[308,8292],[307,8287],[302,8290],[308,8292],[308,8292],[308,8292]]],[[[217,8430],[220,8427],[210,8429],[210,8433],[205,8435],[148,8429],[100,8466],[54,8486],[-34,8511],[-77,8513],[-132,8528],[-131,8544],[-185,8544],[-179,8506],[-229,8506],[-240,8492],[-304,8469],[-282,8489],[-303,8495],[-289,8538],[-261,8553],[-264,8566],[-317,8528],[-328,8503],[-369,8479],[-346,8459],[-377,8422],[-432,8396],[-465,8356],[-478,8363],[-510,8328],[-540,8328],[-589,8308],[-615,8286],[-687,8268],[-679,8288],[-643,8297],[-585,8332],[-551,8327],[-555,8346],[-513,8369],[-478,8400],[-458,8457],[-516,8437],[-555,8465],[-597,8443],[-595,8484],[-613,8511],[-651,8497],[-693,8522],[-709,8506],[-741,8500],[-765,8515],[-713,8520],[-680,8544],[-726,8574],[-715,8598],[-667,8655],[-644,8644],[-615,8663],[-568,8678],[-587,8710],[-579,8735],[-637,8709],[-728,8718],[-784,8772],[-702,8808],[-655,8816],[-653,8790],[-599,8787],[-594,8837],[-655,8842],[-667,8867],[-741,8904],[-729,8932],[-673,8934],[-637,8959],[-638,8973],[-601,9009],[-570,9009],[-534,9034],[-486,9036],[-450,9061],[-399,9052],[-370,9033],[-317,9037],[-306,9015],[-225,9020],[-162,9000],[-87,8990],[-49,8997],[19,8972],[20,8520],[74,8510],[120,8473],[126,8458],[158,8488],[183,8497],[199,8475],[245,8436],[292,8359],[346,8330],[346,8304],[346,8304],[319,8284],[320,8322],[316,8323],[310,8332],[305,8326],[295,8329],[287,8349],[254,8380],[220,8428],[217,8430]]],[[[-373,8372],[-390,8391],[-344,8421],[-318,8446],[-311,8403],[-356,8377],[-413,8325],[-373,8372]]],[[[-433,7100],[-479,7115],[-446,7112],[-433,7100],[-433,7100]]],[[[308,8292],[309,8295],[309,8292],[308,8292],[308,8292],[308,8292]]]]}}]}

当前输出:enter image description here

angular highcharts
1个回答
1
投票

要在将鼠标悬停在美国时不在工具提示中显示阿拉斯加,需要将其从美国地图对象中删除并移至另一个地图对象。

演示:https://jsfiddle.net/BlackLabel/qsw1za3d/

let alaskaCor = [];

//get alaskaCor
alaskaCor.push(Highcharts.maps['custom/world-highres'].features[2].geometry.coordinates[42], Highcharts.maps['custom/world-highres'].features[2].geometry.coordinates[24], Highcharts.maps['custom/world-highres'].features[2].geometry.coordinates[34], Highcharts.maps['custom/world-highres'].features[2].geometry.coordinates[36], Highcharts.maps['custom/world-highres'].features[2].geometry.coordinates[5], Highcharts.maps['custom/world-highres'].features[2].geometry.coordinates[6], Highcharts.maps['custom/world-highres'].features[2].geometry.coordinates[23], Highcharts.maps['custom/world-highres'].features[2].geometry.coordinates[32])

//remove Alaska from the US coordinates
Highcharts.maps['custom/world-highres'].features[2].geometry.coordinates[42] = []
Highcharts.maps['custom/world-highres'].features[2].geometry.coordinates[24] = []
Highcharts.maps['custom/world-highres'].features[2].geometry.coordinates[34] = []
Highcharts.maps['custom/world-highres'].features[2].geometry.coordinates[36] = []
Highcharts.maps['custom/world-highres'].features[2].geometry.coordinates[5] = []
Highcharts.maps['custom/world-highres'].features[2].geometry.coordinates[6] = []
Highcharts.maps['custom/world-highres'].features[2].geometry.coordinates[23] = []
Highcharts.maps['custom/world-highres'].features[2].geometry.coordinates[32] = []


Highcharts.maps['custom/world-highres'].features.push({
  "type": "Feature",
  "id": "Alaska",
  "properties": {
    "hc-group": "admin0",
    "hc-key": "alaska",
    "name": "Alaska",
  },
  "geometry": {
    "type": "MultiPolygon",
    "coordinates": alaskaCor
  }
});
© www.soinside.com 2019 - 2024. All rights reserved.