根据坐标范围随机生成坐标点echarts scatter配置项内容和展示
配置项如下
var data = [
['特棒区', 114.818115234375, 24.091604032879]
];
var min = 113.884277343749;
var max = 114.818115234375;
data.forEach(function(item) {
max = Math.max(item[2], max);
min = Math.min(item[2], min);
});
var json = {
"type": "FeatureCollection",
"features": [{
"type": "Feature",
"properties": {
"adcode": 441800,
"name": "特棒区",
"center": [114.2545, 23.33469],
"centroid": [112.879385, 24.313377],
"childrenNum": 8,
"level": "city",
"parent": {
"adcode": 440000
},
"subFeatureIndex": 15,
"acroutes": [100000, 440000]
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[113.9666748046875, 23.458204809367825],
[114.14245605468749, 23.440569039771567],
[114.20562744140625, 23.407806080861413],
[114.2523193359375, 23.385119279739676],
[114.28253173828124, 23.39520278228782],
[114.30999755859375, 23.33973402476286],
[114.356689453125, 23.36999258703044],
[114.4281005859375, 23.31703557669873],
[114.554443359375, 23.31703557669873],
[114.5819091796875, 23.175713800385203],
[114.57092285156249, 23.130257185291036],
[114.5819091796875, 23.089838367476705],
[114.774169921875, 23.11004929735674],
[114.686279296875, 23.150462029224087],
[114.6807861328125, 23.211058276488192],
[114.73571777343749, 23.2060096376488],
[114.774169921875, 23.23629860860331],
[114.6807861328125, 23.276673210348186],
[114.686279296875, 23.337212166501164],
[114.78515624999999, 23.33216830631147],
[114.7906494140625, 23.392681978612988],
[114.65881347656249, 23.397723537981232],
[114.6807861328125, 23.548880923858743],
[114.81811523437501, 23.63949208151219],
[114.7576904296875, 23.654587852202987],
[114.664306640625, 23.599228183239397],
[114.6807861328125, 23.96115620034201],
[114.3621826171875, 24.076559120295396],
[114.246826171875, 24.076559120295396],
[114.10400390625, 24.06151244228103],
[114.0216064453125, 24.031413793283296],
[113.9447021484375, 24.09160403287902],
[113.88427734374999, 24.056496490768524],
[113.93920898437499, 23.85067404608915],
[113.917236328125, 23.785344805941214],
[113.99414062499999, 23.709924101604923],
[113.96118130534887, 23.639491774370235],
[113.9886474609375, 23.55895191986295],
[113.9666748046875, 23.458204809367825]
]
]
}
},
{
"type": "Feature",
"properties": {
"level": "city",
"name": "轧钢区",
"parent": {
"adcode": 440000
},
"subFeatureIndex": 21,
"acroutes": [100000, 440000],
"center": [113.8335, 23.1858],
"childrenNum": 8,
"adcode": 445300
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[113.917236328125, 23.785344499142493],
[113.7579345703125, 23.606778606523967],
[113.66180419921875, 23.521181707248573],
[113.62060546875, 23.518663307493846],
[113.52996826171875, 23.42292845506526],
[113.66729736328125, 23.31451328756949],
[113.48603367805481, 23.145399388714008],
[113.70849609375, 22.98115258902039],
[113.78265380859374, 23.034242642076585],
[113.82110595703125, 23.019076187293035],
[113.84582519531249, 23.034242642076585],
[113.829345703125, 23.072151310102857],
[113.86505126953125, 23.092364899997815],
[113.85406494140624, 23.104996849988808],
[113.90350341796875, 23.140359987886118],
[113.92822265625, 23.120153621695614],
[114.0985107421875, 23.22620304830155],
[113.89251708984374, 23.334690260349362],
[113.9666748046875, 23.458204809367825],
[113.9886474609375, 23.55895191986295],
[113.96118130534887, 23.639491467228282],
[113.99414096027613, 23.709924101604923],
[113.917236328125, 23.785344499142493]
]
]
}
},
{
"type": "Feature",
"properties": {
"childrenNum": 5,
"name": "高炉区",
"level": "city",
"parent": {
"adcode": 440000
},
"subFeatureIndex": 21,
"acroutes": [100000, 440000],
"adcode": 445240,
"center": [113.1235, 23.25775]
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[113.5752872005105, 23.470804870898736],
[113.51898193359374, 23.468285200853252],
[113.499755859375, 23.49095773149582],
[113.49700927734375, 23.44812856964819],
[113.45581054687499, 23.453168015916184],
[113.24981689453125, 23.392681978612988],
[113.12896728515624, 23.41032659658828],
[113.11248779296874, 23.387640227334956],
[113.11798095703125, 23.354864168418864],
[113.016357421875, 23.296855923968202],
[112.98065185546874, 23.294333252116257],
[112.94769287109375, 23.25901082664879],
[112.92572021484374, 23.25648743787913],
[112.85430908203125, 23.213582524373837],
[112.83782958984375, 23.23377479011388],
[112.8131103515625, 23.21863087705702],
[112.82684326171875, 23.193387206172908],
[112.7911376953125, 23.168138769018746],
[112.94495232403278, 23.001365328917736],
[113.27178955078125, 23.193387206172908],
[113.26629638671875, 23.22620304830155],
[113.43701362609863, 23.09962841637947],
[113.66729736328125, 23.31451328756949],
[113.52996792644262, 23.42292845506526],
[113.5752872005105, 23.470804870898736]
]
]
}
},
{
"type": "Feature",
"properties": {
"childrenNum": 5,
"name": "烧结区",
"level": "city",
"parent": {
"adcode": 440000
},
"subFeatureIndex": 21,
"acroutes": [100000, 440000],
"adcode": 445250,
"center": [113.219, 22.97845]
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[113.26629638671875, 23.22620304830155],
[113.27178955078125, 23.193387206172908],
[112.87833530455828, 22.962192970180446],
[112.89988584816454, 22.934126805914318],
[112.97103881835938, 22.97735964332157],
[113.02690085023642, 22.910822575727057],
[113.16055297851562, 23.00137983406543],
[113.21106735616922, 22.95551541499815],
[113.21598216891289, 22.95105210520374],
[113.22200238704681, 22.94558460476435],
[113.48008688539265, 23.013244831232022],
[113.70849609375, 22.98115258902039],
[113.48603367805481, 23.145399388714008],
[113.43701396137476, 23.09962841637947],
[113.26629638671875, 23.22620304830155]
]
]
}
},
{
"type": "Feature",
"properties": {
"childrenNum": 5,
"name": "老焦化区",
"level": "city",
"parent": {
"adcode": 440000
},
"subFeatureIndex": 21,
"acroutes": "[100000,440000]",
"adcode": 445260,
"center": [113.733558654785, 22.8885110905685]
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[113.82110629230738, 23.019076187293035],
[113.78265414386988, 23.034242642076585],
[113.70129000395539, 22.97630921806577],
[113.6624948680401, 22.94838152018778],
[113.55804562568665, 22.873979164691015],
[113.58524322509767, 22.849601761797313],
[113.65459442138675, 22.862572776271094],
[113.69373321533206, 22.888511090568574],
[113.70059967041018, 22.893571647287022],
[113.70437622070314, 22.897683210648072],
[113.71089935302737, 22.9008458668988],
[113.72428894042972, 22.911282109265453],
[113.74420166015626, 22.891357676944587],
[113.74042779207232, 22.884396778187146],
[113.734247982502, 22.884396778187146],
[113.7287548184395, 22.88692715684301],
[113.65699768066408, 22.815428289744798],
[113.6964797973633, 22.80941540260295],
[113.72463226318361, 22.836945920943855],
[113.73355865478516, 22.842641195055467],
[113.74248504638672, 22.85244916368374],
[113.74832153320312, 22.868266976949002],
[113.77106666564941, 22.855612873615147],
[113.80599975585938, 22.869848657005296],
[113.86505126953125, 22.921717548269353],
[113.8104656338692, 22.976092835005016],
[113.8104656338692, 22.979885816263863],
[113.81527215242387, 22.983678691046045],
[113.82007867097855, 22.98936872948855],
[113.82110629230738, 23.019076187293035]
]
]
}
},
{
"type": "Feature",
"properties": {
"childrenNum": 5,
"name": "原料区",
"level": "city",
"parent": {
"adcode": 440000
},
"subFeatureIndex": 21,
"acroutes": [100000, 440000],
"adcode": 455270,
"center": [113.1636, 22.96803],
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[113.70849575847387, 22.98115258902039],
[113.48008688539271, 23.013244831232033],
[113.22200238704683, 22.94558460476435],
[113.16055331379175, 23.00137983406543],
[113.02690085023646, 22.910822266900208],
[112.97103848308325, 22.97735933464651],
[112.78047826141119, 22.864244113170194],
[113.10836791992188, 22.553147478403194],
[113.70849575847387, 22.98115258902039]
]
]
}
},
{
"type": "Feature",
"properties": {
"childrenNum": 5,
"name": "新焦化区",
"level": "city",
"parent": {
"adcode": 440000
},
"subFeatureIndex": 21,
"acroutes": [100000, 440000],
"center": [112.737579345703, 23.0361383289365],
"adcode": 455280
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[112.94495232403278, 23.00136502029756],
[112.79251098632812, 23.16750749705668],
[112.76779174804688, 23.13720294383875],
[112.74856567382812, 23.139728585023715],
[112.74856567382812, 23.119522123709167],
[112.73757934570312, 23.0942597682155],
[112.73757934570312, 23.07657329256602],
[112.73277282714844, 23.061885433244626],
[112.71286010742189, 23.048775559696235],
[112.68539428710938, 23.04119336350683],
[112.66891479492188, 23.03613832893654],
[112.63320922851562, 23.01844421465108],
[112.56454467773439, 22.775548399865862],
[112.55630493164064, 22.75022178320801],
[112.54197120666502, 22.725282597960074],
[112.89988584816454, 22.934126805914318],
[112.87833530455828, 22.962192970180446],
[112.94495232403278, 23.00136502029756]
]
]
}
},
{
"type": "Feature",
"properties": {
"childrenNum": 5,
"name": "总部办公区",
"level": "city",
"parent": {
"adcode": 440000
},
"subFeatureIndex": 21,
"acroutes": [100000, 440000],
"center": [113.3926, 22.52461],
"adcode": 455290
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[113.5010915994644, 22.83338594454882],
[113.10836791992188, 22.553147478403194],
[113.11180114746094, 22.53792742994721],
[113.11368942260742, 22.529048293377087],
[113.11495542526245, 22.52016858599439],
[113.11798095703125, 22.49479484975443],
[113.115234375, 22.470050975832237],
[113.10836926102638, 22.441498887893033],
[113.10150146484375, 22.418645732760517],
[113.27178955078125, 22.332292904091716],
[113.291015625, 22.329752304376473],
[113.31024169921875, 22.329752304376473],
[113.33221435546875, 22.334833457530486],
[113.34320068359375, 22.36023644579937],
[113.33770751953125, 22.38563480185718],
[113.34148406982422, 22.444033419008992],
[113.36517333984375, 22.44911039888609],
[113.38165283203125, 22.44911039888609],
[113.40362548828125, 22.456725520188897],
[113.41735839843749, 22.471954507739227],
[113.43109130859375, 22.487181821139295],
[113.40911865234374, 22.51255695405145],
[113.499755859375, 22.598797546832557],
[113.52447509765625, 22.5861184893211],
[113.60412597656249, 22.641897604526804],
[113.65631103515626, 22.598797546832557],
[113.66729736328125, 22.61401087437029],
[113.66729736328125, 22.63429269379353],
[113.65081787109374, 22.659640758754797],
[113.631591796875, 22.652036830568676],
[113.631591796875, 22.669778674332314],
[113.6260986328125, 22.690052257634015],
[113.60961914062501, 22.705255477207526],
[113.59039306640625, 22.67738161936916],
[113.54095458984375, 22.733123662313677],
[113.56292724609376, 22.755920681486405],
[113.5010915994644, 22.83338594454882]
]
]
}
},
{
"type": "Feature",
"properties": {
"childrenNum": 5,
"name": "厂前区",
"level": "city",
"parent": {
"adcode": 440000
},
"subFeatureIndex": 21,
"acroutes": [100000, 440000],
"center": [112.7099, 22.46008],
"adcode": 455300
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[113.10150146484375, 22.418645422823896],
[113.10493536293507, 22.43007324552381],
[113.10836926102638, 22.44149857800744],
[113.115234375, 22.47004106153508],
[113.11798095703125, 22.49479453998801],
[113.11646819114685, 22.507482919374436],
[113.11495542526245, 22.52016920541352],
[113.114333152771, 22.524608511026262],
[113.11368942260742, 22.52904798368742],
[113.11274528503418, 22.53348824270445],
[113.11180114746094, 22.537927120277452],
[113.1100845336914, 22.54553735432918],
[113.10836791992188, 22.553147478403194],
[112.78047792613505, 22.864244113170194],
[112.5294828414917, 22.718002709323194],
[112.25349426269533, 22.51572851830351],
[112.2686004638672, 22.504944902976998],
[112.4014663696289, 22.59594486068746],
[112.44987487792967, 22.63524333065582],
[112.50205993652344, 22.67516413727236],
[112.53913879394531, 22.703988606693763],
[112.55046844482422, 22.69607040047147],
[112.5490951538086, 22.688151736561025],
[112.5494384765625, 22.66249212322032],
[112.56488800048828, 22.638095201780473],
[112.57930755615234, 22.64633360803325],
[112.5882339477539, 22.659957579954387],
[112.60574340820312, 22.679915840712695],
[112.62496948242188, 22.715390019335942],
[112.68264770507812, 22.71285645414127],
[112.75955200195314, 22.695120184965695],
[112.85842895507812, 22.598797546832557],
[112.88040161132812, 22.510019650257966],
[112.74856567382812, 22.515094211274757],
[112.68814086914064, 22.525242774383898],
[112.6579284667969, 22.527779798694564],
[112.63595581054688, 22.530316776410356],
[112.59475708007814, 22.530316776410356],
[112.55905151367188, 22.304343762932216],
[112.54531860351562, 22.25859674097572],
[112.53158569335938, 22.233175265402785],
[112.49862670898438, 22.19249131446977],
[112.44644165039064, 22.144163813359707],
[112.4162292480469, 22.118721619281263],
[112.38052368164062, 22.078004557865498],
[112.33657836914062, 22.01690695877902],
[112.3612976074219, 22.009267904493782],
[112.47116088867189, 22.12889904826069],
[112.51510620117188, 22.167057857886153],
[112.57003784179688, 22.207749178410847],
[112.58651733398438, 22.245886579877187],
[112.59475708007814, 22.304343762932216],
[112.61398315429688, 22.36023644579937],
[112.64144897460939, 22.418645732760517],
[112.65243530273438, 22.44911039888609],
[112.66342163085938, 22.471954507739227],
[112.74856567382812, 22.405950148725722],
[112.84194946289062, 22.39325340477354],
[112.9380798339844, 22.39325340477354],
[113.10150146484375, 22.418645422823896]
]
]
}
},
{
"type": "Feature",
"properties": {
"childrenNum": 5,
"name": "东办公区",
"level": "city",
"parent": {
"adcode": 440000
},
"subFeatureIndex": 21,
"acroutes": [100000, 440000],
"center": [1113.8999, 23.06154],
"adcode": 455310
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[113.90350375324488, 23.140359987886118],
[113.85406494140624, 23.104996849988808],
[113.86505126953125, 23.092364899997815],
[113.82934603840113, 23.072151310102857],
[113.84582519531249, 23.034242333531626],
[113.82110595703125, 23.019076187293035],
[113.82007867097855, 22.98936872948855],
[113.90350341796875, 22.982416880591504],
[113.92959594726562, 23.008964269673108],
[113.97491455078125, 23.010228300829105],
[113.97079467773436, 23.027923493284298],
[113.9886474609375, 23.040561494558183],
[113.96003935486078, 23.139974302213734],
[113.92822265625, 23.120153621695614],
[113.90350375324488, 23.140359987886118]
]
]
}
}
]
};
echarts.registerMap('china-cities', json);
myChart.setOption({
backgroundColor: '#404a59',
geo: {
map: 'china-cities',
silent: true,
itemStyle: {
normal: {
areaColor: '#323c48',
borderColor: '#111',
borderWidth: 0.1
},
emphasis: {
areaColor: '#2a333d'
}
}
},
series: [{
type: 'scatter',
coordinateSystem: 'geo',
data: []
}]
});
var geo = myChart.getModel().getComponent('geo').coordinateSystem;
var points = [];
data.forEach(function(item) {
var randomCount = Math.round(item[2] / (max / 1000));
console.log(randomCount);
var name = item[0]
var region = geo.getRegion(name);
if (!region) {
return;
}
var rect = region.getBoundingRect();
console.log(randomCount);
for (var i = 0; i < randomCount; i++) {
var coord = [Infinity, Infinity];
while (!region.contain(coord)) {
coord[0] = rect.x + Math.random() * rect.width;
coord[1] = rect.y + Math.random() * rect.height;
}
points.push(coord);
}
});
myChart.setOption({
series: [{
data: points,
blendMode: 'lighter',
symbolSize: 2,
itemStyle: {
normal: {
shadowBlur: 2,
shadowColor: 'rgba(37, 140, 249, 0.2)',
color: 'rgba(37, 140, 249, 0.2)'
}
},
}]
});
截图如下
