How can I plot a million markers on a sheet without a browser not responsive?
2 answers
You can try Leaflet Marker Cluster to calculate more than 4 markers flaws (not millions of markers :-))
#map {
width: 800px;
height: 600px;
border: 1px solid #ccc;
}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.3/leaflet.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.3/leaflet.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.0.3/dist/MarkerCluster.css" />
<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.0.3/dist/MarkerCluster.Default.css" />
<script src="https://unpkg.com/leaflet.markercluster@1.0.3/dist/leaflet.markercluster-src.js"></script>
<script>
var addressPoints = [
[-37.8133062833, 175.2721598, "3"],
[-37.7650657333, 175.30196635, "6"],
[-37.7635318, 175.3017915, "32"],
[-37.76501495, 175.30214865, "8"],
[-37.7626951333, 175.30102495, "33"],
[-37.7628413, 175.3011039167, "31"],
[-37.7252768667, 175.2858272833, "39"],
[-37.7251813, 175.2860325833, "41"],
[-37.7253529667, 175.28606595, "40"],
[-37.72613405, 175.2825743, "4"],
[-37.7260856167, 175.2830322, "8"],
[-37.7258475833, 175.2823754667, "3"],
[-37.7258087333, 175.2855237167, "30"],
[-37.7259408167, 175.2841378667, "16"],
[-37.7252846667, 175.2853744167, "35"],
[-37.7252901, 175.2849533833, "31"],
[-37.7251719333, 175.2845442167, "27"],
[-37.7257350667, 175.2834726333, "15"],
[-37.72551855, 175.2829995667, "11"],
[-37.7258122333, 175.282854, "7"],
[-37.72609895, 175.2827986333, "6"],
[-37.7258737167, 175.28217635, "1"],
[-37.7258311333, 175.2825961667, "5"],
[-37.725612, 175.2828941667, "9"],
[-37.7260252333, 175.2834950167, "12"],
[-37.7258516333, 175.2843625333, "18"],
[-37.7252865167, 175.2856084833, "37"],
[-37.72552805, 175.28440285, "21"],
[-37.7260591667, 175.2832461833, "10"],
[-37.7257771167, 175.2831591833, "13"],
[-37.7256427, 175.2840918167, "19"],
[-37.7252874667, 175.28515965, "33"],
[-37.7253612667, 175.2847015333, "29"],
[-37.7253173333, 175.28437885, "23"],
[-37.7255606833, 175.285023, "24"],
[-37.7255772167, 175.2855245333, "32"],
[-37.7251607833, 175.28435025, "25"],
[-37.7256776333, 175.2858937667, "34"],
[-37.7255147667, 175.2860862, "38"],
[-37.7255604167, 175.2852782667, "26"],
[-37.7258475, 175.2853665167, "28"],
[-37.7256432167, 175.28479385, "22"],
[-37.7261499167, 175.2823003833, "2"],
[-37.7827152167, 175.2669377333, "8"],
[-37.7826653167, 175.2651315333, "19"],
[-37.7824514333, 175.2661956, "1/14-4/14"],
[-37.7826543333, 175.2665598, "10"],
[-37.7825191, 175.2655053833, "20"],
[-37.78283245, 175.2655798167, "15"],
[-37.7825732333, 175.2659369333, "16"],
[-37.7831668, 175.2677692, "1"],
[-37.7824864833, 175.2653481667, "22"],
[-37.7831375667, 175.2675576, "3"],
[-37.78311335, 175.2673731667, "5"],
[-37.7829425, 175.2661583667, "9"],
[-37.7824919333, 175.26519525, "24"],
[-37.7823427, 175.2655492667, "1/20-6/20"],
[-37.7826039667, 175.2661666667, "14"],
[-37.7823595, 175.2664568, "12"],
[-37.78260965, 175.2669722167, "8B"],
[-37.7829082167, 175.2659751167, "11"],
[-37.7826221833, 175.26637085, "12A"],
[-37.7828835, 175.2657931667, "13"],
[-37.7827837833, 175.2653184167, "17"],
[-37.7825404167, 175.2657024167, "18"],
[-37.7825830667, 175.266866, "8A"],
[-37.7826210667, 175.26709865, "8C"],
[-37.78309715, 175.26719625, "7"],
[-37.7824794833, 175.2666219, "1/10-8/10"],
[-37.7597504833, 175.2538294167, "1/4"],
[-37.7606522, 175.2539928833, "9A"],
[-37.7603274167, 175.2536633833, "11"],
[-37.7595836167, 175.25372635, "2/4"],
[-37.7596923167, 175.2539812167, "2"],
[-37.760061, 175.2541011333, "3"],
[-37.7601809333, 175.2539225667, "5"],
[-37.7598443, 175.2536890833, "6"],
[-37.7603764, 175.25413965, "7B"],
[-37.760479, 175.2540011833, "7"],
[-37.75995195, 175.2535132333, "8"],
[-37.7605351667, 175.2538995333, "9"],
[-37.8142647167, 175.29588845, "10A"],
[-37.8141523333, 175.2956623667, "10B"],
[-37.8145259, 175.2959641, "5"],
[-37.8144401167, 175.2958561667, "7"],
[-37.814215, 175.2961794833, "6"],
[-37.8144337833, 175.2962903333, "4"],
[-37.81415115, 175.2955115667, "11"],
[-37.8141950167, 175.2960154, "8"],
[-37.8143154333, 175.2956368333, "9"],
[-37.81463225, 175.2961358, "3"],
[-37.8145120667, 175.2964456333, "2"],
[-37.7267252, 175.24639565, "1"],
[-37.7267363, 175.24607095, "2"],
[-37.7272662667, 175.2464523833, "7"],
[-37.7268794167, 175.2464094833, "3"],
[-37.7270709667, 175.24641145, "5"],
[-37.7272869167, 175.2462229333, "9"],
[-37.7273377333, 175.2459922833, "11"],
[-37.7272791167, 175.2458228, "10"],
[-37.7272242333, 175.2456467, "8"],
[-37.7270979667, 175.2458302667, "6"],
[-37.7269099667, 175.2460811333, "4"],
[-37.7269516667, 175.26654195, "19"],
[-37.7272433667, 175.2688282167, "20"],
[-37.7272086, 175.26856935, "18"],
[-37.7270515167, 175.2663482, "17"],
[-37.7269029167, 175.2684720333, "37"],
[-37.7269129667, 175.2687034167, "39"],
[-37.7270226833, 175.269985, "49"],
[-37.7273227833, 175.27040065, "32"],
[-37.7269961667, 175.2697445667, "47"],
[-37.7277992333, 175.26607075, "10A"],
[-37.7267754833, 175.2668876, "23"],
[-37.7269725833, 175.2695108833, "45"],
[-37.7270770833, 175.2704350667, "53"],
[-37.7270976833, 175.2706593, "55"],
[-37.72769385, 175.26626005, "12B"],
[-37.7273659833, 175.2657939833, "11"],
[-37.7275722833, 175.2659764, "10"],
[-37.7278991667, 175.264895, "1"],
[-37.7270492, 175.2670066667, "16"],
[-37.7272566, 175.2659714833, "13"],
[-37.7271470333, 175.2661578333, "15"],
[-37.7268324667, 175.2677899167, "31"],
[-37.7268681167, 175.2680062167, "33"],
[-37.72689075, 175.2682406167, "35"],
[-37.7269306833, 175.2689642833, "41"],
[-37.72696875, 175.269263, "43"],
[-37.7280193667, 175.2652022667, "2"],
[-37.7278003, 175.2650767167, "3"],
[-37.7277980833, 175.2656216667, "6"],
[-37.7274714833, 175.2661344, "12A"],
[-37.7272278, 175.2690721167, "22"],
[-37.7279022167, 175.26542265, "4"],
[-37.7276824667, 175.2652469167, "5"],
[-37.7268506333, 175.266725, "21"],
[-37.72681425, 175.2673108, "27"],
[-37.7267847667, 175.26708975, "25"],
[-37.7268163333, 175.2675368833, "29"],
[-37.7272382167, 175.2692983333, "24"],
[-37.7270493, 175.27021985, "51"],
[-37.7275880333, 175.2654261, "7"],
[-37.7274762, 175.2656128333, "9"],
[-37.7276818833, 175.2657883, "8"],
[-37.7597651667, 175.2605711667, "6"],
[-37.76018805, 175.2609881, "2"],
[-37.7602787167, 175.2614594333, "2A"],
[-37.7601363333, 175.2614756833, "2B"],
[-37.7599083333, 175.26127835, "4B"],
[-37.7600629667, 175.2613225667, "4A"],
[-37.7591153333, 175.2608816, "9"],
[-37.7594763, 175.2604528333, "3"],
[-37.7595980167, 175.2607975, "10"],
[-37.7592820333, 175.2612282667, "14A"],
[-37.7594027667, 175.2613270333, "14B"],
[-37.7589391833, 175.2613034833, "13"],
[-37.7589293667, 175.2614704, "15"],
[-37.7594669333, 175.26142695, "16"],
[-37.7595715, 175.2603478, "1"],
[-37.7587638667, 175.2617398, "17"],
[-37.75928755, 175.2615212167, "18"],
[-37.7590696333, 175.26160655, "20"],
[-37.76004645, 175.2609580333, "4"],
[-37.7593509167, 175.2605798667, "5"],
[-37.7599710167, 175.2607496667, "6A"],
[-37.75922275, 175.2607182667, "7"],
[-37.7597137667, 175.2612152667, "8"],
[-37.7590570667, 175.26111555, "11"],
[-37.75938005, 175.2610309167, "12"],
[-37.8094496333, 175.29109025, "8A"],
[-37.8096383, 175.2908512833, "6A"],
[-37.8095118833, 175.2907225, "6"],
[-37.8095745, 175.2903304333, "2"],
[-37.8091726, 175.2911845333, "10A"],
[-37.8093263, 175.2908983333, "10"],
[-37.8093507333, 175.2901929667, "1"],
[-37.8093190333, 175.2903236333, "3"],
[-37.8095235833, 175.29050985, "4"],
[-37.8092396833, 175.2904833667, "5"],
[-37.80915545, 175.2906272167, "7"],
[-37.8094314667, 175.2908612, "8"],
[-37.8092101333, 175.2908132833, "9"],
[-37.7533304667, 175.2494180833, "43"],
[-37.7526352, 175.2483552333, "42"],
[-37.7545179333, 175.2496692833, "62"],
[-37.7543923667, 175.2495332667, "62A"],
[-37.7534358667, 175.2504690667, "9"],
[-37.75329495, 175.2497042167, "15A"],
[-37.7540200167, 175.2497675667, "53B"],
[-37.7535320667, 175.2498621167, "49"],
[-37.75358825, 175.2496730833, "49A"],
[-37.7532715667, 175.2495825167, "43A"],
[-37.7530439333, 175.24837735, "35A"],
[-37.7531751167, 175.2483719, "35B"],
[-37.7527424167, 175.24818575, "44"],
[-37.75283325, 175.2480310333, "46"],
[-37.7535719333, 175.2492009333, "45"],
[-37.7540046167, 175.2504339167, "70"],
[-37.75249145, 175.250112, "24A"],
[-37.7538706667, 175.2509267, "5A"],
[-37.7541943667, 175.2492624667, "58"],
[-37.7540283833, 175.2491471, "56"],
[-37.75237835, 175.2499499, "26"],
[-37.75370355, 175.2502355167, "59"],
[-37.7526963167, 175.24923805, "25C"],
[-37.7527793833, 175.2504055667, "18"],
[-37.75318385, 175.2502221167, "13"],
[-37.7543455667, 175.2493899667, "60"],
[-37.7531738833, 175.2486192, "35C"],
[-37.7530230667, 175.2486677, "35E"],
[-37.7530415667, 175.2476700333, "48B"],
[-37.7543446667, 175.2497958833, "64"],
[-37.7541102167, 175.2501747, "68"],
[-37.7542193167, 175.2499942667, "66"],
[-37.7524716, 175.2484220833, "40B"],
[-37.7525259167, 175.24859275, "40A"],
[-37.75304995, 175.24791705, "48A"],
[-37.7533106, 175.2503497833, "11"],
[-37.7535395667, 175.25122055, "10"],
[-37.7530557, 175.2505998333, "14"],
[-37.7534549833, 175.2510777667, "12"],
[-37.7532645, 175.2498790167, "15"],
[-37.7529169167, 175.2505167333, "16"],
[-37.7530122, 175.2501154167, "17"],
[-37.7528793667, 175.2500031, "19"],
[-37.7524861667, 175.250491, "20A"],
[-37.7525711833, 175.25061535, "20B"],
[-37.7527637, 175.2498751667, "21"],
[-37.7526454833, 175.2502624667, "22"],
[-37.7540655667, 175.25139255, "1"],
[-37.7528507167, 175.2495407833, "23"],
[-37.75266675, 175.2490152167, "29"],
[-37.7521746833, 175.24958125, "30"],
[-37.7527662667, 175.2488566833, "31"],
[-37.7520474667, 175.2491321333, "32A"],
[-37.7519347667, 175.2493122333, "32B"],
[-37.7519778, 175.24944285, "32C"],
[-37.7521468667, 175.249391, "32D"],
[-37.75304875, 175.2489884333, "33"],
[-37.7521923833, 175.2490508167, "34"],
[-37.7522956333, 175.24890365, "36"],
[-37.7532920167, 175.2486579167, "37"],
[-37.75239395, 175.2487506167, "38"],
[-37.75335085, 175.24882495, "39"],
[-37.7534400667, 175.24903275, "41"],
[-37.7539658833, 175.2512702167, "3"],
[-37.7536349, 175.2487029667, "50"],
[-37.7538621, 175.2494562, "51"],
[-37.7537511333, 175.2488972667, "52"],
[-37.7540289, 175.2495731, "53"],
[-37.7538807833, 175.2490229333, "54"],
[-37.7538779333, 175.24998435, "55A"],
[-37.7537814, 175.2497839333, "55B"],
[-37.7537928333, 175.2501063833, "57"],
[-37.7538317833, 175.25161815, "4"],
[-37.7539651, 175.2505948667, "72"],
[-37.7538675, 175.2511449833, "5"],
[-37.7535527833, 175.2515935333, "6"],
[-37.7529532333, 175.2496368167, "23B"],
[-37.7528883833, 175.2492822833, "27A"],
[-37.7529762333, 175.2493908, "27B"],
[-37.7524936667, 175.2493519833, "25B"],
[-37.7525876667, 175.2491184, "25A"],
[-37.7527940667, 175.2493274333, "25D"],
[-37.7529821167, 175.2476663833, "48C"],
[-37.7529520833, 175.2478886333, "48D"],
[-37.7526021333, 175.2496809833, "25"],
[-37.7524205833, 175.2502557167, "24"],
[-37.7537035833, 175.2493436, "47"],
[-37.7535693, 175.2506006667, "7"],
[-37.75362475, 175.2513740333, "8"],
[-37.7529255833, 175.2485607333, "35D"],
[-37.7406592, 175.2541540333, "20"],
[-37.73970635, 175.2542623167, "2"],
[-37.7408172333, 175.2542480667, "22"],
[-37.7401503, 175.25436535, "1"],
[-37.7413353, 175.2546195333, "17"],
[-37.7404642833, 175.2540473833, "18"],
[-37.7402663667, 175.25397305, "16"],
[-37.7399413667, 175.2535634167, "10"],
[-37.741079, 175.2547560667, "11"],
[-37.7400583667, 175.2533637167, "12"],
[-37.7412374833, 175.25481145, "13"],
[-37.7400478333, 175.2539777167, "14"],
[-37.7414328, 175.2548579333, "15"],
[-37.73943015, 175.2540313667, "4"],
[-37.7405255667, 175.2544956, "5"],
[-37.7398022833, 175.2540526167, "6"],
[-37.74070675, 175.2545902667, "7"],
[-37.7398755667, 175.2537977833, "8"],
[-37.7408881667, 175.254673, "9"],
[-37.7403441833, 175.2544100333, "3"],
[-37.7388455667, 175.2626767167, "62/3"],
[-37.7372424667, 175.2626006167, "24/3"],
[-37.7387254833, 175.2626415667, "61/3"],
[-37.73830135, 175.2624793833, "57/3"],
[-37.7374028667, 175.2620363833, "16/3"],
[-37.7370862667, 175.26191675, "13/3"],
[-37.7374895833, 175.2632328667, "32/3"],
[-37.7373917333, 175.2631711333, "31/3"],
[-37.7376033167, 175.2632756167, "33/3"],
[-37.7368605333, 175.2629430333, "3/3"],
[-37.7377045, 175.26332575, "34/3"],
[-37.7379133667, 175.2632624, "43/3"],
[-37.7379307833, 175.26316935, "44/3"],
[-37.7379521833, 175.2624367, "53/3"],
[-37.7380988833, 175.2623830167, "55/3"],
[-37.73761405, 175.2621603333, "18/3"],
[-37.73750525, 175.2629252167, "35/3"],
[-37.73791505, 175.2625837167, "54/3"],
[-37.7384692333, 175.2628984, "66/3"],
[-37.7376195667, 175.2624920833, "49/3"],
[-37.7378294667, 175.26282665, "42/3"],
[-37.73799185, 175.2629139, "46/3"],
[-37.737702, 175.262998, "37/3"],
[-37.7375974, 175.26296335, "36/3"],
[-37.7370049833, 175.2629984833, "2/3"],
[-37.7367591, 175.2629045833, "4/3"],
[-37.7371307833, 175.2630572333, "1/3"],
[-37.7379644167, 175.2630417333, "45/3"],
[-37.7373141, 175.2633483333, "1"],
[-37.73663385, 175.2626703333, "6/3"],
[-37.7375158167, 175.2627149167, "39/3"],
[-37.7373195667, 175.2623184, "28/3"],
[-37.7366752333, 175.2621685, "9/3"],
[-37.7366931333, 175.2620520667, "10/3"],
[-37.7368461167, 175.2619946833, "11/3"],
[-37.73694355, 175.2619276667, "12/3"],
[-37.73718485, 175.2619434, "14/3"],
[-37.7373047667, 175.26198635, "15/3"],
[-37.7375193667, 175.2620948167, "17/3"],
[-37.7370616333, 175.2622085, "30/3"],
[-37.7371940167, 175.26224795, "29/3"],
[-37.7374514, 175.2623851333, "27/3"],
[-37.73701605, 175.26246445, "26/3"],
[-37.7371355833, 175.2625268833, "25/3"],
[-37.73733795, 175.2626271667, "23/3"],
[-37.7366885667, 175.2624224833, "8/3"],
[-37.7368083167, 175.2624732333, "7/3"],
[-37.7376435, 175.26238365, "50/3"],
[-37.7377576, 175.2622586833, "51/3"],
[-37.7378621333, 175.2622972167, "52/3"],
[-37.7381938833, 175.26243295, "56/3"],
[-37.73840285, 175.2625139333, "58/3"],
[-37.7385259667, 175.2625530833, "59/3"],
[-37.7381541, 175.2627086, "63/3"],
[-37.7382732833, 175.2627866333, "64/3"],
[-37.73838385, 175.2628331667, "65/3"],
[-37.7386233667, 175.2629346667, "67/3"],
[-37.7387464, 175.2629777167, "68/3"],
[-37.7367412333, 175.2627206667, "5/3"],
[-37.7369866833, 175.2626858333, "22/3"],
[-37.7382063667, 175.2630262833, "48/3"],
[-37.7381730667, 175.2631383167, "47/3"],
[-37.73863995, 175.2631809667, "69/3"],
[-37.73876925, 175.2632203167, "70/3"],
[-37.7377186, 175.2627957, "41/3"],
[-37.7386056333, 175.2625947167, "60/3"],
[-37.73780955, 175.2630405333, "38/3"],
[-37.7375927167, 175.26274085, "40/3"],
[-37.7372908167, 175.26280895, "19/3"],
[-37.7371831167, 175.2627742, "20/3"],
[-37.73706645, 175.26272355, "21/3"],
[-37.7848857333, 175.2653156167, "3"],
[-37.7846897, 175.2649621833, "2"],
[-37.7848253333, 175.2649359833, "4"],
[-37.7849487333, 175.26489275, "6"],
[-37.78521955, 175.2648237167, "10"],
[-37.7854084333, 175.2648019167, "12"],
[-37.7847416667, 175.2653472667, "1"],
[-37.78507545, 175.2648510167, "8"],
[-37.7851414167, 175.2652587, "7-9"],
[-37.7810749167, 175.2260865833, "28"],
[-37.7812585833, 175.2260324333, "22"],
[-37.7816422167, 175.2264606, "14"],
[-37.7814536667, 175.2249716667, "19"],
[-37.7813703667, 175.2248887, "21"],
[-37.7806153833, 175.2258977167, "38A"],
[-37.7813339667, 175.2249035167, "23"],
[-37.7818254167, 175.2261700667, "10"],
[-37.75828075, 175.3046800333, "55"],
[-37.8177078167, 175.28656555, "36"],
[-37.7776995, 175.2232183667, "68"],
[-37.7739027667, 175.2264543333, "4"],
[-37.7777290667, 175.22495975, "52"],
[-37.7736832833, 175.2267423833, "1"],
[-37.7793876167, 175.2209870667, "99"],
[-37.7776858167, 175.2245548833, "56"],
[-37.7797406667, 175.2207979833, "103"],
[-37.77767585, 175.2243799833, "58"],
[-37.77990535, 175.2207323333, "105"],
[-37.7784736333, 175.2221205167, "80"],
[-37.7777384167, 175.2251824667, "50"],
[-37.7785325167, 175.2218720833, "82"],
[-37.7780789, 175.2226019167, "74"],
[-37.7786049333, 175.2225454667, "83"],
[-37.7790482167, 175.2205042167, "94"],
[-37.77877555, 175.2221031167, "87"],
[-37.7789347, 175.2209618, "90"],
[-37.77883645, 175.2218758333, "89"],
[-37.7792706333, 175.2206462, "96"],
[-37.7780605167, 175.2256446167, "47"],
[-37.7778262833, 175.2261931833, "41"],
[-37.7780589833, 175.2254904, "49"],
[-37.77953265, 175.2200974667, "102"],
[-37.7783669833, 175.2255023167, "51"],
[-37.77771785, 175.2247485833, "54"],
[-37.7780063667, 175.2257931167, "45"],
[-37.7777639667, 175.2230532, "70"],
[-37.7757195, 175.2275160667, "21"],
[-37.77911685, 175.2212834833, "95"],
[-37.7760025333, 175.2271657333, "22"],
[-37.7777111167, 175.2263709333, "39"],
[-37.7758996167, 175.2275354, "23"],
[-37.7788214833, 175.2211284667, "88"]
];
</script>
<div id="map"></div>
<span>Mouse over a cluster to see the bounds of its children and click a cluster to zoom to those bounds</span>
<script type="text/javascript">
var tiles = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
maxZoom: 12,
attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors, Points © 2012 LINZ'
}),
latlng = L.latLng(-37.82, 175.24);
var map = L.map('map', {center: latlng, zoom: 13, layers: [tiles]});
var markers = L.markerClusterGroup();
for (var i = 0; i < addressPoints.length; i++) {
var a = addressPoints[i];
var title = a[2];
var marker = L.marker(new L.LatLng(a[0], a[1]), { title: title });
marker.bindPopup(title);
markers.addLayer(marker);
}
map.addLayer(markers);
</script>
+1
source to share