echarts任意散点图

const echart = document.getElementById(‘echarts’)
echarts.registerMap(‘宝安区’, {
“type”: “FeatureCollection”,
“features”: [
{
“type”: “Feature”,
“properties”: {
// “name”: “宝安区”
},
“geometry”: {
“type”: “MultiPolygon”,
“coordinates”: [
[
[
[
113.9738,
22.655626
],
[
113.972866,
22.656894
],
[
113.970926,
22.657961
],
[
113.967764,
22.658961
],
[
113.963452,
22.659362
],
[
113.960577,
22.659228
],
[
113.958565,
22.659161
],
[
113.956625,
22.658628
],
[
113.954613,
22.657227
],
[
113.952529,
22.655093
],
[
113.949654,
22.653291
],
[
113.947498,
22.651157
],
[
113.946492,
22.648822
],
[
113.945342,
22.647088
],
[
113.944552,
22.645153
],
[
113.943042,
22.643352
],
[
113.939809,
22.641484
],
[
113.938299,
22.640083
],
[
113.936359,
22.638749
],
[
113.935497,
22.637748
],
[
113.935065,
22.636547
],
[
113.935137,
22.635146
],
[
113.936359,
22.633812
],
[
113.93679,
22.632945
],
[
113.936359,
22.632011
],
[
113.935425,
22.631144
],
[
113.93485,
22.629876
],
[
113.935425,
22.628275
],
[
113.937293,
22.627274
],
[
113.937724,
22.62614
],
[
113.938228,
22.625006
],
[
113.938156,
22.623538
],
[
113.937365,
22.622003
],
[
113.936072,
22.619468
],
[
113.935209,
22.618333
],
[
113.935425,
22.616932
],
[
113.937365,
22.614997
],
[
113.937078,
22.613129
],
[
113.936718,
22.611795
],
[
113.936215,
22.611194
],
[
113.935209,
22.610794
],
[
113.933125,
22.610327
],
[
113.932407,
22.609726
],
[
113.932478,
22.608525
],
[
113.9337,
22.606189
],
[
113.934131,
22.605255
],
[
113.934347,
22.601785
],
[
113.934419,
22.600517
],
[
113.935209,
22.599116
],
[
113.935209,
22.598315
],
[
113.934491,
22.597982
],
[
113.933628,
22.597848
],
[
113.932047,
22.595513
],
[
113.931185,
22.593911
],
[
113.931329,
22.592376
],
[
113.931903,
22.590174
],
[
113.932478,
22.589106
],
[
113.933341,
22.588372
],
[
113.934706,
22.587971
],
[
113.93564,
22.587771
],
[
113.936287,
22.587104
],
[
113.936431,
22.586103
],
[
113.935712,
22.584568
],
[
113.934131,
22.580897
],
[
113.932694,
22.579362
],
[
113.929316,
22.577293
],
[
113.924789,
22.573489
],
[
113.922417,
22.571553
],
[
113.922489,
22.569217
],
[
113.922417,
22.562876
],
[
113.913506,
22.556601
],
[
113.908691,
22.552396
],
[
113.905242,
22.55066
],
[
113.900283,
22.549192
],
[
113.898918,
22.548791
],
[
113.894678,
22.545854
],
[
113.894031,
22.546855
],
[
113.891875,
22.547856
],
[
113.889503,
22.54819
],
[
113.886198,
22.547523
],
[
113.883898,
22.545787
],
[
113.883395,
22.547122
],
[
113.882533,
22.547656
],
[
113.881886,
22.547322
],
[
113.881023,
22.546855
],
[
113.880449,
22.547122
],
[
113.880592,
22.54779
],
[
113.880377,
22.548257
],
[
113.880017,
22.54839
],
[
113.877718,
22.550994
],
[
113.87743,
22.551995
],
[
113.87743,
22.55333
],
[
113.876137,
22.554265
],
[
113.875993,
22.555133
],
[
113.87628,
22.556134
],
[
113.875777,
22.556668
],
[
113.875202,
22.557002
],
[
113.874628,
22.557803
],
[
113.873334,
22.558938
],
[
113.872759,
22.557669
],
[
113.871969,
22.557936
],
[
113.871394,
22.557536
],
[
113.879083,
22.532635
],
[
113.874699,
22.530966
],
[
113.874484,
22.530165
],
[
113.86931,
22.528095
],
[
113.864351,
22.543918
],
[
113.865141,
22.544318
],
[
113.860614,
22.558671
],
[
113.861045,
22.559605
],
[
113.858458,
22.561407
],
[
113.861045,
22.56321
],
[
113.860686,
22.563744
],
[
113.857955,
22.562943
],
[
113.856949,
22.563477
],
[
113.856158,
22.563076
],
[
113.855655,
22.563343
],
[
113.855943,
22.56381
],
[
113.855224,
22.56381
],
[
113.854793,
22.564077
],
[
113.857524,
22.567348
],
[
113.856015,
22.569484
],
[
113.854937,
22.569217
],
[
113.853787,
22.570418
],
[
113.851846,
22.56935
],
[
113.847391,
22.575558
],
[
113.849762,
22.57716
],
[
113.849619,
22.578695
],
[
113.842432,
22.584568
],
[
113.831509,
22.592643
],
[
113.828491,
22.595513
],
[
113.8254,
22.60272
],
[
113.824322,
22.605522
],
[
113.822023,
22.604655
],
[
113.817855,
22.610393
],
[
113.818286,
22.611461
],
[
113.81728,
22.61373
],
[
113.810956,
22.617266
],
[
113.806428,
22.622003
],
[
113.798811,
22.633545
],
[
113.796152,
22.638282
],
[
113.789324,
22.65029
],
[
113.780269,
22.665698
],
[
113.778904,
22.669166
],
[
113.778976,
22.671768
],
[
113.774377,
22.675302
],
[
113.775167,
22.676036
],
[
113.779623,
22.67677
],
[
113.779766,
22.678304
],
[
113.776676,
22.682839
],
[
113.777467,
22.683439
],
[
113.776173,
22.686507
],
[
113.775958,
22.687107
],
[
113.77143,
22.68584
],
[
113.765681,
22.693109
],
[
113.765825,
22.694709
],
[
113.764387,
22.700844
],
[
113.768412,
22.701911
],
[
113.766256,
22.708979
],
[
113.767262,
22.710046
],
[
113.766831,
22.712513
],
[
113.764028,
22.712579
],
[
113.763956,
22.714713
],
[
113.763813,
22.71658
],
[
113.763813,
22.72078
],
[
113.764387,
22.723114
],
[
113.767909,
22.724714
],
[
113.766975,
22.733781
],
[
113.767693,
22.738381
],
[
113.769346,
22.742514
],
[
113.771789,
22.744913
],
[
113.778617,
22.748913
],
[
113.783432,
22.752046
],
[
113.793205,
22.755645
],
[
113.798523,
22.759778
],
[
113.800823,
22.763844
],
[
113.800966,
22.768976
],
[
113.800392,
22.771908
],
[
113.798954,
22.774107
],
[
113.799529,
22.775707
],
[
113.801685,
22.778173
],
[
113.803338,
22.779572
],
[
113.807075,
22.780372
],
[
113.808656,
22.781838
],
[
113.808872,
22.784437
],
[
113.808009,
22.787303
],
[
113.807434,
22.788302
],
[
113.808081,
22.789835
],
[
113.809518,
22.790634
],
[
113.811531,
22.789235
],
[
113.812465,
22.787902
],
[
113.814836,
22.787369
],
[
113.818142,
22.788236
],
[
113.820657,
22.790101
],
[
113.821232,
22.7927
],
[
113.820154,
22.794433
],
[
113.82037,
22.795699
],
[
113.821232,
22.796832
],
[
113.823604,
22.797898
],
[
113.825832,
22.797631
],
[
113.828275,
22.797765
],
[
113.830287,
22.798231
],
[
113.831365,
22.799364
],
[
113.832371,
22.800097
],
[
113.832802,
22.800896
],
[
113.832874,
22.801563
],
[
113.833952,
22.801829
],
[
113.834815,
22.802162
],
[
113.834312,
22.804028
],
[
113.837402,
22.803895
],
[
113.839198,
22.805694
],
[
113.84042,
22.806493
],
[
113.841211,
22.80636
],
[
113.842001,
22.805494
],
[
113.843941,
22.806227
],
[
113.844804,
22.808159
],
[
113.846313,
22.810957
],
[
113.847247,
22.813223
],
[
113.847822,
22.816487
],
[
113.848038,
22.81802
],
[
113.848181,
22.824415
],
[
113.847966,
22.826148
],
[
113.847822,
22.826747
],
[
113.847535,
22.827813
],
[
113.847103,
22.830411
],
[
113.8466,
22.831677
],
[
113.8466,
22.833609
],
[
113.846672,
22.83594
],
[
113.847535,
22.838072
],
[
113.850265,
22.839804
],
[
113.852709,
22.842002
],
[
113.856374,
22.843801
],
[
113.858817,
22.843801
],
[
113.86277,
22.842535
],
[
113.865644,
22.840936
],
[
113.8678,
22.841336
],
[
113.870388,
22.841136
],
[
113.873909,
22.841669
],
[
113.877358,
22.842402
],
[
113.879586,
22.843001
],
[
113.879658,
22.845133
],
[
113.879442,
22.846065
],
[
113.879874,
22.846998
],
[
113.880449,
22.847797
],
[
113.879442,
22.850262
],
[
113.879802,
22.851194
],
[
113.880161,
22.85246
],
[
113.879874,
22.853526
],
[
113.88088,
22.854724
],
[
113.881167,
22.855257
],
[
113.882173,
22.856456
],
[
113.883323,
22.858055
],
[
113.884401,
22.858921
],
[
113.884976,
22.85912
],
[
113.886773,
22.858321
],
[
113.886988,
22.860053
],
[
113.887563,
22.860386
],
[
113.887635,
22.85912
],
[
113.887779,
22.857922
],
[
113.889216,
22.857455
],
[
113.889719,
22.856656
],
[
113.890294,
22.856656
],
[
113.890869,
22.857589
],
[
113.891947,
22.858055
],
[
113.892019,
22.860452
],
[
113.89245,
22.860719
],
[
113.893672,
22.860785
],
[
113.894965,
22.862317
],
[
113.89439,
22.863783
],
[
113.895253,
22.863916
],
[
113.895612,
22.863183
],
[
113.895971,
22.86305
],
[
113.895971,
22.862051
],
[
113.897121,
22.862184
],
[
113.898271,
22.862317
],
[
113.899277,
22.861785
],
[
113.900427,
22.860985
],
[
113.901289,
22.860452
],
[
113.90287,
22.860186
],
[
113.903373,
22.859387
],
[
113.902439,
22.859054
],
[
113.900642,
22.858721
],
[
113.900139,
22.859453
],
[
113.89863,
22.860053
],
[
113.898055,
22.860452
],
[
113.896187,
22.860452
],
[
113.895253,
22.860186
],
[
113.893959,
22.859054
],
[
113.895396,
22.858388
],
[
113.897121,
22.858255
],
[
113.898199,
22.857855
],
[
113.898127,
22.856922
],
[
113.89784,
22.85619
],
[
113.897912,
22.855324
],
[
113.898486,
22.855191
],
[
113.898846,
22.853859
],
[
113.900068,
22.852526
],
[
113.902655,
22.851128
],
[
113.903948,
22.849396
],
[
113.905817,
22.848597
],
[
113.90747,
22.848064
],
[
113.909697,
22.847131
],
[
113.911278,
22.847131
],
[
113.913291,
22.846732
],
[
113.915015,
22.846332
],
[
113.916956,
22.845866
],
[
113.918105,
22.845266
],
[
113.917602,
22.844667
],
[
113.917099,
22.844267
],
[
113.915375,
22.843468
],
[
113.913506,
22.842402
],
[
113.911422,
22.842135
],
[
113.909554,
22.841469
],
[
113.907901,
22.84007
],
[
113.905745,
22.838871
],
[
113.904811,
22.837472
],
[
113.904451,
22.835541
],
[
113.904451,
22.832876
],
[
113.904523,
22.829678
],
[
113.905026,
22.82708
],
[
113.904595,
22.826081
],
[
113.90172,
22.825881
],
[
113.89899,
22.826481
],
[
113.897624,
22.826614
],
[
113.896331,
22.827213
],
[
113.894965,
22.82728
],
[
113.894462,
22.827213
],
[
113.894462,
22.826747
],
[
113.894821,
22.825348
],
[
113.894821,
22.824549
],
[
113.893528,
22.822017
],
[
113.889144,
22.810891
],
[
113.889288,
22.808759
],
[
113.88936,
22.807892
],
[
113.888354,
22.806227
],
[
113.887419,
22.804294
],
[
113.885407,
22.801629
],
[
113.883826,
22.80063
],
[
113.880592,
22.799097
],
[
113.878077,
22.797765
],
[
113.875202,
22.796432
],
[
113.873118,
22.795832
],
[
113.870244,
22.795099
],
[
113.868591,
22.795099
],
[
113.866579,
22.794566
],
[
113.865285,
22.793833
],
[
113.865501,
22.792167
],
[
113.865213,
22.791434
],
[
113.865501,
22.789901
],
[
113.865716,
22.788769
],
[
113.866004,
22.786703
],
[
113.86701,
22.78497
],
[
113.866938,
22.784104
],
[
113.867441,
22.782971
],
[
113.866866,
22.781971
],
[
113.867082,
22.780838
],
[
113.866076,
22.780239
],
[
113.866291,
22.778906
],
[
113.866794,
22.77744
],
[
113.8678,
22.77624
],
[
113.868447,
22.77524
],
[
113.871897,
22.774241
],
[
113.872903,
22.773774
],
[
113.872543,
22.771641
],
[
113.875274,
22.770975
],
[
113.877718,
22.770042
],
[
113.878796,
22.768509
],
[
113.880017,
22.766843
],
[
113.881239,
22.76531
],
[
113.881383,
22.763844
],
[
113.883036,
22.762311
],
[
113.883539,
22.756512
],
[
113.88627,
22.754246
],
[
113.88821,
22.752179
],
[
113.889288,
22.750379
],
[
113.88936,
22.747446
],
[
113.888066,
22.744313
],
[
113.886773,
22.742914
],
[
113.887276,
22.740847
],
[
113.887563,
22.738981
],
[
113.889575,
22.738047
],
[
113.88936,
22.735714
],
[
113.888497,
22.732381
],
[
113.888713,
22.729314
],
[
113.888282,
22.726914
],
[
113.888066,
22.724914
],
[
113.888138,
22.722714
],
[
113.886629,
22.721914
],
[
113.885263,
22.721447
],
[
113.884185,
22.721714
],
[
113.881311,
22.72178
],
[
113.881095,
22.721114
],
[
113.880808,
22.719714
],
[
113.881742,
22.71878
],
[
113.882533,
22.717647
],
[
113.88476,
22.716713
],
[
113.884976,
22.715847
],
[
113.884329,
22.713913
],
[
113.883754,
22.711713
],
[
113.885048,
22.710913
],
[
113.885407,
22.709179
],
[
113.886916,
22.707579
],
[
113.88627,
22.705978
],
[
113.886773,
22.702378
],
[
113.887563,
22.700844
],
[
113.88397,
22.69871
],
[
113.883108,
22.69771
],
[
113.883036,
22.695709
],
[
113.884185,
22.693642
],
[
113.885623,
22.692375
],
[
113.886341,
22.691842
],
[
113.888066,
22.691908
],
[
113.891013,
22.693509
],
[
113.893815,
22.694509
],
[
113.895109,
22.694642
],
[
113.898199,
22.694576
],
[
113.902367,
22.694709
],
[
113.903661,
22.696309
],
[
113.903876,
22.697443
],
[
113.904164,
22.698043
],
[
113.904595,
22.698443
],
[
113.903589,
22.70011
],
[
113.904739,
22.699444
],
[
113.905673,
22.699244
],
[
113.906751,
22.698577
],
[
113.908404,
22.698243
],
[
113.910488,
22.69711
],
[
113.911494,
22.69731
],
[
113.911494,
22.69831
],
[
113.910272,
22.699444
],
[
113.910488,
22.700977
],
[
113.910129,
22.701644
],
[
113.908548,
22.701177
],
[
113.907182,
22.700711
],
[
113.90711,
22.701244
],
[
113.907901,
22.702111
],
[
113.90826,
22.702911
],
[
113.907973,
22.703511
],
[
113.9102,
22.703845
],
[
113.910775,
22.704578
],
[
113.910632,
22.705578
],
[
113.91135,
22.706512
],
[
113.911207,
22.709579
],
[
113.912213,
22.710112
],
[
113.913291,
22.710913
],
[
113.91789,
22.711179
],
[
113.919543,
22.711846
],
[
113.921052,
22.712846
],
[
113.922489,
22.71378
],
[
113.924358,
22.71418
],
[
113.927448,
22.714513
],
[
113.930538,
22.714313
],
[
113.934347,
22.713913
],
[
113.937437,
22.713913
],
[
113.939162,
22.713246
],
[
113.94024,
22.711379
],
[
113.941174,
22.710846
],
[
113.941533,
22.711446
],
[
113.942252,
22.712179
],
[
113.943689,
22.712646
],
[
113.944192,
22.711646
],
[
113.944552,
22.710579
],
[
113.946708,
22.709179
],
[
113.948504,
22.709646
],
[
113.948935,
22.710913
],
[
113.94872,
22.712713
],
[
113.94836,
22.713646
],
[
113.949079,
22.71458
],
[
113.950373,
22.715847
],
[
113.953319,
22.71778
],
[
113.957056,
22.718447
],
[
113.958278,
22.719247
],
[
113.958709,
22.720447
],
[
113.959643,
22.721914
],
[
113.960434,
22.722647
],
[
113.963811,
22.723447
],
[
113.964817,
22.723247
],
[
113.966327,
22.722647
],
[
113.966758,
22.721247
],
[
113.967908,
22.720914
],
[
113.969057,
22.721447
],
[
113.969345,
22.722447
],
[
113.970854,
22.72298
],
[
113.971573,
22.721647
],
[
113.972291,
22.719047
],
[
113.973369,
22.71838
],
[
113.975094,
22.71758
],
[
113.977322,
22.71738
],
[
113.979837,
22.71818
],
[
113.981562,
22.719047
],
[
113.982783,
22.719047
],
[
113.98343,
22.718247
],
[
113.98343,
22.716313
],
[
113.983933,
22.71338
],
[
113.983718,
22.712379
],
[
113.983718,
22.711113
],
[
113.983358,
22.710446
],
[
113.983143,
22.708846
],
[
113.982424,
22.706578
],
[
113.981849,
22.705245
],
[
113.981202,
22.704511
],
[
113.98149,
22.701044
],
[
113.982209,
22.699577
],
[
113.982209,
22.69731
],
[
113.982424,
22.695643
],
[
113.982999,
22.694376
],
[
113.983502,
22.690575
],
[
113.983718,
22.689641
],
[
113.98458,
22.68784
],
[
113.984293,
22.686573
],
[
113.980915,
22.684239
],
[
113.979837,
22.683172
],
[
113.979047,
22.681171
],
[
113.979406,
22.680571
],
[
113.976747,
22.677303
],
[
113.976172,
22.675836
],
[
113.975238,
22.674435
],
[
113.97416,
22.672635
],
[
113.973369,
22.669633
],
[
113.973944,
22.665631
],
[
113.974088,
22.663297
],
[
113.974447,
22.660229
],
[
113.973944,
22.657627
],
[
113.974088,
22.655693
],
[
113.973729,
22.654959
]
]
]
]
}
}
]
})
var arr = [
{
name: ‘新乐市场’,
value: [113.894997, 22.557777, { name: ‘hahah’ }]
},
{
name: ‘宝民市场’,
value: [113.907646, 22.55946, { age: 166 }]
},
{
name: ‘开屏市场’,
value: [113.884865, 22.569698, { sex: 2 }]
},
{
name: ‘前进市场’,
value: [113.910004, 22.565941, { a: 123 }]
}
]

    const mfecharts = echarts.init(echart)
    var option = {
        legend: {
            show: false
        },
        tooltip: {
            trigger: 'item',
            formatter: function (e) {
                console.log(e.data); //{name:前进市场,value:[113.910004, 22.565941, { a: 123 }]}
            }
        },
        geo: [
            //重影
            {
                type: 'map',
                map: '宝安区',
                zlevel: -1,
                aspectScale: 1,
                zoom: 0.63,
                layoutCenter: ['50%', '52%'],
                layoutSize: '150%',
                roam: false,
                silent: true,
                itemStyle: {
                    normal: {
                        borderColor: 'rgba(172, 122, 255)',
                        shadowColor: 'rgba(172, 122, 255)',
                        shadowOffsetY: 5,
                        shadowBlur: 15,
                        areaColor: 'rgba(5,21,35,0.1)'
                    }
                }
            },
            {
                map: '宝安区',
                aspectScale: 1,
                zoom: 0.63,
                layoutSize: '150%',
                layoutCenter: ['50%', '52%'],
                itemStyle: {
                    areaColor: '#005DDC',
                    borderColor: '#329BF5',
                    borderWidth: 1
                },
                zlevel: -2,
                silent: true
            }
        ],
        series: [
            // 经纬度散点
            {
                type: 'scatter',
                coordinateSystem: 'geo',
                data: arr, //数据
                showEffectOn: 'emphasis',
                rippleEffect: {
                    brushType: 'stroke'
                },
                hoverAnimation: true,
                symbolSize: 10,
                label: {
                    normal: {
                        formatter: '{b}',
                        position: 'right',
                        show: false
                    },
                    emphasis: {
                        show: false
                    }
                },
                itemStyle: {
                    normal: {
                        color: function (e) {  //这里通过值返回颜色值
                            if (e.value[2].sex) {
                                return 'yellow'
                            } else {
                                return 'red'
                            }
                        }
                    }
                }
            },
            {

                type: 'map',
                coordinateSystem: 'geo',
                map: '宝安区', // 自定义扩展图表类型 latitude: "22.578381"longitude: "113.88459"
                aspectScale: 1,
                zoom: 0.63, //缩放
                itemStyle: {
                    normal: {
                        areaColor: {
                            type: 'linear-gradient',
                            x: 0,
                            y: 300,
                            x2: 0,
                            y2: 0,
                            colorStops: [
                                {
                                    offset: 0,
                                    color: '#56CCFB' // 0% 处的颜色
                                },
                                {
                                    offset: 1,
                                    color: '#0160AD' // 100% 处的颜色
                                }
                            ],
                            global: false // 缺省为 false
                        },
                        borderColor: '#37C1FD',
                        borderWidth: 2
                    },
                    emphasis: {
                        show: true,
                        borderWidth: 3,
                        borderColor: 'rgba(255,215,0,0.2)',
                        areaColor: 'rgba(255,215,0,1)'
                    }
                },
                layoutCenter: ['50%', '50%'], // 地图的缩放
                layoutSize: '150%',
                markPoint: {
                    symbol: 'none'
                }
            }
        ]
    }
    mfecharts.setOption(option, true)