{"theJson":"var af = null;\nvar el = null;\nvar p = null;\nvar m = null;\nvar gj = null;\nvar counter = 0;\nvar bearing = 0;\n\nvar trackNav = '\/img\/navigation.png';\nvar trackDot = '\/img\/dot-black.gif';\nvar currentStyle = map.getStyle();\n\nif (currentStyle !== undefined && currentStyle != null && JSON.stringify(currentStyle).indexOf(\"satellite-\") != -1) {\n trackNav = '\/img\/navigation-yellow.png';\n trackDot = '\/img\/dot-yellow.gif';\n}\n\nvar picList = $('#trip-pics-list');\npicList.html('

<\/i><\/p>

Loading Previews...<\/p>');\nvar plHtml = '';\n\n gj = {\"type\":\"Feature\",\"geometry\":{\"type\":\"LineString\",\"coordinates\":[[\"-96.71849\",\"33.08507\",229.7],[\"-96.71849\",\"33.08505\",229.8],[\"-96.71250\",\"33.08412\",221.2],[\"-96.71081\",\"33.08655\",217.9],[\"-96.67932\",\"33.10218\",227.1],[\"-96.67808\",\"33.10205\",230.7],[\"-96.63932\",\"33.18887\",192.2],[\"-96.59259\",\"33.27791\",216],[\"-96.58367\",\"33.36034\",257.8],[\"-96.60900\",\"33.45832\",256.5],[\"-96.60484\",\"33.55905\",262],[\"-96.61340\",\"33.64495\",239.2],[\"-96.59232\",\"33.70954\",230.9],[\"-96.59119\",\"33.70953\",236.2],[\"-96.59229\",\"33.70770\",234.5],[\"-96.59196\",\"33.70569\",243.1],[\"-96.56721\",\"33.66007\",254.5],[\"-96.45335\",\"33.64537\",206.9],[\"-96.34534\",\"33.61350\",226.1],[\"-96.23079\",\"33.60395\",219.2],[\"-96.11488\",\"33.60584\",206.4],[\"-95.99942\",\"33.60869\",218.8],[\"-95.88533\",\"33.59455\",223.8],[\"-95.78088\",\"33.62124\",210.4],[\"-95.67144\",\"33.64524\",206.2],[\"-95.59404\",\"33.67594\",183.5],[\"-95.51040\",\"33.66245\",184.8],[\"-95.46191\",\"33.66328\",193.2],[\"-95.37615\",\"33.66219\",184.5],[\"-95.27419\",\"33.66108\",167.5],[\"-95.18297\",\"33.63279\",142],[\"-95.08048\",\"33.61280\",145.5],[\"-94.99949\",\"33.60564\",142.2],[\"-94.89987\",\"33.58488\",122.7],[\"-94.79276\",\"33.55977\",168],[\"-94.70146\",\"33.54194\",151.6],[\"-94.61644\",\"33.50868\",139.1],[\"-94.52664\",\"33.48943\",136.2],[\"-94.44947\",\"33.47412\",140.7],[\"-94.33764\",\"33.46820\",123.2],[\"-94.22733\",\"33.46736\",120.9],[\"-94.11754\",\"33.45249\",104.5],[\"-94.06536\",\"33.43488\",124.5],[\"-94.04721\",\"33.42087\",113],[\"-94.04936\",\"33.41667\",116.7],[\"-94.03055\",\"33.40966\",114.7],[\"-94.03043\",\"33.40863\",125.7],[\"-94.03201\",\"33.38520\",99.5],[\"-94.04761\",\"33.42454\",111.1],[\"-94.06184\",\"33.43453\",121.6],[\"-94.06254\",\"33.43461\",126.1],[\"-94.06291\",\"33.43421\",118.4],[\"-94.08002\",\"33.40124\",102.3],[\"-94.13766\",\"33.35216\",80.5],[\"-94.15289\",\"33.26642\",102.9],[\"-94.15198\",\"33.17320\",114.9],[\"-94.15473\",\"33.15084\",120.2],[\"-94.19308\",\"33.10804\",95.9],[\"-94.20632\",\"33.10375\",109.6],[\"-94.29211\",\"33.05315\",88.4],[\"-94.36280\",\"33.00158\",126.7],[\"-94.36616\",\"32.91378\",134.1],[\"-94.36157\",\"32.82252\",101.4],[\"-94.35501\",\"32.74840\",64.8],[\"-94.34533\",\"32.65829\",102.7],[\"-94.34627\",\"32.57475\",131],[\"-94.35161\",\"32.52769\",110.6],[\"-94.35789\",\"32.47265\",111.1],[\"-94.34591\",\"32.38016\",84.8],[\"-94.35040\",\"32.28621\",95],[\"-94.34014\",\"32.19350\",82.9],[\"-94.33531\",\"32.14539\",97.3],[\"-94.30561\",\"32.06317\",72.6],[\"-94.23943\",\"31.98822\",90.8],[\"-94.21995\",\"31.90127\",87.8],[\"-94.19746\",\"31.81493\",124.9],[\"-94.18505\",\"31.79012\",108.5],[\"-94.18503\",\"31.79014\",93.8],[\"-94.18441\",\"31.78924\",116.8],[\"-94.16959\",\"31.71833\",92.6],[\"-94.15050\",\"31.62794\",138.7],[\"-94.13300\",\"31.56341\",139.6],[\"-94.12680\",\"31.52080\",110.6],[\"-94.08816\",\"31.43948\",113],[\"-94.02947\",\"31.36699\",108.5],[\"-93.99255\",\"31.28422\",94.7],[\"-93.98080\",\"31.20168\",57.4],[\"-93.97960\",\"31.15165\",65.5],[\"-93.98512\",\"31.06848\",125.2],[\"-93.98824\",\"30.97574\",122.6],[\"-93.99670\",\"30.91516\",75.4],[\"-93.97700\",\"30.85128\",96.6],[\"-93.94387\",\"30.76274\",72.5],[\"-93.89358\",\"30.67908\",27.9],[\"-93.90824\",\"30.61683\",36.7],[\"-93.93997\",\"30.52636\",29.4],[\"-93.96880\",\"30.44275\",17.6],[\"-93.94124\",\"30.39109\",8.7],[\"-93.91430\",\"30.30640\",5.3],[\"-93.88285\",\"30.22370\",-0.6],[\"-93.83819\",\"30.15995\",-0.7],[\"-93.82137\",\"30.11469\",-8.9],[\"-93.82169\",\"30.06998\",5],[\"-93.84538\",\"30.02194\",-3.9],[\"-93.88322\",\"29.95104\",-0.9],[\"-93.96189\",\"29.91164\",-1.7],[\"-93.96332\",\"29.86670\",-7.4],[\"-93.95414\",\"29.87138\",-4.9],[\"-93.95413\",\"29.87129\",3.3],[\"-93.95572\",\"29.87006\",0.9],[\"-94.00621\",\"29.88595\",-1.3],[\"-94.09978\",\"29.85619\",-1.2],[\"-94.20446\",\"29.83326\",1.9],[\"-94.31225\",\"29.82571\",3.9],[\"-94.38415\",\"29.81788\",15.7],[\"-94.37640\",\"29.75038\",2.4],[\"-94.37266\",\"29.65704\",2.1],[\"-94.39895\",\"29.57045\",-3.4],[\"-94.44772\",\"29.52763\",5.2],[\"-94.53555\",\"29.49556\",6.9],[\"-94.61738\",\"29.46562\",-3.8],[\"-94.65808\",\"29.44707\",0.3],[\"-94.72339\",\"29.40240\",-1.9],[\"-94.77766\",\"29.36368\",3.8],[\"-94.77874\",\"29.36300\",6.2],[\"-94.77931\",\"29.36171\",21.4],[\"-94.78015\",\"29.35507\",-45.7],[\"-94.77486\",\"29.33429\",10.4],[\"-94.77391\",\"29.32805\",4.5],[\"-94.77019\",\"29.31997\",2.5],[\"-94.80485\",\"29.29687\",-1.8],[\"-94.81069\",\"29.29543\",4.1],[\"-94.81066\",\"29.29543\",1.4],[\"-94.81177\",\"29.29505\",3.1],[\"-94.83177\",\"29.28974\",3.5],[\"-94.90047\",\"29.30283\",9.3],[\"-94.96390\",\"29.33264\",5.3],[\"-95.02068\",\"29.34978\",7.2],[\"-95.07897\",\"29.31548\",2.8],[\"-95.14393\",\"29.27121\",2.5],[\"-95.19098\",\"29.22802\",4.2],[\"-95.25374\",\"29.17422\",0.2],[\"-95.33318\",\"29.14378\",2.7],[\"-95.39732\",\"29.12792\",6.4],[\"-95.45089\",\"29.12852\",13.4],[\"-95.45479\",\"29.16386\",3.1],[\"-95.45552\",\"29.16311\",5.5],[\"-95.53967\",\"29.14654\",11.3],[\"-95.62800\",\"29.14317\",14],[\"-95.67086\",\"29.14578\",14.8],[\"-95.72078\",\"29.08836\",4.8],[\"-95.80920\",\"29.06754\",7.5],[\"-95.87644\",\"29.02995\",19],[\"-95.93140\",\"28.98813\",14.7],[\"-95.96630\",\"28.98312\",17],[\"-96.03007\",\"28.97388\",22.4],[\"-96.09654\",\"28.93017\",14.1],[\"-96.18353\",\"28.88567\",9.5],[\"-96.22443\",\"28.93798\",20.3],[\"-96.32585\",\"28.94159\",14.5],[\"-96.42483\",\"28.95200\",17.8],[\"-96.52032\",\"28.95285\",15.3],[\"-96.61933\",\"28.96028\",14.8],[\"-96.65407\",\"28.97466\",24.3],[\"-96.72489\",\"28.93926\",16.8],[\"-96.81757\",\"28.89429\",20.4],[\"-96.90295\",\"28.84149\",31.1],[\"-96.96643\",\"28.77626\",34.3],[\"-96.96627\",\"28.77825\",36.6],[\"-96.96630\",\"28.77812\",34.2],[\"-96.96681\",\"28.77742\",30.3],[\"-97.03800\",\"28.72133\",29.1],[\"-97.04600\",\"28.62843\",27.5],[\"-97.04304\",\"28.53403\",14.4],[\"-97.10952\",\"28.46274\",22.1],[\"-97.18320\",\"28.39405\",16.9],[\"-97.25671\",\"28.33095\",17.1],[\"-97.29205\",\"28.28452\",16.7],[\"-97.35556\",\"28.21272\",13.8],[\"-97.41772\",\"28.13568\",18.1],[\"-97.48836\",\"28.06901\",24.4],[\"-97.54166\",\"27.99699\",11.8],[\"-97.58975\",\"27.94246\",17.6],[\"-97.62396\",\"27.88014\",0],[\"-97.64853\",\"27.79797\",17.8],[\"-97.71151\",\"27.72622\",18.3],[\"-97.75503\",\"27.66248\",16.7],[\"-97.78621\",\"27.58414\",13.8],[\"-97.84113\",\"27.52959\",11.5],[\"-97.84188\",\"27.52990\",12.4],[\"-97.84118\",\"27.52859\",14],[\"-97.85860\",\"27.44669\",8.1],[\"-97.83364\",\"27.36119\",6.4],[\"-97.80595\",\"27.28257\",5.5],[\"-97.79236\",\"27.19188\",4],[\"-97.79024\",\"27.09874\",3.6],[\"-97.79496\",\"27.00536\",4.9],[\"-97.79097\",\"26.91221\",2.9],[\"-97.78030\",\"26.81951\",0.1],[\"-97.76946\",\"26.72598\",-0.5],[\"-97.76754\",\"26.63018\",0.5],[\"-97.77521\",\"26.53489\",3],[\"-97.78426\",\"26.44234\",2.6],[\"-97.78432\",\"26.34679\",6.4],[\"-97.73888\",\"26.26341\",4.2],[\"-97.71112\",\"26.17963\",17.1],[\"-97.63463\",\"26.12510\",9.4],[\"-97.57714\",\"26.08060\",3.2],[\"-97.54235\",\"26.07708\",6.6],[\"-97.47798\",\"26.07174\",4.9],[\"-97.41809\",\"26.06748\",-3.3],[\"-97.33605\",\"26.09123\",-1],[\"-97.25670\",\"26.08105\",-4.2],[\"-97.20704\",\"26.07729\",3.9],[\"-97.16370\",\"26.08420\",-6.9],[\"-97.16373\",\"26.08414\",5.1],[\"-97.16458\",\"26.08529\",-1.9],[\"-97.21686\",\"26.07182\",1.5],[\"-97.21688\",\"26.07150\",11],[\"-97.21708\",\"26.07128\",6.5],[\"-97.21792\",\"26.07147\",5.1],[\"-97.22452\",\"26.07281\",2.2],[\"-97.22450\",\"26.07281\",2.8],[\"-97.23400\",\"26.07708\",6.7],[\"-97.29501\",\"26.09403\",5.1],[\"-97.37784\",\"26.07015\",4],[\"-97.46792\",\"26.07110\",4.6],[\"-97.52268\",\"26.07523\",8.5],[\"-97.59574\",\"26.10114\",10.9],[\"-97.67729\",\"26.15719\",18.9],[\"-97.76306\",\"26.18706\",18.6],[\"-97.85969\",\"26.15972\",17],[\"-97.95871\",\"26.16138\",28.6],[\"-98.04663\",\"26.18086\",25.7],[\"-98.13010\",\"26.19245\",30.4],[\"-98.14738\",\"26.19554\",36.1],[\"-98.18877\",\"26.20761\",36.2],[\"-98.25060\",\"26.19297\",37.9],[\"-98.34647\",\"26.21392\",47.2],[\"-98.43517\",\"26.24245\",48.8],[\"-98.46474\",\"26.24646\",49.4],[\"-98.52442\",\"26.25532\",55.2],[\"-98.58980\",\"26.28789\",62.3],[\"-98.67088\",\"26.31958\",61.2],[\"-98.75202\",\"26.34601\",45.2],[\"-98.79529\",\"26.36872\",51.3],[\"-98.83388\",\"26.37970\",55.9],[\"-98.90137\",\"26.38439\",51.1],[\"-98.95444\",\"26.40936\",54.6],[\"-99.01119\",\"26.40283\",59.4],[\"-99.02822\",\"26.45411\",125.7],[\"-99.08591\",\"26.51962\",100.2],[\"-99.08826\",\"26.60524\",142.1],[\"-99.10852\",\"26.68995\",102.1],[\"-99.12194\",\"26.77935\",125.6],[\"-99.16400\",\"26.82192\",136.4],[\"-99.22150\",\"26.85351\",120.6],[\"-99.26742\",\"26.90220\",125.9],[\"-99.31845\",\"26.94674\",109.1],[\"-99.38375\",\"27.00618\",105.2],[\"-99.43373\",\"27.06312\",102.5],[\"-99.42278\",\"27.15168\",110.1],[\"-99.41931\",\"27.24432\",124.6],[\"-99.44143\",\"27.33219\",148.7],[\"-99.47035\",\"27.40077\",149.7],[\"-99.45133\",\"27.46230\",176.7],[\"-99.45031\",\"27.49767\",142.2],[\"-99.48964\",\"27.50640\",139.2],[\"-99.50260\",\"27.52830\",129.1],[\"-99.50235\",\"27.53064\",130.2],[\"-99.50232\",\"27.53060\",128.1],[\"-99.50377\",\"27.54863\",138.7],[\"-99.48809\",\"27.63346\",181.5],[\"-99.44827\",\"27.71957\",228.4],[\"-99.41841\",\"27.80493\",203.3],[\"-99.46545\",\"27.82100\",239.5],[\"-99.48544\",\"27.90567\",241.4],[\"-99.52929\",\"27.99028\",267],[\"-99.55622\",\"28.05779\",278.3],[\"-99.59348\",\"28.13296\",228.8],[\"-99.61423\",\"28.21586\",206.5],[\"-99.61413\",\"28.30547\",159.2],[\"-99.64589\",\"28.37326\",182.8],[\"-99.73183\",\"28.42636\",209.7],[\"-99.79978\",\"28.47179\",182.9],[\"-99.85646\",\"28.52286\",196],[\"-99.85565\",\"28.52369\",196.7],[\"-99.85597\",\"28.52344\",176.1],[\"-99.85702\",\"28.52182\",197.1],[\"-99.89712\",\"28.55830\",215.6],[\"-99.96386\",\"28.62502\",208],[\"-100.06532\",\"28.62601\",221.5],[\"-100.17092\",\"28.64186\",238],[\"-100.27725\",\"28.66397\",255.9],[\"-100.38127\",\"28.69246\",258.4],[\"-100.46447\",\"28.71104\",266.7],[\"-100.49655\",\"28.74306\",240],[\"-100.50707\",\"28.77648\",239.9],[\"-100.53545\",\"28.85117\",278.9],[\"-100.60223\",\"28.91297\",253.1],[\"-100.63378\",\"28.97994\",269.8],[\"-100.63988\",\"29.06849\",291.8],[\"-100.67331\",\"29.15664\",313.9],[\"-100.73721\",\"29.22920\",330.2],[\"-100.79192\",\"29.30545\",348.4],[\"-100.87358\",\"29.35513\",322.2],[\"-100.90071\",\"29.38132\",358.9],[\"-100.90568\",\"29.38608\",354.1],[\"-100.90569\",\"29.38607\",350.4],[\"-100.90532\",\"29.38714\",363.1],[\"-100.92571\",\"29.44905\",379],[\"-101.02258\",\"29.46890\",392],[\"-101.07847\",\"29.54058\",403.6],[\"-101.10049\",\"29.61668\",477.3],[\"-101.15676\",\"29.67396\",521.4],[\"-101.24518\",\"29.71051\",524],[\"-101.35021\",\"29.70741\",439.7],[\"-101.40097\",\"29.78171\",475.5],[\"-101.49915\",\"29.80764\",495.7],[\"-101.60442\",\"29.81885\",467.7],[\"-101.69761\",\"29.85862\",593.1],[\"-101.78149\",\"29.90242\",544.4],[\"-101.88041\",\"29.90818\",610.3],[\"-101.97698\",\"29.94443\",673.3],[\"-102.05142\",\"30.00847\",708.8],[\"-102.14163\",\"30.04964\",734],[\"-102.24909\",\"30.05908\",803.1],[\"-102.35225\",\"30.07746\",887],[\"-102.38669\",\"30.13678\",931],[\"-102.38668\",\"30.13676\",937.1],[\"-102.38873\",\"30.13757\",941],[\"-102.45495\",\"30.15941\",993.9],[\"-102.54852\",\"30.13862\",1069.6],[\"-102.64938\",\"30.16284\",1149.5],[\"-102.75604\",\"30.17581\",1268.5],[\"-102.86174\",\"30.18901\",1393.5],[\"-102.96795\",\"30.20451\",1406.1],[\"-103.07127\",\"30.21290\",1384.5],[\"-103.18125\",\"30.21020\",1411.2],[\"-103.23576\",\"30.20685\",1379.6],[\"-103.23574\",\"30.20684\",1388.5],[\"-103.23690\",\"30.20647\",1391.5],[\"-103.24498\",\"30.12558\",1338.1],[\"-103.28247\",\"30.03813\",1275.5],[\"-103.25310\",\"29.94901\",1163.6],[\"-103.24788\",\"29.85909\",1077.2],[\"-103.17921\",\"29.78688\",980.7],[\"-103.16339\",\"29.69599\",954.1],[\"-103.17362\",\"29.65944\",971.9],[\"-103.14192\",\"29.59466\",879.5],[\"-103.12084\",\"29.51649\",1002],[\"-103.13798\",\"29.44204\",949.1],[\"-103.15747\",\"29.37491\",1050.9],[\"-103.20625\",\"29.32829\",1264.2],[\"-103.20615\",\"29.32820\",1267.8],[\"-103.20717\",\"29.32900\",1273.5],[\"-103.27328\",\"29.34642\",1303.6],[\"-103.34127\",\"29.33412\",1169],[\"-103.40577\",\"29.32031\",1122.1],[\"-103.47787\",\"29.30775\",964.6],[\"-103.53327\",\"29.32080\",872],[\"-103.59888\",\"29.32184\",936.7],[\"-103.67781\",\"29.30224\",964.4],[\"-103.76115\",\"29.26887\",805.5],[\"-103.77082\",\"29.26262\",793.7],[\"-103.77083\",\"29.26263\",791.4],[\"-103.77177\",\"29.26211\",790.8],[\"-103.83188\",\"29.27234\",787.5],[\"-103.88234\",\"29.28562\",793.8],[\"-103.94257\",\"29.29623\",948.7],[\"-103.97708\",\"29.31927\",912],[\"-104.05056\",\"29.33302\",836.5],[\"-104.09633\",\"29.36820\",845.1],[\"-104.17264\",\"29.41190\",857.2],[\"-104.20468\",\"29.47375\",867.9],[\"-104.25497\",\"29.51305\",875.4],[\"-104.31940\",\"29.54219\",873.8],[\"-104.36588\",\"29.56076\",877.9],[\"-104.37213\",\"29.56055\",857.4],[\"-104.37215\",\"29.56049\",859.7],[\"-104.37165\",\"29.56142\",880.5],[\"-104.36383\",\"29.60383\",955],[\"-104.36013\",\"29.69294\",1098.1],[\"-104.34073\",\"29.77954\",1333.3],[\"-104.30666\",\"29.83857\",1381],[\"-104.27198\",\"29.90277\",1511.3],[\"-104.22280\",\"29.97740\",1683.3],[\"-104.18213\",\"30.05294\",1761.6],[\"-104.12908\",\"30.12588\",1584.2],[\"-104.07081\",\"30.20118\",1523.3],[\"-104.04189\",\"30.26851\",1571.1],[\"-104.02087\",\"30.30950\",1604.9],[\"-104.02739\",\"30.30769\",1597.7],[\"-104.10568\",\"30.32726\",1648.6],[\"-104.20336\",\"30.36674\",1663.3],[\"-104.28936\",\"30.42222\",1626.2],[\"-104.36885\",\"30.48534\",1591.3],[\"-104.44349\",\"30.54445\",1543.4],[\"-104.51092\",\"30.59775\",1498.5],[\"-104.51847\",\"30.60349\",1494.5],[\"-104.51923\",\"30.60429\",1494.8],[\"-104.59674\",\"30.66542\",1441.3],[\"-104.67800\",\"30.72946\",1401.1],[\"-104.74637\",\"30.80191\",1375.1],[\"-104.79140\",\"30.88830\",1346],[\"-104.81959\",\"30.97924\",1338],[\"-104.83025\",\"31.03595\",1373.4],[\"-104.83042\",\"31.03603\",1376.8],[\"-104.83076\",\"31.03682\",1374.5],[\"-104.93317\",\"31.05033\",1530.7],[\"-105.04071\",\"31.08504\",1521.5],[\"-105.15141\",\"31.11437\",1511.3],[\"-105.26136\",\"31.14697\",1491.8],[\"-105.36925\",\"31.17623\",1562.8],[\"-105.47187\",\"31.21322\",1563.3],[\"-105.57622\",\"31.19705\",1366.2],[\"-105.68378\",\"31.17444\",1233.4],[\"-105.77650\",\"31.22879\",1204.1],[\"-105.84135\",\"31.30518\",1234.5],[\"-105.91998\",\"31.37702\",1272.6],[\"-106.01610\",\"31.43315\",1288.5],[\"-106.10082\",\"31.49487\",1288.1],[\"-106.17142\",\"31.57166\",1290.7],[\"-106.23606\",\"31.65499\",1280.1],[\"-106.30886\",\"31.72452\",1300.2],[\"-106.39001\",\"31.77741\",1315.9],[\"-106.48525\",\"31.76461\",1269.2],[\"-106.54191\",\"31.80961\",1289.2],[\"-106.58269\",\"31.88766\",1311.8],[\"-106.58361\",\"31.91195\",1326.2],[\"-106.58429\",\"31.91197\",1325],[\"-106.58332\",\"31.91100\",1325.5],[\"-106.58242\",\"31.97911\",1335.9],[\"-106.58056\",\"31.99599\",1341.4],[\"-106.58082\",\"31.99587\",1342.2],[\"-106.58083\",\"31.99584\",1342.7],[\"-106.58057\",\"31.99596\",1341.5],[\"-106.58068\",\"31.99694\",1348.1],[\"-106.58291\",\"31.95606\",1343.7],[\"-106.54249\",\"31.90510\",1493.7],[\"-106.47891\",\"31.88983\",1672.9],[\"-106.41579\",\"31.89909\",1340.8],[\"-106.33882\",\"31.86481\",1355.5],[\"-106.26847\",\"31.81169\",1363],[\"-106.21685\",\"31.81314\",1372.5],[\"-106.17752\",\"31.81883\",1378.4],[\"-106.17754\",\"31.81883\",1376.8],[\"-106.17526\",\"31.81864\",1390.5],[\"-106.08421\",\"31.83137\",1455.9],[\"-105.98874\",\"31.83907\",1711.3],[\"-105.90864\",\"31.82669\",1760.3],[\"-105.80614\",\"31.84724\",1793.6],[\"-105.70443\",\"31.81991\",1654.1],[\"-105.59863\",\"31.80164\",1544.9],[\"-105.49193\",\"31.78306\",1477.7],[\"-105.38455\",\"31.76434\",1426.5],[\"-105.27807\",\"31.74668\",1359.7],[\"-105.18901\",\"31.74714\",1352],[\"-105.08184\",\"31.74466\",1265.1],[\"-105.01809\",\"31.75127\",1238.7],[\"-104.91278\",\"31.76391\",1305.3],[\"-104.82834\",\"31.81961\",1506.5],[\"-104.82316\",\"31.87875\",1901.6],[\"-104.82100\",\"31.89300\",1945.4],[\"-104.74318\",\"31.92382\",1647.2],[\"-104.64828\",\"31.96708\",1534.1],[\"-104.54469\",\"31.99674\",1357.8],[\"-104.50093\",\"31.93218\",1297.2],[\"-104.44355\",\"31.92434\",1258.9],[\"-104.40178\",\"31.91590\",1220],[\"-104.33093\",\"31.88795\",1172],[\"-104.27802\",\"31.86861\",1245.6],[\"-104.17598\",\"31.83747\",1175.6],[\"-104.11731\",\"31.82491\",1106.7],[\"-104.09131\",\"31.82325\",1098.6],[\"-104.06403\",\"31.82296\",1065.9],[\"-104.03006\",\"31.82257\",1028.3],[\"-103.94368\",\"31.82517\",992.9],[\"-103.88530\",\"31.79780\",968.1],[\"-103.83016\",\"31.73398\",952.2],[\"-103.77675\",\"31.67859\",981.9],[\"-103.67502\",\"31.64859\",936.5],[\"-103.61184\",\"31.68883\",908.1],[\"-103.53915\",\"31.73867\",961.1],[\"-103.43999\",\"31.76597\",999],[\"-103.33919\",\"31.77865\",986.7],[\"-103.25776\",\"31.80100\",971.6],[\"-103.17164\",\"31.82448\",962.8],[\"-103.10516\",\"31.84877\",966.3],[\"-103.10374\",\"31.84332\",960.5],[\"-103.10377\",\"31.84332\",962.2],[\"-103.10091\",\"31.84353\",973.4],[\"-103.07832\",\"31.86477\",992],[\"-103.00557\",\"31.91799\",1013],[\"-102.95398\",\"31.98004\",1049.8],[\"-102.90122\",\"32.05607\",1074.1],[\"-102.83474\",\"32.12853\",1126.8],[\"-102.75026\",\"32.18142\",1109.3],[\"-102.77743\",\"32.26481\",1118.5],[\"-102.77341\",\"32.35412\",1115.7],[\"-102.79904\",\"32.43790\",1128],[\"-102.85397\",\"32.49384\",1143.5],[\"-102.83456\",\"32.56829\",1147.2],[\"-102.78379\",\"32.60752\",1138.9],[\"-102.74307\",\"32.66050\",1135],[\"-102.73196\",\"32.72543\",1154.6],[\"-102.70894\",\"32.78280\",1143.5],[\"-102.77274\",\"32.85205\",1182.7],[\"-102.80433\",\"32.93702\",1196.8],[\"-102.81862\",\"32.96248\",1215.7],[\"-102.81899\",\"32.96326\",1214.3],[\"-102.81899\",\"32.97905\",1222.3],[\"-102.81884\",\"33.06177\",1233],[\"-102.81868\",\"33.15321\",1237.6],[\"-102.81855\",\"33.23103\",1261.2],[\"-102.81843\",\"33.32459\",1261.1],[\"-102.81978\",\"33.41787\",1276.7],[\"-102.82295\",\"33.51112\",1289.4],[\"-102.82257\",\"33.55711\",1286.8],[\"-102.80091\",\"33.61324\",1287.6],[\"-102.75964\",\"33.69626\",1283.6],[\"-102.75864\",\"33.76206\",1273.4],[\"-102.76074\",\"33.85506\",1289.6],[\"-102.74357\",\"33.94651\",1274.8],[\"-102.73757\",\"34.03478\",1322.2],[\"-102.73498\",\"34.12793\",1315.4],[\"-102.73152\",\"34.21730\",1285.6],[\"-102.72365\",\"34.22637\",1293.6],[\"-102.72361\",\"34.22640\",1284.2],[\"-102.72248\",\"34.22787\",1290.8],[\"-102.72246\",\"34.30530\",1314.4],[\"-102.71613\",\"34.39754\",1355.3],[\"-102.72822\",\"34.48720\",1362],[\"-102.72767\",\"34.58069\",1393.7],[\"-102.71849\",\"34.64102\",1366.3],[\"-102.66505\",\"34.65510\",1359.2],[\"-102.56931\",\"34.70512\",1339.1],[\"-102.47510\",\"34.75638\",1332.3],[\"-102.40575\",\"34.81154\",1293],[\"-102.40508\",\"34.85869\",1302.7],[\"-102.40331\",\"34.95106\",1319.6],[\"-102.40217\",\"35.04428\",1327],[\"-102.40066\",\"35.13749\",1361],[\"-102.42339\",\"35.22630\",1367],[\"-102.42897\",\"35.23828\",1367.6],[\"-102.42905\",\"35.23831\",1375.7],[\"-102.42844\",\"35.23912\",1375.2],[\"-102.38791\",\"35.29985\",1358.5],[\"-102.32817\",\"35.37798\",1280.8],[\"-102.25732\",\"35.44921\",1190.6],[\"-102.26745\",\"35.53624\",1119.8],[\"-102.30488\",\"35.62218\",1204.2],[\"-102.32886\",\"35.68665\",1294.8],[\"-102.33095\",\"35.77090\",1326.9],[\"-102.38040\",\"35.85658\",1335.2],[\"-102.42458\",\"35.93361\",1336.5],[\"-102.47417\",\"36.01948\",1348],[\"-102.51777\",\"36.06287\",1360.9],[\"-102.58416\",\"36.10763\",1379.2],[\"-102.67698\",\"36.16468\",1413.9],[\"-102.77093\",\"36.22071\",1466.9],[\"-102.86530\",\"36.27703\",1489.9],[\"-102.95966\",\"36.33281\",1535.2],[\"-103.01866\",\"36.37430\",1592.1],[\"-103.01873\",\"36.37428\",1584.2],[\"-103.01801\",\"36.37343\",1598.6],[\"-102.93322\",\"36.31676\",1533.8],[\"-102.83917\",\"36.26095\",1484.4],[\"-102.74495\",\"36.20487\",1448.7],[\"-102.65113\",\"36.14889\",1399.3],[\"-102.59298\",\"36.11317\",1389.4],[\"-102.51060\",\"36.07956\",1356],[\"-102.45119\",\"36.10822\",1349.2],[\"-102.35891\",\"36.16287\",1339.6],[\"-102.26334\",\"36.21962\",1305.2],[\"-102.17083\",\"36.27440\",1275.7],[\"-102.07878\",\"36.32881\",1250.7],[\"-101.99481\",\"36.32836\",1233.5],[\"-101.87768\",\"36.32852\",1204.3],[\"-101.76958\",\"36.32801\",1181],[\"-101.65370\",\"36.32369\",1146.6],[\"-101.57189\",\"36.27016\",1130.5],[\"-101.45480\",\"36.26985\",1089.4],[\"-101.37222\",\"36.24709\",1077.7],[\"-101.27802\",\"36.19728\",1064.3],[\"-101.19710\",\"36.19918\",1057],[\"-101.19771\",\"36.19867\",1055.4],[\"-101.19614\",\"36.19999\",1057.3],[\"-101.12314\",\"36.24566\",1041.1],[\"-101.02315\",\"36.29413\",1020.9],[\"-100.92461\",\"36.34173\",1012.5],[\"-100.82543\",\"36.38956\",995.1],[\"-100.75501\",\"36.42338\",986.5],[\"-100.64857\",\"36.45608\",976.5],[\"-100.54066\",\"36.45550\",955.4],[\"-100.44530\",\"36.44866\",952.6],[\"-100.33173\",\"36.44588\",864.1],[\"-100.23179\",\"36.43383\",887.5],[\"-100.14145\",\"36.43364\",881.7],[\"-100.14138\",\"36.43367\",879.7],[\"-100.14174\",\"36.43269\",885.8],[\"-100.13134\",\"36.37315\",833.6],[\"-100.13131\",\"36.29084\",819.4],[\"-100.13151\",\"36.20681\",803.3],[\"-100.18629\",\"36.17225\",839.4],[\"-100.27625\",\"36.16393\",863.2],[\"-100.27660\",\"36.07717\",917.6],[\"-100.28041\",\"36.00295\",877.6],[\"-100.36870\",\"35.94958\",814.9],[\"-100.38316\",\"35.91605\",811.9],[\"-100.38318\",\"35.91606\",813.1],[\"-100.38495\",\"35.91491\",804.8],[\"-100.39762\",\"35.84724\",902.7],[\"-100.38661\",\"35.75735\",885.6],[\"-100.36328\",\"35.66641\",966.7],[\"-100.31356\",\"35.58213\",915.7],[\"-100.29004\",\"35.49144\",827.5],[\"-100.27177\",\"35.42848\",868.1],[\"-100.23634\",\"35.34629\",780.7],[\"-100.24628\",\"35.25635\",748.4],[\"-100.24922\",\"35.19952\",772.4],[\"-100.23768\",\"35.12777\",769.9],[\"-100.23159\",\"35.03996\",758.7],[\"-100.22150\",\"34.95012\",686.2],[\"-100.20487\",\"34.86103\",682.2],[\"-100.19214\",\"34.78134\",663.6],[\"-100.18879\",\"34.68760\",597.8],[\"-100.18914\",\"34.59680\",584.4],[\"-100.20816\",\"34.50536\",588.1],[\"-100.22364\",\"34.43353\",652.6],[\"-100.22089\",\"34.43283\",650.6],[\"-100.22090\",\"34.43286\",639],[\"-100.21905\",\"34.43186\",644.4],[\"-100.14048\",\"34.40419\",574.4],[\"-100.03394\",\"34.37504\",550],[\"-99.92770\",\"34.34519\",547],[\"-99.82294\",\"34.31387\",512.3],[\"-99.73791\",\"34.28892\",532.5],[\"-99.63802\",\"34.26842\",501.8],[\"-99.52841\",\"34.25581\",462.7],[\"-99.44124\",\"34.23542\",463],[\"-99.34295\",\"34.18956\",418.6],[\"-99.24802\",\"34.15298\",395.8],[\"-99.14010\",\"34.13392\",416.2],[\"-99.04316\",\"34.08548\",417.2],[\"-99.00955\",\"34.07128\",398.1],[\"-99.00955\",\"34.07126\",414.6],[\"-99.00942\",\"34.07027\",418.5],[\"-98.90411\",\"34.04175\",408.2],[\"-98.81255\",\"33.98450\",363.5],[\"-98.70233\",\"33.96571\",351.1],[\"-98.58840\",\"33.95357\",337.1],[\"-98.50460\",\"33.91252\",325.3],[\"-98.42073\",\"33.88136\",335.2],[\"-98.31278\",\"33.85378\",312.8],[\"-98.21698\",\"33.81375\",305.5],[\"-98.18446\",\"33.81493\",303.2],[\"-98.18338\",\"33.81530\",306.5],[\"-98.07638\",\"33.81273\",300.9],[\"-97.96224\",\"33.81705\",290.1],[\"-97.85036\",\"33.79918\",299.6],[\"-97.74015\",\"33.78210\",311.9],[\"-97.66460\",\"33.77070\",342.3],[\"-97.56471\",\"33.72430\",354.9],[\"-97.48781\",\"33.67996\",381.6],[\"-97.38356\",\"33.64832\",326.2],[\"-97.28775\",\"33.64456\",298.6],[\"-97.19102\",\"33.64089\",264.7],[\"-97.12684\",\"33.64228\",269.5],[\"-97.04380\",\"33.64978\",277.7],[\"-96.94176\",\"33.65453\",274.8],[\"-96.84817\",\"33.67270\",248.5],[\"-96.74363\",\"33.67093\",246.6],[\"-96.64055\",\"33.67098\",263.1],[\"-96.59068\",\"33.70641\",244],[\"-96.58949\",\"33.70975\",232],[\"-96.59197\",\"33.70763\",233.2],[\"-96.59201\",\"33.70760\",230.5],[\"-96.59239\",\"33.70856\",233.8],[\"-96.59043\",\"33.70900\",236.3],[\"-96.61062\",\"33.66840\",277.4],[\"-96.60444\",\"33.58990\",247.3],[\"-96.61974\",\"33.49907\",280.8],[\"-96.58337\",\"33.41138\",258.2],[\"-96.59070\",\"33.31713\",222.6],[\"-96.63182\",\"33.23421\",227.7],[\"-96.65046\",\"33.14517\",216.6],[\"-96.69851\",\"33.10073\",216.4],[\"-96.71850\",\"33.08510\",226.7],[\"-96.71844\",\"33.08506\",230]]},\"properties\":{\"stroke\":\"#ff00ff\",\"stroke-opacity\":1,\"stroke-width\":1}};\n if (gj.type === 'Feature' && gj.geometry.type === 'LineString') {\n var sourceName = 'Combined Devices - e524-24256eb1-607c-69d10cbf4f4ea';\n map.addSource(sourceName, { type: 'geojson', data: gj });\n\n \/\/ ['get', 'stroke']\n map.addLayer({\n id: 'Combined Devices - e524-24256eb1-607c-69d10cbf4f4ea',\n source: sourceName,\n type: 'line',\n paint: {\n 'line-color': ['get', 'stroke'],\n 'line-width': ['get', 'stroke-width'],\n 'line-opacity': ['get', 'stroke-opacity'],\n },\n filter: [\"==\", \"$type\", \"LineString\"]\n });\n\n gj.geometry.coordinates.forEach(function(lngLat) {\n bounds.extend(lngLat);\n });\n\n layers.push('Combined Devices - e524-24256eb1-607c-69d10cbf4f4ea');\n }\n af = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.71849\",\"33.08507\",229.7]},\"properties\":{\"tripId\":59999,\"messageId\":21903331,\"messageDateTime\":\"2021-09-28 05:39:47\",\"messageDateTimeUTC\":\"2021-09-28T10:39:47Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.07\",\"kph\":0.1,\"knots\":0.1,\"bearing\":297,\"nearest\":null,\"messageText\":\"20:1:[6]:09-28 05:39:47 (1.321)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"fa-solid fa-star\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n if (af.type === 'Feature' && af.geometry.type === 'Point') {\n el = document.createElement('div');\n el.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: green; background-color: #fff; border-radius: 50%; border: 1px solid #000;\";\n el.innerHTML = '<\/i>';\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21903331, 'TRACK'); });\n\n m = new mapboxgl.Marker({ 'element': el })\n .setLngLat(af.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(af.geometry.coordinates);\n markers.push(m);\n if (af.properties.smallPic !== undefined && af.properties.smallPic !== null && af.properties.smallPic.length > 0 && af.properties.largePic !== undefined && af.properties.largePic !== null && af.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + af.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(af.geometry.coordinates)\n .addTo(map);\n markers.push(m);\n markersWithPics.push(m);\n picListMarkers['0'] = m;\n plHtml += '

\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.71849\",\"33.08505\",229.8]},\"properties\":{\"tripId\":59999,\"messageId\":21903332,\"messageDateTime\":\"2021-09-28 05:39:54\",\"messageDateTimeUTC\":\"2021-09-28T10:39:54Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"OK\",\"messageTypeDescription\":\"Ok\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":180,\"nearest\":null,\"messageText\":null,\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21903332, 'OK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['1'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.71081\",\"33.08655\",217.9]},\"properties\":{\"tripId\":59999,\"messageId\":21903404,\"messageDateTime\":\"2021-09-28 05:49:48\",\"messageDateTimeUTC\":\"2021-09-28T10:49:48Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"47.51\",\"kph\":76.5,\"knots\":41.3,\"bearing\":30,\"nearest\":null,\"messageText\":\"38:8:[4]:09-28 05:49:48 (0.333)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21903404, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['2'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.67932\",\"33.10218\",227.1]},\"properties\":{\"tripId\":59999,\"messageId\":21903474,\"messageDateTime\":\"2021-09-28 05:54:49\",\"messageDateTimeUTC\":\"2021-09-28T10:54:49Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":59,\"nearest\":null,\"messageText\":\"58:28:[4]:09-28 05:54:49 (0.181)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21903474, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['3'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.67808\",\"33.10205\",230.7]},\"properties\":{\"tripId\":59999,\"messageId\":21903519,\"messageDateTime\":\"2021-09-28 06:00:15\",\"messageDateTimeUTC\":\"2021-09-28T11:00:15Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"28.07\",\"kph\":45.2,\"knots\":24.4,\"bearing\":97,\"nearest\":null,\"messageText\":\"85:29:[4]:09-28 06:00:15 (0.220)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21903519, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['4'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.59259\",\"33.27791\",216]},\"properties\":{\"tripId\":59999,\"messageId\":21903610,\"messageDateTime\":\"2021-09-28 06:10:16\",\"messageDateTimeUTC\":\"2021-09-28T11:10:16Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"85.29\",\"kph\":137.3,\"knots\":74.1,\"bearing\":23,\"nearest\":null,\"messageText\":\"184:128:[4]:09-28 06:10:16 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21903610, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['5'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.60900\",\"33.45832\",256.5]},\"properties\":{\"tripId\":59999,\"messageId\":21903725,\"messageDateTime\":\"2021-09-28 06:20:17\",\"messageDateTimeUTC\":\"2021-09-28T11:20:17Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"86.24\",\"kph\":138.8,\"knots\":74.9,\"bearing\":347,\"nearest\":null,\"messageText\":\"276:220:[4]:09-28 06:20:17 (0.210)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21903725, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['6'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.61340\",\"33.64495\",239.2]},\"properties\":{\"tripId\":59999,\"messageId\":21903823,\"messageDateTime\":\"2021-09-28 06:30:18\",\"messageDateTimeUTC\":\"2021-09-28T11:30:18Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"57.58\",\"kph\":92.7,\"knots\":50,\"bearing\":355,\"nearest\":null,\"messageText\":\"372:316:[4]:09-28 06:30:18 (0.190)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21903823, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['7'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.59119\",\"33.70953\",236.2]},\"properties\":{\"tripId\":59999,\"messageId\":21905104,\"messageDateTime\":\"2021-09-28 06:57:14\",\"messageDateTimeUTC\":\"2021-09-28T11:57:14Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"7.44\",\"kph\":12,\"knots\":6.5,\"bearing\":90,\"nearest\":null,\"messageText\":\"956:354:[4]:09-28 06:57:14 (0.183)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21905104, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['8'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.59229\",\"33.70770\",234.5]},\"properties\":{\"tripId\":59999,\"messageId\":21905168,\"messageDateTime\":\"2021-09-28 07:02:14\",\"messageDateTimeUTC\":\"2021-09-28T12:02:14Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":206,\"nearest\":null,\"messageText\":\"971:357:[11]:09-28 07:02:14 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21905168, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['9'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.59196\",\"33.70569\",243.1]},\"properties\":{\"tripId\":59999,\"messageId\":21905377,\"messageDateTime\":\"2021-09-28 07:14:17\",\"messageDateTimeUTC\":\"2021-09-28T12:14:17Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"54.04\",\"kph\":87,\"knots\":47,\"bearing\":172,\"nearest\":null,\"messageText\":\"1200:358:[4]:09-28 07:14:17 (0.198)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21905377, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['10'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.45335\",\"33.64537\",206.9]},\"properties\":{\"tripId\":59999,\"messageId\":21905527,\"messageDateTime\":\"2021-09-28 07:24:17\",\"messageDateTimeUTC\":\"2021-09-28T12:24:17Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"80.04\",\"kph\":128.8,\"knots\":69.6,\"bearing\":98,\"nearest\":null,\"messageText\":\"1290:448:[4]:09-28 07:24:17 (0.194)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21905527, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['11'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.23079\",\"33.60395\",219.2]},\"properties\":{\"tripId\":59999,\"messageId\":21905730,\"messageDateTime\":\"2021-09-28 07:34:18\",\"messageDateTimeUTC\":\"2021-09-28T12:34:18Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"79.34\",\"kph\":127.7,\"knots\":68.9,\"bearing\":95,\"nearest\":null,\"messageText\":\"1391:549:[4]:09-28 07:34:18 (0.190)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21905730, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['12'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-95.99942\",\"33.60869\",218.8]},\"properties\":{\"tripId\":59999,\"messageId\":21905898,\"messageDateTime\":\"2021-09-28 07:44:19\",\"messageDateTimeUTC\":\"2021-09-28T12:44:19Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"79.94\",\"kph\":128.7,\"knots\":69.5,\"bearing\":88,\"nearest\":null,\"messageText\":\"1492:650:[4]:09-28 07:44:19 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21905898, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['13'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-95.78088\",\"33.62124\",210.4]},\"properties\":{\"tripId\":59999,\"messageId\":21906079,\"messageDateTime\":\"2021-09-28 07:54:20\",\"messageDateTimeUTC\":\"2021-09-28T12:54:20Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"70.80\",\"kph\":113.9,\"knots\":61.5,\"bearing\":72,\"nearest\":null,\"messageText\":\"1592:750:[4]:09-28 07:54:20 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21906079, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['14'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-95.67144\",\"33.64524\",206.2]},\"properties\":{\"tripId\":59999,\"messageId\":21906206,\"messageDateTime\":\"2021-09-28 07:59:20\",\"messageDateTimeUTC\":\"2021-09-28T12:59:20Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"93.94\",\"kph\":151.2,\"knots\":81.6,\"bearing\":75,\"nearest\":null,\"messageText\":\"1642:800:[4]:09-28 07:59:20 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21906206, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['15'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-95.59404\",\"33.67594\",183.5]},\"properties\":{\"tripId\":59999,\"messageId\":21906286,\"messageDateTime\":\"2021-09-28 08:04:20\",\"messageDateTimeUTC\":\"2021-09-28T13:04:20Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"79.01\",\"kph\":127.2,\"knots\":68.7,\"bearing\":64,\"nearest\":null,\"messageText\":\"1683:841:[4]:09-28 08:04:20 (0.333)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21906286, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['16'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-95.46191\",\"33.66328\",193.2]},\"properties\":{\"tripId\":59999,\"messageId\":21906476,\"messageDateTime\":\"2021-09-28 08:14:21\",\"messageDateTimeUTC\":\"2021-09-28T13:14:21Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"42.09\",\"kph\":67.7,\"knots\":36.6,\"bearing\":88,\"nearest\":null,\"messageText\":\"1747:905:[4]:09-28 08:14:21 (0.320)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21906476, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['17'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-95.27419\",\"33.66108\",167.5]},\"properties\":{\"tripId\":59999,\"messageId\":21906662,\"messageDateTime\":\"2021-09-28 08:24:22\",\"messageDateTimeUTC\":\"2021-09-28T13:24:22Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.03\",\"kph\":124,\"knots\":66.9,\"bearing\":90,\"nearest\":null,\"messageText\":\"1833:991:[4]:09-28 08:24:22 (0.189)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21906662, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['18'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-95.08048\",\"33.61280\",145.5]},\"properties\":{\"tripId\":59999,\"messageId\":21906868,\"messageDateTime\":\"2021-09-28 08:34:23\",\"messageDateTimeUTC\":\"2021-09-28T13:34:23Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"57.10\",\"kph\":91.9,\"knots\":49.6,\"bearing\":103,\"nearest\":null,\"messageText\":\"1928:1086:[4]:09-28 08:34:23 (0.193)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21906868, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['19'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.89987\",\"33.58488\",122.7]},\"properties\":{\"tripId\":59999,\"messageId\":21907082,\"messageDateTime\":\"2021-09-28 08:44:24\",\"messageDateTimeUTC\":\"2021-09-28T13:44:24Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.08\",\"kph\":124,\"knots\":67,\"bearing\":104,\"nearest\":null,\"messageText\":\"2016:1174:[4]:09-28 08:44:24 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21907082, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['20'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.79276\",\"33.55977\",168]},\"properties\":{\"tripId\":59999,\"messageId\":21907183,\"messageDateTime\":\"2021-09-28 08:49:24\",\"messageDateTimeUTC\":\"2021-09-28T13:49:24Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.19\",\"kph\":122.6,\"knots\":66.2,\"bearing\":105,\"nearest\":null,\"messageText\":\"2067:1225:[4]:09-28 08:49:24 (0.294)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21907183, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['21'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.70146\",\"33.54194\",151.6]},\"properties\":{\"tripId\":59999,\"messageId\":21907293,\"messageDateTime\":\"2021-09-28 08:54:24\",\"messageDateTimeUTC\":\"2021-09-28T13:54:24Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.99\",\"kph\":125.5,\"knots\":67.8,\"bearing\":103,\"nearest\":null,\"messageText\":\"2111:1269:[4]:09-28 08:54:24 (0.339)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21907293, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['22'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.52664\",\"33.48943\",136.2]},\"properties\":{\"tripId\":59999,\"messageId\":21907505,\"messageDateTime\":\"2021-09-28 09:04:25\",\"messageDateTimeUTC\":\"2021-09-28T14:04:25Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"61.09\",\"kph\":98.3,\"knots\":53.1,\"bearing\":104,\"nearest\":null,\"messageText\":\"2195:1353:[4]:09-28 09:04:25 (0.291)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21907505, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['23'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.33764\",\"33.46820\",123.2]},\"properties\":{\"tripId\":59999,\"messageId\":21907732,\"messageDateTime\":\"2021-09-28 09:14:26\",\"messageDateTimeUTC\":\"2021-09-28T14:14:26Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.07\",\"kph\":125.6,\"knots\":67.8,\"bearing\":93,\"nearest\":null,\"messageText\":\"2282:1440:[4]:09-28 09:14:26 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21907732, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['24'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.11754\",\"33.45249\",104.5]},\"properties\":{\"tripId\":59999,\"messageId\":21907959,\"messageDateTime\":\"2021-09-28 09:24:27\",\"messageDateTimeUTC\":\"2021-09-28T14:24:27Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"80.26\",\"kph\":129.2,\"knots\":69.7,\"bearing\":99,\"nearest\":null,\"messageText\":\"2383:1541:[4]:09-28 09:24:27 (0.192)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21907959, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['25'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.04721\",\"33.42087\",113]},\"properties\":{\"tripId\":59999,\"messageId\":21908177,\"messageDateTime\":\"2021-09-28 09:34:27\",\"messageDateTimeUTC\":\"2021-09-28T14:34:27Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":132,\"nearest\":null,\"messageText\":\"2425:1583:[4]:09-28 09:34:27 (0.439)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21908177, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['26'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.04936\",\"33.41667\",116.7]},\"properties\":{\"tripId\":59999,\"messageId\":21908278,\"messageDateTime\":\"2021-09-28 09:39:28\",\"messageDateTimeUTC\":\"2021-09-28T14:39:28Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"51.07\",\"kph\":82.2,\"knots\":44.4,\"bearing\":203,\"nearest\":null,\"messageText\":\"2430:1588:[4]:09-28 09:39:28 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21908278, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['27'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.03055\",\"33.40966\",114.7]},\"properties\":{\"tripId\":59999,\"messageId\":21908398,\"messageDateTime\":\"2021-09-28 09:44:28\",\"messageDateTimeUTC\":\"2021-09-28T14:44:28Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":114,\"nearest\":null,\"messageText\":\"2441:1599:[4]:09-28 09:44:28 (0.310)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21908398, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['28'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.03201\",\"33.38520\",99.5]},\"properties\":{\"tripId\":59999,\"messageId\":21908820,\"messageDateTime\":\"2021-09-28 10:02:55\",\"messageDateTimeUTC\":\"2021-09-28T15:02:55Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"70.28\",\"kph\":113.1,\"knots\":61.1,\"bearing\":183,\"nearest\":null,\"messageText\":\"2732:1621:[4]:09-28 10:02:55 (0.315)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21908820, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['29'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.06184\",\"33.43453\",121.6]},\"properties\":{\"tripId\":59999,\"messageId\":21909078,\"messageDateTime\":\"2021-09-28 10:12:55\",\"messageDateTimeUTC\":\"2021-09-28T15:12:55Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":310,\"nearest\":null,\"messageText\":\"2770:1659:[4]:09-28 10:12:56 (0.194)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21909078, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['30'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.08002\",\"33.40124\",102.3]},\"properties\":{\"tripId\":59999,\"messageId\":21909545,\"messageDateTime\":\"2021-09-28 10:26:29\",\"messageDateTimeUTC\":\"2021-09-28T15:26:29Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"7.63\",\"kph\":12.3,\"knots\":6.6,\"bearing\":203,\"nearest\":null,\"messageText\":\"2902:1685:[4]:09-28 10:26:29 (0.324)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21909545, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['31'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.15289\",\"33.26642\",102.9]},\"properties\":{\"tripId\":59999,\"messageId\":21909805,\"messageDateTime\":\"2021-09-28 10:36:31\",\"messageDateTimeUTC\":\"2021-09-28T15:36:31Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.51\",\"kph\":123.1,\"knots\":66.5,\"bearing\":188,\"nearest\":null,\"messageText\":\"2989:1772:[4]:09-28 10:36:31 (0.290)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21909805, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['32'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.15198\",\"33.17320\",114.9]},\"properties\":{\"tripId\":59999,\"messageId\":21909923,\"messageDateTime\":\"2021-09-28 10:41:31\",\"messageDateTimeUTC\":\"2021-09-28T15:41:31Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.05\",\"kph\":125.6,\"knots\":67.8,\"bearing\":179,\"nearest\":null,\"messageText\":\"3039:1822:[4]:09-28 10:41:31 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21909923, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['33'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.15473\",\"33.15084\",120.2]},\"properties\":{\"tripId\":59999,\"messageId\":21910053,\"messageDateTime\":\"2021-09-28 10:46:32\",\"messageDateTimeUTC\":\"2021-09-28T15:46:32Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"48.94\",\"kph\":78.8,\"knots\":42.5,\"bearing\":185,\"nearest\":null,\"messageText\":\"3053:1836:[4]:09-28 10:46:32 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21910053, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['34'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.20632\",\"33.10375\",109.6]},\"properties\":{\"tripId\":59999,\"messageId\":21910351,\"messageDateTime\":\"2021-09-28 10:56:32\",\"messageDateTimeUTC\":\"2021-09-28T15:56:32Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"65.54\",\"kph\":105.5,\"knots\":57,\"bearing\":248,\"nearest\":null,\"messageText\":\"3090:1873:[4]:09-28 10:56:32 (0.324)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21910351, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['35'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.36280\",\"33.00158\",126.7]},\"properties\":{\"tripId\":59999,\"messageId\":21910600,\"messageDateTime\":\"2021-09-28 11:06:33\",\"messageDateTimeUTC\":\"2021-09-28T16:06:33Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"45.29\",\"kph\":72.9,\"knots\":39.4,\"bearing\":228,\"nearest\":null,\"messageText\":\"3182:1965:[4]:09-28 11:06:33 (0.321)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21910600, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['36'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.36157\",\"32.82252\",101.4]},\"properties\":{\"tripId\":59999,\"messageId\":21910868,\"messageDateTime\":\"2021-09-28 11:16:34\",\"messageDateTimeUTC\":\"2021-09-28T16:16:34Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.69\",\"kph\":126.6,\"knots\":68.4,\"bearing\":177,\"nearest\":null,\"messageText\":\"3281:2064:[4]:09-28 11:16:34 (0.328)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21910868, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['37'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.34533\",\"32.65829\",102.7]},\"properties\":{\"tripId\":59999,\"messageId\":21911139,\"messageDateTime\":\"2021-09-28 11:26:35\",\"messageDateTimeUTC\":\"2021-09-28T16:26:35Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.84\",\"kph\":125.3,\"knots\":67.6,\"bearing\":174,\"nearest\":null,\"messageText\":\"3372:2155:[4]:09-28 11:26:35 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21911139, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['38'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.34627\",\"32.57475\",131]},\"properties\":{\"tripId\":59999,\"messageId\":21911249,\"messageDateTime\":\"2021-09-28 11:31:35\",\"messageDateTimeUTC\":\"2021-09-28T16:31:35Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"39.67\",\"kph\":63.8,\"knots\":34.5,\"bearing\":180,\"nearest\":null,\"messageText\":\"3419:2202:[4]:09-28 11:31:35 (0.324)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21911249, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['39'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.35161\",\"32.52769\",110.6]},\"properties\":{\"tripId\":59999,\"messageId\":21911373,\"messageDateTime\":\"2021-09-28 11:36:35\",\"messageDateTimeUTC\":\"2021-09-28T16:36:35Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"32.24\",\"kph\":51.9,\"knots\":28,\"bearing\":185,\"nearest\":null,\"messageText\":\"3445:2228:[4]:09-28 11:36:36 (0.189)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21911373, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['40'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.34591\",\"32.38016\",84.8]},\"properties\":{\"tripId\":59999,\"messageId\":21911639,\"messageDateTime\":\"2021-09-28 11:46:36\",\"messageDateTimeUTC\":\"2021-09-28T16:46:36Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.63\",\"kph\":124.9,\"knots\":67.5,\"bearing\":173,\"nearest\":null,\"messageText\":\"3525:2308:[4]:09-28 11:46:36 (0.189)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21911639, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['41'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.34014\",\"32.19350\",82.9]},\"properties\":{\"tripId\":59999,\"messageId\":21911904,\"messageDateTime\":\"2021-09-28 11:56:37\",\"messageDateTimeUTC\":\"2021-09-28T16:56:37Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.92\",\"kph\":123.8,\"knots\":66.8,\"bearing\":174,\"nearest\":null,\"messageText\":\"3626:2409:[4]:09-28 11:56:37 (0.184)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21911904, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['42'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.30561\",\"32.06317\",72.6]},\"properties\":{\"tripId\":59999,\"messageId\":21912122,\"messageDateTime\":\"2021-09-28 12:06:38\",\"messageDateTimeUTC\":\"2021-09-28T17:06:38Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.13\",\"kph\":122.5,\"knots\":66.2,\"bearing\":162,\"nearest\":null,\"messageText\":\"3699:2482:[4]:09-28 12:06:38 (0.182)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21912122, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['43'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.21995\",\"31.90127\",87.8]},\"properties\":{\"tripId\":59999,\"messageId\":21912388,\"messageDateTime\":\"2021-09-28 12:16:38\",\"messageDateTimeUTC\":\"2021-09-28T17:16:38Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.70\",\"kph\":125,\"knots\":67.5,\"bearing\":169,\"nearest\":null,\"messageText\":\"3800:2583:[4]:09-28 12:16:39 (0.193)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21912388, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['44'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.19746\",\"31.81493\",124.9]},\"properties\":{\"tripId\":59999,\"messageId\":21912505,\"messageDateTime\":\"2021-09-28 12:21:39\",\"messageDateTimeUTC\":\"2021-09-28T17:21:39Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"50.64\",\"kph\":81.5,\"knots\":44,\"bearing\":167,\"nearest\":null,\"messageText\":\"3848:2631:[4]:09-28 12:21:39 (0.327)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21912505, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['45'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.18505\",\"31.79012\",108.5]},\"properties\":{\"tripId\":59999,\"messageId\":21912640,\"messageDateTime\":\"2021-09-28 12:26:39\",\"messageDateTimeUTC\":\"2021-09-28T17:26:39Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":156,\"nearest\":null,\"messageText\":\"3863:2646:[4]:09-28 12:26:39 (0.472)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21912640, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['46'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.16959\",\"31.71833\",92.6]},\"properties\":{\"tripId\":59999,\"messageId\":21913001,\"messageDateTime\":\"2021-09-28 12:40:46\",\"messageDateTimeUTC\":\"2021-09-28T17:40:46Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"71.23\",\"kph\":114.6,\"knots\":61.9,\"bearing\":169,\"nearest\":null,\"messageText\":\"4053:2685:[4]:09-28 12:40:46 (0.328)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21913001, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['47'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.13300\",\"31.56341\",139.6]},\"properties\":{\"tripId\":59999,\"messageId\":21913258,\"messageDateTime\":\"2021-09-28 12:50:47\",\"messageDateTimeUTC\":\"2021-09-28T17:50:47Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"49.02\",\"kph\":78.9,\"knots\":42.6,\"bearing\":166,\"nearest\":null,\"messageText\":\"4137:2769:[4]:09-28 12:50:47 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21913258, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['48'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.08816\",\"31.43948\",113]},\"properties\":{\"tripId\":59999,\"messageId\":21913532,\"messageDateTime\":\"2021-09-28 13:00:47\",\"messageDateTimeUTC\":\"2021-09-28T18:00:47Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"80.62\",\"kph\":129.7,\"knots\":70.1,\"bearing\":157,\"nearest\":null,\"messageText\":\"4209:2841:[4]:09-28 13:00:48 (0.184)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21913532, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['49'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-93.99255\",\"31.28422\",94.7]},\"properties\":{\"tripId\":59999,\"messageId\":21913757,\"messageDateTime\":\"2021-09-28 13:10:48\",\"messageDateTimeUTC\":\"2021-09-28T18:10:48Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"79.12\",\"kph\":127.3,\"knots\":68.8,\"bearing\":159,\"nearest\":null,\"messageText\":\"4302:2934:[4]:09-28 13:10:48 (0.322)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21913757, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['50'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-93.98080\",\"31.20168\",57.4]},\"properties\":{\"tripId\":59999,\"messageId\":21913861,\"messageDateTime\":\"2021-09-28 13:15:49\",\"messageDateTimeUTC\":\"2021-09-28T18:15:49Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.06\",\"kph\":124,\"knots\":67,\"bearing\":173,\"nearest\":null,\"messageText\":\"4347:2979:[4]:09-28 13:15:49 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21913861, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['51'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-93.97960\",\"31.15165\",65.5]},\"properties\":{\"tripId\":59999,\"messageId\":21914004,\"messageDateTime\":\"2021-09-28 13:20:49\",\"messageDateTimeUTC\":\"2021-09-28T18:20:49Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.51\",\"kph\":124.7,\"knots\":67.4,\"bearing\":178,\"nearest\":null,\"messageText\":\"4375:3007:[4]:09-28 13:20:49 (0.322)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21914004, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['52'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-93.98824\",\"30.97574\",122.6]},\"properties\":{\"tripId\":59999,\"messageId\":21914212,\"messageDateTime\":\"2021-09-28 13:30:50\",\"messageDateTimeUTC\":\"2021-09-28T18:30:50Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.89\",\"kph\":125.4,\"knots\":67.7,\"bearing\":181,\"nearest\":null,\"messageText\":\"4472:3104:[4]:09-28 13:30:50 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21914212, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['53'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-93.97700\",\"30.85128\",96.6]},\"properties\":{\"tripId\":59999,\"messageId\":21914410,\"messageDateTime\":\"2021-09-28 13:40:50\",\"messageDateTimeUTC\":\"2021-09-28T18:40:50Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.82\",\"kph\":125.2,\"knots\":67.6,\"bearing\":165,\"nearest\":null,\"messageText\":\"4542:3174:[4]:09-28 13:40:51 (0.191)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21914410, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['54'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-93.89358\",\"30.67908\",27.9]},\"properties\":{\"tripId\":59999,\"messageId\":21914617,\"messageDateTime\":\"2021-09-28 13:50:51\",\"messageDateTimeUTC\":\"2021-09-28T18:50:51Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"63.72\",\"kph\":102.5,\"knots\":55.4,\"bearing\":152,\"nearest\":null,\"messageText\":\"4642:3274:[4]:09-28 13:50:51 (0.331)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21914617, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['55'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-93.93997\",\"30.52636\",29.4]},\"properties\":{\"tripId\":59999,\"messageId\":21914810,\"messageDateTime\":\"2021-09-28 14:00:52\",\"messageDateTimeUTC\":\"2021-09-28T19:00:52Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.88\",\"kph\":125.3,\"knots\":67.7,\"bearing\":196,\"nearest\":null,\"messageText\":\"4727:3359:[4]:09-28 14:00:52 (0.189)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21914810, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['56'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-93.96880\",\"30.44275\",17.6]},\"properties\":{\"tripId\":59999,\"messageId\":21914889,\"messageDateTime\":\"2021-09-28 14:05:52\",\"messageDateTimeUTC\":\"2021-09-28T19:05:52Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"37.97\",\"kph\":61.1,\"knots\":33,\"bearing\":196,\"nearest\":null,\"messageText\":\"4774:3406:[4]:09-28 14:05:53 (0.192)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21914889, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['57'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-93.94124\",\"30.39109\",8.7]},\"properties\":{\"tripId\":59999,\"messageId\":21915006,\"messageDateTime\":\"2021-09-28 14:10:53\",\"messageDateTimeUTC\":\"2021-09-28T19:10:53Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"67.45\",\"kph\":108.5,\"knots\":58.6,\"bearing\":155,\"nearest\":null,\"messageText\":\"4804:3436:[4]:09-28 14:10:53 (0.189)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21915006, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['58'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-93.88285\",\"30.22370\",-0.6]},\"properties\":{\"tripId\":59999,\"messageId\":21915239,\"messageDateTime\":\"2021-09-28 14:20:54\",\"messageDateTimeUTC\":\"2021-09-28T19:20:54Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"61.31\",\"kph\":98.7,\"knots\":53.3,\"bearing\":161,\"nearest\":null,\"messageText\":\"4891:3523:[4]:09-28 14:20:54 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21915239, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['59'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-93.82137\",\"30.11469\",-8.9]},\"properties\":{\"tripId\":59999,\"messageId\":21915445,\"messageDateTime\":\"2021-09-28 14:30:54\",\"messageDateTimeUTC\":\"2021-09-28T19:30:54Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":162,\"nearest\":null,\"messageText\":\"4956:3588:[4]:09-28 14:30:55 (0.192)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21915445, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['60'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-93.84538\",\"30.02194\",-3.9]},\"properties\":{\"tripId\":59999,\"messageId\":21915657,\"messageDateTime\":\"2021-09-28 14:40:55\",\"messageDateTimeUTC\":\"2021-09-28T19:40:55Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"19.78\",\"kph\":31.8,\"knots\":17.2,\"bearing\":203,\"nearest\":null,\"messageText\":\"5012:3644:[4]:09-28 14:40:55 (0.405)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21915657, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['61'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-93.96189\",\"29.91164\",-1.7]},\"properties\":{\"tripId\":59999,\"messageId\":21915880,\"messageDateTime\":\"2021-09-28 14:50:56\",\"messageDateTimeUTC\":\"2021-09-28T19:50:56Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"62.92\",\"kph\":101.3,\"knots\":54.7,\"bearing\":239,\"nearest\":null,\"messageText\":\"5098:3730:[4]:09-28 14:50:56 (0.267)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21915880, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['62'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-93.96332\",\"29.86670\",-7.4]},\"properties\":{\"tripId\":59999,\"messageId\":21915972,\"messageDateTime\":\"2021-09-28 14:55:56\",\"messageDateTimeUTC\":\"2021-09-28T19:55:56Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":181,\"nearest\":null,\"messageText\":\"5135:3767:[4]:09-28 14:55:56 (0.333)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21915972, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['63'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-93.95414\",\"29.87138\",-4.9]},\"properties\":{\"tripId\":59999,\"messageId\":21916102,\"messageDateTime\":\"2021-09-28 15:00:56\",\"messageDateTimeUTC\":\"2021-09-28T20:00:56Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":59,\"nearest\":null,\"messageText\":\"5142:3774:[4]:09-28 15:00:57 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21916102, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['64'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.00621\",\"29.88595\",-1.3]},\"properties\":{\"tripId\":59999,\"messageId\":21916419,\"messageDateTime\":\"2021-09-28 15:14:38\",\"messageDateTimeUTC\":\"2021-09-28T20:14:38Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"46.97\",\"kph\":75.6,\"knots\":40.8,\"bearing\":289,\"nearest\":null,\"messageText\":\"5314:3802:[4]:09-28 15:14:38 (0.325)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21916419, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['65'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.20446\",\"29.83326\",1.9]},\"properties\":{\"tripId\":59999,\"messageId\":21916667,\"messageDateTime\":\"2021-09-28 15:24:39\",\"messageDateTimeUTC\":\"2021-09-28T20:24:39Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.96\",\"kph\":127.1,\"knots\":68.6,\"bearing\":255,\"nearest\":null,\"messageText\":\"5415:3903:[4]:09-28 15:24:39 (0.189)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21916667, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['66'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.38415\",\"29.81788\",15.7]},\"properties\":{\"tripId\":59999,\"messageId\":21916924,\"messageDateTime\":\"2021-09-28 15:34:39\",\"messageDateTimeUTC\":\"2021-09-28T20:34:39Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"49.93\",\"kph\":80.4,\"knots\":43.4,\"bearing\":262,\"nearest\":null,\"messageText\":\"5504:3992:[4]:09-28 15:34:40 (0.237)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21916924, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['67'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.37266\",\"29.65704\",2.1]},\"properties\":{\"tripId\":59999,\"messageId\":21917165,\"messageDateTime\":\"2021-09-28 15:44:40\",\"messageDateTimeUTC\":\"2021-09-28T20:44:40Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.88\",\"kph\":125.3,\"knots\":67.7,\"bearing\":178,\"nearest\":null,\"messageText\":\"5590:4078:[4]:09-28 15:44:41 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21917165, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['68'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.39895\",\"29.57045\",-3.4]},\"properties\":{\"tripId\":59999,\"messageId\":21917269,\"messageDateTime\":\"2021-09-28 15:49:41\",\"messageDateTimeUTC\":\"2021-09-28T20:49:41Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"54.29\",\"kph\":87.4,\"knots\":47.2,\"bearing\":194,\"nearest\":null,\"messageText\":\"5638:4126:[4]:09-28 15:49:41 (0.324)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21917269, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['69'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.44772\",\"29.52763\",5.2]},\"properties\":{\"tripId\":59999,\"messageId\":21917381,\"messageDateTime\":\"2021-09-28 15:54:41\",\"messageDateTimeUTC\":\"2021-09-28T20:54:41Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"74.65\",\"kph\":120.1,\"knots\":64.9,\"bearing\":224,\"nearest\":null,\"messageText\":\"5679:4167:[4]:09-28 15:54:41 (0.469)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21917381, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['70'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.61738\",\"29.46562\",-3.8]},\"properties\":{\"tripId\":59999,\"messageId\":21917640,\"messageDateTime\":\"2021-09-28 16:04:42\",\"messageDateTimeUTC\":\"2021-09-28T21:04:42Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"29.20\",\"kph\":47,\"knots\":25.4,\"bearing\":247,\"nearest\":null,\"messageText\":\"5766:4254:[4]:09-28 16:04:42 (0.192)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21917640, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['71'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.72339\",\"29.40240\",-1.9]},\"properties\":{\"tripId\":59999,\"messageId\":21917868,\"messageDateTime\":\"2021-09-28 16:14:42\",\"messageDateTimeUTC\":\"2021-09-28T21:14:42Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"59.98\",\"kph\":96.5,\"knots\":52.1,\"bearing\":231,\"nearest\":null,\"messageText\":\"5826:4314:[4]:09-28 16:14:42 (0.376)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21917868, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['72'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.77874\",\"29.36300\",6.2]},\"properties\":{\"tripId\":59999,\"messageId\":21918110,\"messageDateTime\":\"2021-09-28 16:24:43\",\"messageDateTimeUTC\":\"2021-09-28T21:24:43Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":234,\"nearest\":null,\"messageText\":\"5861:4349:[4]:09-28 16:24:43 (0.183)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21918110, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['73'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.78015\",\"29.35507\",-45.7]},\"properties\":{\"tripId\":59999,\"messageId\":21918358,\"messageDateTime\":\"2021-09-28 16:34:43\",\"messageDateTimeUTC\":\"2021-09-28T21:34:43Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"9.13\",\"kph\":14.7,\"knots\":7.9,\"bearing\":186,\"nearest\":null,\"messageText\":\"5866:4354:[4]:09-28 16:34:43 (0.468)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21918358, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['74'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.77486\",\"29.33429\",10.4]},\"properties\":{\"tripId\":59999,\"messageId\":21918492,\"messageDateTime\":\"2021-09-28 16:42:02\",\"messageDateTimeUTC\":\"2021-09-28T21:42:02Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"11.15\",\"kph\":17.9,\"knots\":9.7,\"bearing\":167,\"nearest\":null,\"messageText\":\"6014:4364:[64]:09-28 16:42:02 (0.191)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21918492, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['75'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.77391\",\"29.32805\",4.5]},\"properties\":{\"tripId\":59999,\"messageId\":21918625,\"messageDateTime\":\"2021-09-28 16:47:02\",\"messageDateTimeUTC\":\"2021-09-28T21:47:02Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":172,\"nearest\":null,\"messageText\":\"6018:4368:[4]:09-28 16:47:02 (0.263)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21918625, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['76'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.80485\",\"29.29687\",-1.8]},\"properties\":{\"tripId\":59999,\"messageId\":21918859,\"messageDateTime\":\"2021-09-28 16:57:03\",\"messageDateTimeUTC\":\"2021-09-28T21:57:03Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"38.18\",\"kph\":61.4,\"knots\":33.2,\"bearing\":232,\"nearest\":null,\"messageText\":\"6049:4399:[4]:09-28 16:57:03 (0.325)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21918859, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['77'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.81177\",\"29.29505\",3.1]},\"properties\":{\"tripId\":59999,\"messageId\":21919156,\"messageDateTime\":\"2021-09-28 17:09:52\",\"messageDateTimeUTC\":\"2021-09-28T22:09:52Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"27.39\",\"kph\":44.1,\"knots\":23.8,\"bearing\":248,\"nearest\":null,\"messageText\":\"6516:4404:[4]:09-28 17:09:52 (0.180)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21919156, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['78'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.90047\",\"29.30283\",9.3]},\"properties\":{\"tripId\":59999,\"messageId\":21919366,\"messageDateTime\":\"2021-09-28 17:19:52\",\"messageDateTimeUTC\":\"2021-09-28T22:19:52Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"61.46\",\"kph\":98.9,\"knots\":53.4,\"bearing\":282,\"nearest\":null,\"messageText\":\"7117:4990:[4]:09-28 17:19:53 (0.199)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21919366, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['79'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-95.02068\",\"29.34978\",7.2]},\"properties\":{\"tripId\":59999,\"messageId\":21919582,\"messageDateTime\":\"2021-09-28 17:29:53\",\"messageDateTimeUTC\":\"2021-09-28T22:29:53Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"16.48\",\"kph\":26.5,\"knots\":14.3,\"bearing\":289,\"nearest\":null,\"messageText\":\"7718:5583:[4]:09-28 17:29:54 (0.193)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21919582, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['80'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-95.07897\",\"29.31548\",2.8]},\"properties\":{\"tripId\":59999,\"messageId\":21919709,\"messageDateTime\":\"2021-09-28 17:34:54\",\"messageDateTimeUTC\":\"2021-09-28T22:34:54Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"53.25\",\"kph\":85.7,\"knots\":46.3,\"bearing\":235,\"nearest\":null,\"messageText\":\"8018:5877:[4]:09-28 17:34:54 (0.210)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21919709, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['81'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-95.14393\",\"29.27121\",2.5]},\"properties\":{\"tripId\":59999,\"messageId\":21919806,\"messageDateTime\":\"2021-09-28 17:39:54\",\"messageDateTimeUTC\":\"2021-09-28T22:39:54Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"59.60\",\"kph\":95.9,\"knots\":51.8,\"bearing\":232,\"nearest\":null,\"messageText\":\"8318:6173:[4]:09-28 17:39:54 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21919806, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['82'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-95.25374\",\"29.17422\",0.2]},\"properties\":{\"tripId\":59999,\"messageId\":21920036,\"messageDateTime\":\"2021-09-28 17:49:55\",\"messageDateTimeUTC\":\"2021-09-28T22:49:55Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"61.20\",\"kph\":98.5,\"knots\":53.2,\"bearing\":225,\"nearest\":null,\"messageText\":\"8919:6768:[4]:09-28 17:49:55 (0.180)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21920036, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['83'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-95.39732\",\"29.12792\",6.4]},\"properties\":{\"tripId\":59999,\"messageId\":21920253,\"messageDateTime\":\"2021-09-28 17:59:56\",\"messageDateTimeUTC\":\"2021-09-28T22:59:56Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"60.73\",\"kph\":97.7,\"knots\":52.8,\"bearing\":254,\"nearest\":null,\"messageText\":\"9520:7362:[4]:09-28 17:59:56 (0.170)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21920253, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['84'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-95.45479\",\"29.16386\",3.1]},\"properties\":{\"tripId\":59999,\"messageId\":21920477,\"messageDateTime\":\"2021-09-28 18:09:57\",\"messageDateTimeUTC\":\"2021-09-28T23:09:57Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":354,\"nearest\":null,\"messageText\":\"10121:7956:[14]:09-28 18:09:57 (0.189)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21920477, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['85'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-95.53967\",\"29.14654\",11.3]},\"properties\":{\"tripId\":59999,\"messageId\":21920844,\"messageDateTime\":\"2021-09-28 18:28:45\",\"messageDateTimeUTC\":\"2021-09-28T23:28:45Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"67.17\",\"kph\":108.1,\"knots\":58.4,\"bearing\":257,\"nearest\":null,\"messageText\":\"11249:8250:[4]:09-28 18:28:45 (0.165)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21920844, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['86'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-95.62800\",\"29.14317\",14]},\"properties\":{\"tripId\":59999,\"messageId\":21920935,\"messageDateTime\":\"2021-09-28 18:33:45\",\"messageDateTimeUTC\":\"2021-09-28T23:33:45Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"65.17\",\"kph\":104.9,\"knots\":56.6,\"bearing\":267,\"nearest\":null,\"messageText\":\"11549:8547:[4]:09-28 18:33:45 (0.164)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21920935, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['87'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-95.67086\",\"29.14578\",14.8]},\"properties\":{\"tripId\":59999,\"messageId\":21921030,\"messageDateTime\":\"2021-09-28 18:38:46\",\"messageDateTimeUTC\":\"2021-09-28T23:38:46Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"64.55\",\"kph\":103.9,\"knots\":56.1,\"bearing\":273,\"nearest\":null,\"messageText\":\"11850:8845:[4]:09-28 18:38:46 (0.170)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21921030, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['88'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-95.80920\",\"29.06754\",7.5]},\"properties\":{\"tripId\":59999,\"messageId\":21921202,\"messageDateTime\":\"2021-09-28 18:48:47\",\"messageDateTimeUTC\":\"2021-09-28T23:48:47Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"73.05\",\"kph\":117.6,\"knots\":63.5,\"bearing\":254,\"nearest\":null,\"messageText\":\"12452:9429:[4]:09-28 18:48:47 (0.170)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21921202, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['89'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-95.93140\",\"28.98813\",14.7]},\"properties\":{\"tripId\":59999,\"messageId\":21921390,\"messageDateTime\":\"2021-09-28 18:58:48\",\"messageDateTimeUTC\":\"2021-09-28T23:58:48Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"42.61\",\"kph\":68.6,\"knots\":37,\"bearing\":228,\"nearest\":null,\"messageText\":\"13052:10023:[4]:09-28 18:58:48 (0.167)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21921390, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['90'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.03007\",\"28.97388\",22.4]},\"properties\":{\"tripId\":59999,\"messageId\":21921570,\"messageDateTime\":\"2021-09-28 19:08:48\",\"messageDateTimeUTC\":\"2021-09-29T00:08:48Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"63.63\",\"kph\":102.4,\"knots\":55.3,\"bearing\":260,\"nearest\":null,\"messageText\":\"13653:10608:[4]:09-28 19:08:49 (0.177)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21921570, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['91'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.18353\",\"28.88567\",9.5]},\"properties\":{\"tripId\":59999,\"messageId\":21921739,\"messageDateTime\":\"2021-09-28 19:18:49\",\"messageDateTimeUTC\":\"2021-09-29T00:18:49Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"75.31\",\"kph\":121.2,\"knots\":65.4,\"bearing\":239,\"nearest\":null,\"messageText\":\"14253:11202:[4]:09-28 19:18:49 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21921739, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['92'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.22443\",\"28.93798\",20.3]},\"properties\":{\"tripId\":59999,\"messageId\":21921830,\"messageDateTime\":\"2021-09-28 19:23:50\",\"messageDateTimeUTC\":\"2021-09-29T00:23:50Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"67.89\",\"kph\":109.3,\"knots\":59,\"bearing\":325,\"nearest\":null,\"messageText\":\"14554:11500:[4]:09-28 19:23:50 (0.198)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21921830, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['93'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.32585\",\"28.94159\",14.5]},\"properties\":{\"tripId\":59999,\"messageId\":21921913,\"messageDateTime\":\"2021-09-28 19:28:50\",\"messageDateTimeUTC\":\"2021-09-29T00:28:50Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"74.49\",\"kph\":119.9,\"knots\":64.7,\"bearing\":272,\"nearest\":null,\"messageText\":\"14854:11797:[4]:09-28 19:28:50 (0.171)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21921913, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['94'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.52032\",\"28.95285\",15.3]},\"properties\":{\"tripId\":59999,\"messageId\":21922066,\"messageDateTime\":\"2021-09-28 19:38:51\",\"messageDateTimeUTC\":\"2021-09-29T00:38:51Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"74.43\",\"kph\":119.8,\"knots\":64.7,\"bearing\":270,\"nearest\":null,\"messageText\":\"15455:12392:[4]:09-28 19:38:51 (0.172)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21922066, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['95'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.65407\",\"28.97466\",24.3]},\"properties\":{\"tripId\":59999,\"messageId\":21922222,\"messageDateTime\":\"2021-09-28 19:48:52\",\"messageDateTimeUTC\":\"2021-09-29T00:48:52Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"24.11\",\"kph\":38.8,\"knots\":21,\"bearing\":295,\"nearest\":null,\"messageText\":\"16056:12987:[4]:09-28 19:48:52 (0.171)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21922222, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['96'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.81757\",\"28.89429\",20.4]},\"properties\":{\"tripId\":59999,\"messageId\":21922396,\"messageDateTime\":\"2021-09-28 19:58:52\",\"messageDateTimeUTC\":\"2021-09-29T00:58:52Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.91\",\"kph\":123.8,\"knots\":66.8,\"bearing\":241,\"nearest\":null,\"messageText\":\"16656:13575:[4]:09-28 19:58:52 (0.168)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21922396, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['97'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.96643\",\"28.77626\",34.3]},\"properties\":{\"tripId\":59999,\"messageId\":21922542,\"messageDateTime\":\"2021-09-28 20:08:53\",\"messageDateTimeUTC\":\"2021-09-29T01:08:53Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"46.80\",\"kph\":75.3,\"knots\":40.7,\"bearing\":220,\"nearest\":null,\"messageText\":\"17257:14170:[4]:09-28 20:08:53 (0.168)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21922542, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['98'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.96627\",\"28.77825\",36.6]},\"properties\":{\"tripId\":59999,\"messageId\":21922603,\"messageDateTime\":\"2021-09-28 20:13:54\",\"messageDateTimeUTC\":\"2021-09-29T01:13:54Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":4,\"nearest\":null,\"messageText\":\"17558:14465:[4]:09-28 20:13:54 (0.168)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21922603, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['99'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.96681\",\"28.77742\",30.3]},\"properties\":{\"tripId\":59999,\"messageId\":21922870,\"messageDateTime\":\"2021-09-28 20:29:52\",\"messageDateTimeUTC\":\"2021-09-29T01:29:52Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"33.47\",\"kph\":53.9,\"knots\":29.1,\"bearing\":212,\"nearest\":null,\"messageText\":\"17940:14466:[4]:09-28 20:29:52 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21922870, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['100'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.04600\",\"28.62843\",27.5]},\"properties\":{\"tripId\":59999,\"messageId\":21923018,\"messageDateTime\":\"2021-09-28 20:39:53\",\"messageDateTimeUTC\":\"2021-09-29T01:39:53Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"79.41\",\"kph\":127.8,\"knots\":69,\"bearing\":184,\"nearest\":null,\"messageText\":\"18038:14564:[4]:09-28 20:39:53 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21923018, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['101'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.10952\",\"28.46274\",22.1]},\"properties\":{\"tripId\":59999,\"messageId\":21923197,\"messageDateTime\":\"2021-09-28 20:49:54\",\"messageDateTimeUTC\":\"2021-09-29T01:49:54Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.83\",\"kph\":125.3,\"knots\":67.6,\"bearing\":219,\"nearest\":null,\"messageText\":\"18139:14665:[4]:09-28 20:49:54 (0.183)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21923197, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['102'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.25671\",\"28.33095\",17.1]},\"properties\":{\"tripId\":59999,\"messageId\":21923337,\"messageDateTime\":\"2021-09-28 20:59:55\",\"messageDateTimeUTC\":\"2021-09-29T01:59:55Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.35\",\"kph\":124.5,\"knots\":67.2,\"bearing\":225,\"nearest\":null,\"messageText\":\"18240:14766:[4]:09-28 20:59:55 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21923337, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['103'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.35556\",\"28.21272\",13.8]},\"properties\":{\"tripId\":59999,\"messageId\":21923469,\"messageDateTime\":\"2021-09-28 21:09:55\",\"messageDateTimeUTC\":\"2021-09-29T02:09:55Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.63\",\"kph\":126.5,\"knots\":68.3,\"bearing\":217,\"nearest\":null,\"messageText\":\"18320:14846:[4]:09-28 21:09:55 (0.450)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21923469, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['104'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.41772\",\"28.13568\",18.1]},\"properties\":{\"tripId\":59999,\"messageId\":21923523,\"messageDateTime\":\"2021-09-28 21:14:56\",\"messageDateTimeUTC\":\"2021-09-29T02:14:56Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.97\",\"kph\":123.9,\"knots\":66.9,\"bearing\":215,\"nearest\":null,\"messageText\":\"18371:14897:[4]:09-28 21:14:56 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21923523, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['105'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.48836\",\"28.06901\",24.4]},\"properties\":{\"tripId\":59999,\"messageId\":21923585,\"messageDateTime\":\"2021-09-28 21:19:56\",\"messageDateTimeUTC\":\"2021-09-29T02:19:56Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"79.94\",\"kph\":128.7,\"knots\":69.5,\"bearing\":223,\"nearest\":null,\"messageText\":\"18421:14947:[4]:09-28 21:19:56 (0.189)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21923585, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['106'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.58975\",\"27.94246\",17.6]},\"properties\":{\"tripId\":59999,\"messageId\":21923732,\"messageDateTime\":\"2021-09-28 21:29:57\",\"messageDateTimeUTC\":\"2021-09-29T02:29:57Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"39.20\",\"kph\":63.1,\"knots\":34.1,\"bearing\":217,\"nearest\":null,\"messageText\":\"18509:15035:[4]:09-28 21:29:57 (0.192)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21923732, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['107'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.64853\",\"27.79797\",17.8]},\"properties\":{\"tripId\":59999,\"messageId\":21923866,\"messageDateTime\":\"2021-09-28 21:39:58\",\"messageDateTimeUTC\":\"2021-09-29T02:39:58Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.07\",\"kph\":125.6,\"knots\":67.8,\"bearing\":194,\"nearest\":null,\"messageText\":\"18598:15124:[4]:09-28 21:39:58 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21923866, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['108'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.75503\",\"27.66248\",16.7]},\"properties\":{\"tripId\":59999,\"messageId\":21924016,\"messageDateTime\":\"2021-09-28 21:49:59\",\"messageDateTimeUTC\":\"2021-09-29T02:49:59Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"62.72\",\"kph\":100.9,\"knots\":54.5,\"bearing\":211,\"nearest\":null,\"messageText\":\"18688:15214:[4]:09-28 21:49:59 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21924016, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['109'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.84113\",\"27.52959\",11.5]},\"properties\":{\"tripId\":59999,\"messageId\":21924134,\"messageDateTime\":\"2021-09-28 22:00:00\",\"messageDateTimeUTC\":\"2021-09-29T03:00:00Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"16.36\",\"kph\":26.3,\"knots\":14.2,\"bearing\":221,\"nearest\":null,\"messageText\":\"18773:15299:[8]:09-28 22:00:00 (0.333)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21924134, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['110'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.84118\",\"27.52859\",14]},\"properties\":{\"tripId\":59999,\"messageId\":21924369,\"messageDateTime\":\"2021-09-28 22:19:09\",\"messageDateTimeUTC\":\"2021-09-29T03:19:09Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"37.06\",\"kph\":59.6,\"knots\":32.2,\"bearing\":154,\"nearest\":null,\"messageText\":\"19161:15300:[4]:09-28 22:19:09 (0.189)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21924369, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['111'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.85860\",\"27.44669\",8.1]},\"properties\":{\"tripId\":59999,\"messageId\":21924431,\"messageDateTime\":\"2021-09-28 22:24:09\",\"messageDateTimeUTC\":\"2021-09-29T03:24:09Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"72.22\",\"kph\":116.2,\"knots\":62.8,\"bearing\":190,\"nearest\":null,\"messageText\":\"19206:15345:[4]:09-28 22:24:10 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21924431, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['112'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.80595\",\"27.28257\",5.5]},\"properties\":{\"tripId\":59999,\"messageId\":21924555,\"messageDateTime\":\"2021-09-28 22:34:10\",\"messageDateTimeUTC\":\"2021-09-29T03:34:10Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.00\",\"kph\":122.3,\"knots\":66,\"bearing\":162,\"nearest\":null,\"messageText\":\"19298:15437:[4]:09-28 22:34:10 (0.261)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21924555, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['113'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.79024\",\"27.09874\",3.6]},\"properties\":{\"tripId\":59999,\"messageId\":21924668,\"messageDateTime\":\"2021-09-28 22:44:11\",\"messageDateTimeUTC\":\"2021-09-29T03:44:11Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"74.54\",\"kph\":120,\"knots\":64.8,\"bearing\":178,\"nearest\":null,\"messageText\":\"19399:15538:[4]:09-28 22:44:11 (0.204)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21924668, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['114'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.79097\",\"26.91221\",2.9]},\"properties\":{\"tripId\":59999,\"messageId\":21924779,\"messageDateTime\":\"2021-09-28 22:54:12\",\"messageDateTimeUTC\":\"2021-09-29T03:54:12Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.16\",\"kph\":124.2,\"knots\":67.1,\"bearing\":177,\"nearest\":null,\"messageText\":\"19500:15639:[4]:09-28 22:54:12 (0.191)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21924779, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['115'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.76946\",\"26.72598\",-0.5]},\"properties\":{\"tripId\":59999,\"messageId\":21924886,\"messageDateTime\":\"2021-09-28 23:04:12\",\"messageDateTimeUTC\":\"2021-09-29T04:04:12Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"79.05\",\"kph\":127.2,\"knots\":68.7,\"bearing\":174,\"nearest\":null,\"messageText\":\"19601:15740:[4]:09-28 23:04:13 (0.290)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21924886, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['116'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.76754\",\"26.63018\",0.5]},\"properties\":{\"tripId\":59999,\"messageId\":21924923,\"messageDateTime\":\"2021-09-28 23:09:13\",\"messageDateTimeUTC\":\"2021-09-29T04:09:13Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.70\",\"kph\":126.7,\"knots\":68.4,\"bearing\":178,\"nearest\":null,\"messageText\":\"19651:15790:[4]:09-28 23:09:13 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21924923, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['117'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.77521\",\"26.53489\",3]},\"properties\":{\"tripId\":59999,\"messageId\":21924958,\"messageDateTime\":\"2021-09-28 23:14:13\",\"messageDateTimeUTC\":\"2021-09-29T04:14:13Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.80\",\"kph\":126.8,\"knots\":68.5,\"bearing\":184,\"nearest\":null,\"messageText\":\"19701:15840:[4]:09-28 23:14:13 (0.197)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21924958, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['118'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.78432\",\"26.34679\",6.4]},\"properties\":{\"tripId\":59999,\"messageId\":21925075,\"messageDateTime\":\"2021-09-28 23:24:14\",\"messageDateTimeUTC\":\"2021-09-29T04:24:14Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"79.23\",\"kph\":127.5,\"knots\":68.8,\"bearing\":180,\"nearest\":null,\"messageText\":\"19802:15941:[4]:09-28 23:24:14 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21925075, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['119'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.71112\",\"26.17963\",17.1]},\"properties\":{\"tripId\":59999,\"messageId\":21925175,\"messageDateTime\":\"2021-09-28 23:34:15\",\"messageDateTimeUTC\":\"2021-09-29T04:34:15Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"73.87\",\"kph\":118.9,\"knots\":64.2,\"bearing\":163,\"nearest\":null,\"messageText\":\"19901:16040:[4]:09-28 23:34:15 (0.252)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21925175, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['120'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.57714\",\"26.08060\",3.2]},\"properties\":{\"tripId\":59999,\"messageId\":21925261,\"messageDateTime\":\"2021-09-28 23:44:16\",\"messageDateTimeUTC\":\"2021-09-29T04:44:16Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":130,\"nearest\":null,\"messageText\":\"19984:16123:[4]:09-28 23:44:16 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21925261, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['121'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.47798\",\"26.07174\",4.9]},\"properties\":{\"tripId\":59999,\"messageId\":21925333,\"messageDateTime\":\"2021-09-28 23:54:17\",\"messageDateTimeUTC\":\"2021-09-29T04:54:17Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"27.58\",\"kph\":44.4,\"knots\":24,\"bearing\":95,\"nearest\":null,\"messageText\":\"20033:16172:[4]:09-28 23:54:17 (0.199)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21925333, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['122'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.41809\",\"26.06748\",-3.3]},\"properties\":{\"tripId\":59999,\"messageId\":21925383,\"messageDateTime\":\"2021-09-28 23:59:17\",\"messageDateTimeUTC\":\"2021-09-29T04:59:17Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"66.54\",\"kph\":107.1,\"knots\":57.8,\"bearing\":94,\"nearest\":null,\"messageText\":\"20062:16201:[4]:09-28 23:59:17 (0.340)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21925383, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['123'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.33605\",\"26.09123\",-1]},\"properties\":{\"tripId\":59999,\"messageId\":21925410,\"messageDateTime\":\"2021-09-29 00:04:17\",\"messageDateTimeUTC\":\"2021-09-29T05:04:17Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"73.73\",\"kph\":118.7,\"knots\":64.1,\"bearing\":72,\"nearest\":null,\"messageText\":\"20105:16244:[4]:09-29 00:04:17 (0.487)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21925410, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['124'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.20704\",\"26.07729\",3.9]},\"properties\":{\"tripId\":59999,\"messageId\":21925492,\"messageDateTime\":\"2021-09-29 00:14:18\",\"messageDateTimeUTC\":\"2021-09-29T05:14:18Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"35.44\",\"kph\":57,\"knots\":30.8,\"bearing\":94,\"nearest\":null,\"messageText\":\"20170:16309:[4]:09-29 00:14:18 (0.332)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21925492, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['125'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.16458\",\"26.08529\",-1.9]},\"properties\":{\"tripId\":59999,\"messageId\":21926417,\"messageDateTime\":\"2021-09-29 00:31:00\",\"messageDateTimeUTC\":\"2021-09-29T05:31:00Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":326,\"nearest\":null,\"messageText\":\"20356:16333:[4]:09-29 00:31:00 (1.030)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21926417, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['126'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.21792\",\"26.07147\",5.1]},\"properties\":{\"tripId\":59999,\"messageId\":21928905,\"messageDateTime\":\"2021-09-29 06:22:02\",\"messageDateTimeUTC\":\"2021-09-29T11:22:02Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"20.68\",\"kph\":33.3,\"knots\":18,\"bearing\":284,\"nearest\":null,\"messageText\":\"24674:16362:[4]:09-29 06:22:03 (0.180)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21928905, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['127'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.23400\",\"26.07708\",6.7]},\"properties\":{\"tripId\":59999,\"messageId\":21929025,\"messageDateTime\":\"2021-09-29 06:32:03\",\"messageDateTimeUTC\":\"2021-09-29T11:32:03Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"50.24\",\"kph\":80.9,\"knots\":43.7,\"bearing\":296,\"nearest\":null,\"messageText\":\"24701:16373:[4]:09-29 06:32:04 (0.184)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21929025, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['128'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.29501\",\"26.09403\",5.1]},\"properties\":{\"tripId\":59999,\"messageId\":21929106,\"messageDateTime\":\"2021-09-29 06:37:04\",\"messageDateTimeUTC\":\"2021-09-29T11:37:04Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"58.62\",\"kph\":94.3,\"knots\":50.9,\"bearing\":287,\"nearest\":null,\"messageText\":\"24732:16404:[4]:09-29 06:37:04 (0.234)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21929106, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['129'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.37784\",\"26.07015\",4]},\"properties\":{\"tripId\":59999,\"messageId\":21929172,\"messageDateTime\":\"2021-09-29 06:42:04\",\"messageDateTimeUTC\":\"2021-09-29T11:42:04Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"71.36\",\"kph\":114.8,\"knots\":62,\"bearing\":252,\"nearest\":null,\"messageText\":\"24775:16447:[4]:09-29 06:42:04 (0.328)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21929172, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['130'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.52268\",\"26.07523\",8.5]},\"properties\":{\"tripId\":59999,\"messageId\":21929317,\"messageDateTime\":\"2021-09-29 06:52:05\",\"messageDateTimeUTC\":\"2021-09-29T11:52:05Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"42.02\",\"kph\":67.6,\"knots\":36.5,\"bearing\":274,\"nearest\":null,\"messageText\":\"24845:16517:[4]:09-29 06:52:05 (0.220)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21929317, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['131'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.67729\",\"26.15719\",18.9]},\"properties\":{\"tripId\":59999,\"messageId\":21929478,\"messageDateTime\":\"2021-09-29 07:02:06\",\"messageDateTimeUTC\":\"2021-09-29T12:02:06Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.47\",\"kph\":123.1,\"knots\":66.5,\"bearing\":307,\"nearest\":null,\"messageText\":\"24936:16608:[4]:09-29 07:02:06 (0.189)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21929478, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['132'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.85969\",\"26.15972\",17]},\"properties\":{\"tripId\":59999,\"messageId\":21929629,\"messageDateTime\":\"2021-09-29 07:12:07\",\"messageDateTimeUTC\":\"2021-09-29T12:12:07Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.47\",\"kph\":124.7,\"knots\":67.3,\"bearing\":252,\"nearest\":null,\"messageText\":\"25036:16708:[4]:09-29 07:12:08 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21929629, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['133'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-98.04663\",\"26.18086\",25.7]},\"properties\":{\"tripId\":59999,\"messageId\":21929804,\"messageDateTime\":\"2021-09-29 07:22:08\",\"messageDateTimeUTC\":\"2021-09-29T12:22:08Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"62.46\",\"kph\":100.5,\"knots\":54.3,\"bearing\":283,\"nearest\":null,\"messageText\":\"25131:16803:[4]:09-29 07:22:08 (0.346)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21929804, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['134'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-98.13010\",\"26.19245\",30.4]},\"properties\":{\"tripId\":59999,\"messageId\":21929871,\"messageDateTime\":\"2021-09-29 07:27:09\",\"messageDateTimeUTC\":\"2021-09-29T12:27:09Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"25.22\",\"kph\":40.6,\"knots\":21.9,\"bearing\":278,\"nearest\":null,\"messageText\":\"25172:16844:[4]:09-29 07:27:09 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21929871, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['135'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-98.14738\",\"26.19554\",36.1]},\"properties\":{\"tripId\":59999,\"messageId\":21929964,\"messageDateTime\":\"2021-09-29 07:32:09\",\"messageDateTimeUTC\":\"2021-09-29T12:32:09Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"13.25\",\"kph\":21.3,\"knots\":11.5,\"bearing\":281,\"nearest\":null,\"messageText\":\"25181:16853:[4]:09-29 07:32:09 (0.322)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21929964, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['136'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-98.25060\",\"26.19297\",37.9]},\"properties\":{\"tripId\":59999,\"messageId\":21930129,\"messageDateTime\":\"2021-09-29 07:42:10\",\"messageDateTimeUTC\":\"2021-09-29T12:42:10Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"72.82\",\"kph\":117.2,\"knots\":63.3,\"bearing\":255,\"nearest\":null,\"messageText\":\"25237:16909:[4]:09-29 07:42:10 (0.202)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21930129, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['137'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-98.43517\",\"26.24245\",48.8]},\"properties\":{\"tripId\":59999,\"messageId\":21930335,\"messageDateTime\":\"2021-09-29 07:52:11\",\"messageDateTimeUTC\":\"2021-09-29T12:52:11Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"41.11\",\"kph\":66.2,\"knots\":35.7,\"bearing\":289,\"nearest\":null,\"messageText\":\"25335:17006:[4]:09-29 07:52:11 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21930335, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['138'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-98.52442\",\"26.25532\",55.2]},\"properties\":{\"tripId\":59999,\"messageId\":21930516,\"messageDateTime\":\"2021-09-29 08:02:11\",\"messageDateTimeUTC\":\"2021-09-29T13:02:11Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"73.63\",\"kph\":118.5,\"knots\":64,\"bearing\":279,\"nearest\":null,\"messageText\":\"25380:17051:[4]:09-29 08:02:11 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21930516, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['139'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-98.67088\",\"26.31958\",61.2]},\"properties\":{\"tripId\":59999,\"messageId\":21930715,\"messageDateTime\":\"2021-09-29 08:12:12\",\"messageDateTimeUTC\":\"2021-09-29T13:12:12Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"65.96\",\"kph\":106.2,\"knots\":57.3,\"bearing\":293,\"nearest\":null,\"messageText\":\"25458:17129:[4]:09-29 08:12:12 (0.327)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21930715, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['140'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-98.75202\",\"26.34601\",45.2]},\"properties\":{\"tripId\":59999,\"messageId\":21930807,\"messageDateTime\":\"2021-09-29 08:17:12\",\"messageDateTimeUTC\":\"2021-09-29T13:17:12Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"55.32\",\"kph\":89,\"knots\":48.1,\"bearing\":289,\"nearest\":null,\"messageText\":\"25501:17172:[4]:09-29 08:17:13 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21930807, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['141'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-98.79529\",\"26.36872\",51.3]},\"properties\":{\"tripId\":59999,\"messageId\":21930913,\"messageDateTime\":\"2021-09-29 08:22:13\",\"messageDateTimeUTC\":\"2021-09-29T13:22:13Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"17.13\",\"kph\":27.6,\"knots\":14.9,\"bearing\":300,\"nearest\":null,\"messageText\":\"25525:17196:[4]:09-29 08:22:13 (0.328)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21930913, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['142'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-98.90137\",\"26.38439\",51.1]},\"properties\":{\"tripId\":59999,\"messageId\":21931092,\"messageDateTime\":\"2021-09-29 08:32:14\",\"messageDateTimeUTC\":\"2021-09-29T13:32:14Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"8.43\",\"kph\":13.6,\"knots\":7.3,\"bearing\":274,\"nearest\":null,\"messageText\":\"25583:17254:[4]:09-29 08:32:14 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21931092, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['143'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.01119\",\"26.40283\",59.4]},\"properties\":{\"tripId\":59999,\"messageId\":21931312,\"messageDateTime\":\"2021-09-29 08:42:15\",\"messageDateTimeUTC\":\"2021-09-29T13:42:15Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"36.04\",\"kph\":58,\"knots\":31.3,\"bearing\":262,\"nearest\":null,\"messageText\":\"25640:17311:[4]:09-29 08:42:15 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21931312, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['144'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.08591\",\"26.51962\",100.2]},\"properties\":{\"tripId\":59999,\"messageId\":21931562,\"messageDateTime\":\"2021-09-29 08:52:15\",\"messageDateTimeUTC\":\"2021-09-29T13:52:15Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"69.69\",\"kph\":112.2,\"knots\":60.6,\"bearing\":321,\"nearest\":null,\"messageText\":\"25717:17386:[4]:09-29 08:52:15 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21931562, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['145'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.10852\",\"26.68995\",102.1]},\"properties\":{\"tripId\":59999,\"messageId\":21931771,\"messageDateTime\":\"2021-09-29 09:02:16\",\"messageDateTimeUTC\":\"2021-09-29T14:02:16Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"72.34\",\"kph\":116.4,\"knots\":62.9,\"bearing\":347,\"nearest\":null,\"messageText\":\"25804:17473:[4]:09-29 09:02:16 (0.297)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21931771, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['146'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.12194\",\"26.77935\",125.6]},\"properties\":{\"tripId\":59999,\"messageId\":21931894,\"messageDateTime\":\"2021-09-29 09:07:16\",\"messageDateTimeUTC\":\"2021-09-29T14:07:16Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.63\",\"kph\":126.5,\"knots\":68.3,\"bearing\":352,\"nearest\":null,\"messageText\":\"25852:17521:[4]:09-29 09:07:17 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21931894, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['147'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.16400\",\"26.82192\",136.4]},\"properties\":{\"tripId\":59999,\"messageId\":21932018,\"messageDateTime\":\"2021-09-29 09:12:17\",\"messageDateTimeUTC\":\"2021-09-29T14:12:17Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":318,\"nearest\":null,\"messageText\":\"25883:17552:[4]:09-29 09:12:17 (0.285)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21932018, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['148'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.26742\",\"26.90220\",125.9]},\"properties\":{\"tripId\":59999,\"messageId\":21932257,\"messageDateTime\":\"2021-09-29 09:22:18\",\"messageDateTimeUTC\":\"2021-09-29T14:22:18Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"44.94\",\"kph\":72.3,\"knots\":39.1,\"bearing\":319,\"nearest\":null,\"messageText\":\"25954:17623:[4]:09-29 09:22:18 (0.191)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21932257, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['149'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.38375\",\"27.00618\",105.2]},\"properties\":{\"tripId\":59999,\"messageId\":21932506,\"messageDateTime\":\"2021-09-29 09:32:18\",\"messageDateTimeUTC\":\"2021-09-29T14:32:18Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"71.89\",\"kph\":115.7,\"knots\":62.5,\"bearing\":315,\"nearest\":null,\"messageText\":\"26031:17700:[4]:09-29 09:32:18 (0.189)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21932506, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['150'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.42278\",\"27.15168\",110.1]},\"properties\":{\"tripId\":59999,\"messageId\":21932744,\"messageDateTime\":\"2021-09-29 09:42:19\",\"messageDateTimeUTC\":\"2021-09-29T14:42:19Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.77\",\"kph\":123.5,\"knots\":66.7,\"bearing\":6,\"nearest\":null,\"messageText\":\"26120:17789:[4]:09-29 09:42:19 (0.308)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21932744, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['151'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.44143\",\"27.33219\",148.7]},\"properties\":{\"tripId\":59999,\"messageId\":21932991,\"messageDateTime\":\"2021-09-29 09:52:20\",\"messageDateTimeUTC\":\"2021-09-29T14:52:20Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"75.54\",\"kph\":121.6,\"knots\":65.6,\"bearing\":347,\"nearest\":null,\"messageText\":\"26221:17890:[4]:09-29 09:52:20 (0.330)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21932991, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['152'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.47035\",\"27.40077\",149.7]},\"properties\":{\"tripId\":59999,\"messageId\":21933118,\"messageDateTime\":\"2021-09-29 09:57:20\",\"messageDateTimeUTC\":\"2021-09-29T14:57:20Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"71.90\",\"kph\":115.7,\"knots\":62.5,\"bearing\":339,\"nearest\":null,\"messageText\":\"26265:17934:[4]:09-29 09:57:20 (0.380)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21933118, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['153'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.45133\",\"27.46230\",176.7]},\"properties\":{\"tripId\":59999,\"messageId\":21933223,\"messageDateTime\":\"2021-09-29 10:02:21\",\"messageDateTimeUTC\":\"2021-09-29T15:02:21Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"67.34\",\"kph\":108.4,\"knots\":58.5,\"bearing\":15,\"nearest\":null,\"messageText\":\"26307:17976:[4]:09-29 10:02:21 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21933223, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['154'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.48964\",\"27.50640\",139.2]},\"properties\":{\"tripId\":59999,\"messageId\":21933471,\"messageDateTime\":\"2021-09-29 10:12:21\",\"messageDateTimeUTC\":\"2021-09-29T15:12:21Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":284,\"nearest\":null,\"messageText\":\"26351:18020:[17]:09-29 10:12:22 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21933471, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['155'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.50232\",\"27.53060\",128.1]},\"properties\":{\"tripId\":59999,\"messageId\":21933723,\"messageDateTime\":\"2021-09-29 10:22:22\",\"messageDateTimeUTC\":\"2021-09-29T15:22:22Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":146,\"nearest\":null,\"messageText\":\"26404:18073:[10]:09-29 10:22:22 (0.181)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21933723, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['156'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.48809\",\"27.63346\",181.5]},\"properties\":{\"tripId\":59999,\"messageId\":21934005,\"messageDateTime\":\"2021-09-29 10:32:23\",\"messageDateTimeUTC\":\"2021-09-29T15:32:23Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.81\",\"kph\":126.8,\"knots\":68.5,\"bearing\":9,\"nearest\":null,\"messageText\":\"26459:18128:[4]:09-29 10:32:23 (0.258)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21934005, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['157'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.41841\",\"27.80493\",203.3]},\"properties\":{\"tripId\":59999,\"messageId\":21934230,\"messageDateTime\":\"2021-09-29 10:42:24\",\"messageDateTimeUTC\":\"2021-09-29T15:42:24Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.60\",\"kph\":124.9,\"knots\":67.4,\"bearing\":17,\"nearest\":null,\"messageText\":\"26566:18235:[4]:09-29 10:42:24 (0.191)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21934230, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['158'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.46545\",\"27.82100\",239.5]},\"properties\":{\"tripId\":59999,\"messageId\":21934352,\"messageDateTime\":\"2021-09-29 10:47:24\",\"messageDateTimeUTC\":\"2021-09-29T15:47:24Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"9.45\",\"kph\":15.2,\"knots\":8.2,\"bearing\":291,\"nearest\":null,\"messageText\":\"26613:18282:[4]:09-29 10:47:24 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21934352, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['159'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.48544\",\"27.90567\",241.4]},\"properties\":{\"tripId\":59999,\"messageId\":21934477,\"messageDateTime\":\"2021-09-29 10:52:24\",\"messageDateTimeUTC\":\"2021-09-29T15:52:24Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.10\",\"kph\":125.7,\"knots\":67.9,\"bearing\":348,\"nearest\":null,\"messageText\":\"26660:18329:[4]:09-29 10:52:25 (0.191)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21934477, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['160'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.55622\",\"28.05779\",278.3]},\"properties\":{\"tripId\":59999,\"messageId\":21934727,\"messageDateTime\":\"2021-09-29 11:02:25\",\"messageDateTimeUTC\":\"2021-09-29T16:02:25Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"63.85\",\"kph\":102.8,\"knots\":55.5,\"bearing\":340,\"nearest\":null,\"messageText\":\"26746:18415:[4]:09-29 11:02:25 (0.442)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21934727, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['161'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.61423\",\"28.21586\",206.5]},\"properties\":{\"tripId\":59999,\"messageId\":21934961,\"messageDateTime\":\"2021-09-29 11:12:26\",\"messageDateTimeUTC\":\"2021-09-29T16:12:26Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"71.82\",\"kph\":115.6,\"knots\":62.4,\"bearing\":347,\"nearest\":null,\"messageText\":\"26833:18502:[4]:09-29 11:12:26 (0.280)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21934961, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['162'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.64589\",\"28.37326\",182.8]},\"properties\":{\"tripId\":59999,\"messageId\":21935225,\"messageDateTime\":\"2021-09-29 11:22:27\",\"messageDateTimeUTC\":\"2021-09-29T16:22:27Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"75.74\",\"kph\":121.9,\"knots\":65.8,\"bearing\":337,\"nearest\":null,\"messageText\":\"26924:18593:[4]:09-29 11:22:27 (0.295)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21935225, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['163'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.79978\",\"28.47179\",182.9]},\"properties\":{\"tripId\":59999,\"messageId\":21935459,\"messageDateTime\":\"2021-09-29 11:32:28\",\"messageDateTimeUTC\":\"2021-09-29T16:32:28Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"63.59\",\"kph\":102.3,\"knots\":55.3,\"bearing\":307,\"nearest\":null,\"messageText\":\"27016:18685:[4]:09-29 11:32:28 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21935459, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['164'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.85646\",\"28.52286\",196]},\"properties\":{\"tripId\":59999,\"messageId\":21935565,\"messageDateTime\":\"2021-09-29 11:37:29\",\"messageDateTimeUTC\":\"2021-09-29T16:37:29Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"33.70\",\"kph\":54.2,\"knots\":29.3,\"bearing\":315,\"nearest\":null,\"messageText\":\"27058:18727:[4]:09-29 11:37:29 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21935565, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['165'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.85565\",\"28.52369\",196.7]},\"properties\":{\"tripId\":59999,\"messageId\":21935695,\"messageDateTime\":\"2021-09-29 11:42:29\",\"messageDateTimeUTC\":\"2021-09-29T16:42:29Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":40,\"nearest\":null,\"messageText\":\"27059:18728:[10]:09-29 11:42:29 (0.327)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21935695, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['166'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.89712\",\"28.55830\",215.6]},\"properties\":{\"tripId\":59999,\"messageId\":21936487,\"messageDateTime\":\"2021-09-29 12:14:41\",\"messageDateTimeUTC\":\"2021-09-29T17:14:41Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"68.21\",\"kph\":109.8,\"knots\":59.3,\"bearing\":316,\"nearest\":null,\"messageText\":\"27805:18759:[4]:09-29 12:14:41 (0.184)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21936487, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['167'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.06532\",\"28.62601\",221.5]},\"properties\":{\"tripId\":59999,\"messageId\":21936753,\"messageDateTime\":\"2021-09-29 12:24:42\",\"messageDateTimeUTC\":\"2021-09-29T17:24:42Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.90\",\"kph\":127,\"knots\":68.6,\"bearing\":270,\"nearest\":null,\"messageText\":\"27904:18858:[4]:09-29 12:24:42 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21936753, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['168'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.27725\",\"28.66397\",255.9]},\"properties\":{\"tripId\":59999,\"messageId\":21937034,\"messageDateTime\":\"2021-09-29 12:34:43\",\"messageDateTimeUTC\":\"2021-09-29T17:34:43Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"80.77\",\"kph\":130,\"knots\":70.2,\"bearing\":283,\"nearest\":null,\"messageText\":\"28005:18959:[4]:09-29 12:34:43 (0.180)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21937034, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['169'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.46447\",\"28.71104\",266.7]},\"properties\":{\"tripId\":59999,\"messageId\":21937277,\"messageDateTime\":\"2021-09-29 12:44:44\",\"messageDateTimeUTC\":\"2021-09-29T17:44:44Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"48.70\",\"kph\":78.4,\"knots\":42.3,\"bearing\":284,\"nearest\":null,\"messageText\":\"28097:19051:[4]:09-29 12:44:44 (0.319)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21937277, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['170'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.49655\",\"28.74306\",240]},\"properties\":{\"tripId\":59999,\"messageId\":21937396,\"messageDateTime\":\"2021-09-29 12:49:44\",\"messageDateTimeUTC\":\"2021-09-29T17:49:44Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"47.72\",\"kph\":76.8,\"knots\":41.5,\"bearing\":318,\"nearest\":null,\"messageText\":\"28127:19081:[4]:09-29 12:49:44 (0.433)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21937396, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['171'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.50707\",\"28.77648\",239.9]},\"properties\":{\"tripId\":59999,\"messageId\":21937553,\"messageDateTime\":\"2021-09-29 12:54:45\",\"messageDateTimeUTC\":\"2021-09-29T17:54:45Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"54.14\",\"kph\":87.1,\"knots\":47,\"bearing\":344,\"nearest\":null,\"messageText\":\"28149:19103:[4]:09-29 12:54:45 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21937553, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['172'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.60223\",\"28.91297\",253.1]},\"properties\":{\"tripId\":59999,\"messageId\":21937791,\"messageDateTime\":\"2021-09-29 13:04:46\",\"messageDateTimeUTC\":\"2021-09-29T18:04:46Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"59.90\",\"kph\":96.4,\"knots\":52.1,\"bearing\":316,\"nearest\":null,\"messageText\":\"28235:19189:[4]:09-29 13:04:46 (0.193)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21937791, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['173'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.63988\",\"29.06849\",291.8]},\"properties\":{\"tripId\":59999,\"messageId\":21938048,\"messageDateTime\":\"2021-09-29 13:14:46\",\"messageDateTimeUTC\":\"2021-09-29T18:14:46Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"75.27\",\"kph\":121.1,\"knots\":65.4,\"bearing\":356,\"nearest\":null,\"messageText\":\"28321:19275:[4]:09-29 13:14:46 (0.456)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21938048, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['174'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.73721\",\"29.22920\",330.2]},\"properties\":{\"tripId\":59999,\"messageId\":21938262,\"messageDateTime\":\"2021-09-29 13:24:46\",\"messageDateTimeUTC\":\"2021-09-29T18:24:46Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.01\",\"kph\":123.9,\"knots\":66.9,\"bearing\":322,\"nearest\":null,\"messageText\":\"28420:19374:[4]:09-29 13:24:46 (0.320)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21938262, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['175'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.87358\",\"29.35513\",322.2]},\"properties\":{\"tripId\":59999,\"messageId\":21938540,\"messageDateTime\":\"2021-09-29 13:34:47\",\"messageDateTimeUTC\":\"2021-09-29T18:34:47Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"69.36\",\"kph\":111.6,\"knots\":60.3,\"bearing\":304,\"nearest\":null,\"messageText\":\"28516:19470:[4]:09-29 13:34:47 (0.183)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21938540, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['176'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.90071\",\"29.38132\",358.9]},\"properties\":{\"tripId\":59999,\"messageId\":21938636,\"messageDateTime\":\"2021-09-29 13:39:47\",\"messageDateTimeUTC\":\"2021-09-29T18:39:47Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"41.70\",\"kph\":67.1,\"knots\":36.2,\"bearing\":317,\"nearest\":null,\"messageText\":\"28535:19488:[4]:09-29 13:39:47 (0.321)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21938636, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['177'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.90568\",\"29.38608\",354.1]},\"properties\":{\"tripId\":59999,\"messageId\":21938792,\"messageDateTime\":\"2021-09-29 13:44:47\",\"messageDateTimeUTC\":\"2021-09-29T18:44:47Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":317,\"nearest\":null,\"messageText\":\"28541:19494:[4]:09-29 13:44:48 (0.198)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21938792, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['178'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.92571\",\"29.44905\",379]},\"properties\":{\"tripId\":59999,\"messageId\":21938988,\"messageDateTime\":\"2021-09-29 13:55:33\",\"messageDateTimeUTC\":\"2021-09-29T18:55:33Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"74.10\",\"kph\":119.3,\"knots\":64.4,\"bearing\":343,\"nearest\":null,\"messageText\":\"28636:19530:[4]:09-29 13:55:33 (0.335)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21938988, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['179'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-101.07847\",\"29.54058\",403.6]},\"properties\":{\"tripId\":59999,\"messageId\":21939226,\"messageDateTime\":\"2021-09-29 14:05:34\",\"messageDateTimeUTC\":\"2021-09-29T19:05:34Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.67\",\"kph\":123.4,\"knots\":66.6,\"bearing\":325,\"nearest\":null,\"messageText\":\"28726:19620:[4]:09-29 14:05:34 (0.266)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21939226, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['180'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-101.15676\",\"29.67396\",521.4]},\"properties\":{\"tripId\":59999,\"messageId\":21939505,\"messageDateTime\":\"2021-09-29 14:15:35\",\"messageDateTimeUTC\":\"2021-09-29T19:15:35Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.31\",\"kph\":124.4,\"knots\":67.2,\"bearing\":319,\"nearest\":null,\"messageText\":\"28819:19713:[4]:09-29 14:15:35 (0.336)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21939505, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['181'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-101.35021\",\"29.70741\",439.7]},\"properties\":{\"tripId\":59999,\"messageId\":21939851,\"messageDateTime\":\"2021-09-29 14:25:36\",\"messageDateTimeUTC\":\"2021-09-29T19:25:36Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.75\",\"kph\":126.7,\"knots\":68.4,\"bearing\":268,\"nearest\":null,\"messageText\":\"28917:19811:[4]:09-29 14:25:36 (220.229)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21939851, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['182'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-101.40097\",\"29.78171\",475.5]},\"properties\":{\"tripId\":59999,\"messageId\":21940327,\"messageDateTime\":\"2021-09-29 14:30:36\",\"messageDateTimeUTC\":\"2021-09-29T19:30:36Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.71\",\"kph\":125.1,\"knots\":67.5,\"bearing\":329,\"nearest\":null,\"messageText\":\"28967:19861:[4]:09-29 14:30:36 (953.332)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21940327, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['183'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-101.49915\",\"29.80764\",495.7]},\"properties\":{\"tripId\":59999,\"messageId\":21940328,\"messageDateTime\":\"2021-09-29 14:35:36\",\"messageDateTimeUTC\":\"2021-09-29T19:35:36Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.06\",\"kph\":122.4,\"knots\":66.1,\"bearing\":286,\"nearest\":null,\"messageText\":\"29017:19911:[4]:09-29 14:35:36 (663.279)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21940328, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['184'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-101.69761\",\"29.85862\",593.1]},\"properties\":{\"tripId\":59999,\"messageId\":21940330,\"messageDateTime\":\"2021-09-29 14:45:37\",\"messageDateTimeUTC\":\"2021-09-29T19:45:37Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.24\",\"kph\":125.9,\"knots\":68,\"bearing\":296,\"nearest\":null,\"messageText\":\"29118:20012:[4]:09-29 14:45:37 (62.865)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21940330, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['185'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-101.88041\",\"29.90818\",610.3]},\"properties\":{\"tripId\":59999,\"messageId\":21940595,\"messageDateTime\":\"2021-09-29 14:55:38\",\"messageDateTimeUTC\":\"2021-09-29T19:55:38Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"79.32\",\"kph\":127.7,\"knots\":68.9,\"bearing\":273,\"nearest\":null,\"messageText\":\"29219:20113:[4]:09-29 14:55:38 (151.695)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21940595, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['186'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.05142\",\"30.00847\",708.8]},\"properties\":{\"tripId\":59999,\"messageId\":21940768,\"messageDateTime\":\"2021-09-29 15:05:39\",\"messageDateTimeUTC\":\"2021-09-29T20:05:39Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.49\",\"kph\":126.3,\"knots\":68.2,\"bearing\":314,\"nearest\":null,\"messageText\":\"29334:20228:[4]:09-29 15:05:39 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21940768, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['187'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.24909\",\"30.05908\",803.1]},\"properties\":{\"tripId\":59999,\"messageId\":21941018,\"messageDateTime\":\"2021-09-29 15:15:39\",\"messageDateTimeUTC\":\"2021-09-29T20:15:39Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.49\",\"kph\":126.3,\"knots\":68.2,\"bearing\":275,\"nearest\":null,\"messageText\":\"29433:20327:[4]:09-29 15:15:39 (0.363)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21941018, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['188'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.35225\",\"30.07746\",887]},\"properties\":{\"tripId\":59999,\"messageId\":21941164,\"messageDateTime\":\"2021-09-29 15:20:40\",\"messageDateTimeUTC\":\"2021-09-29T20:20:40Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.51\",\"kph\":123.1,\"knots\":66.5,\"bearing\":281,\"nearest\":null,\"messageText\":\"29484:20378:[4]:09-29 15:20:40 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21941164, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['189'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.38669\",\"30.13678\",931]},\"properties\":{\"tripId\":59999,\"messageId\":21941227,\"messageDateTime\":\"2021-09-29 15:25:40\",\"messageDateTimeUTC\":\"2021-09-29T20:25:40Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":333,\"nearest\":null,\"messageText\":\"29524:20418:[7]:09-29 15:25:40 (0.270)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21941227, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['190'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.45495\",\"30.15941\",993.9]},\"properties\":{\"tripId\":59999,\"messageId\":21941525,\"messageDateTime\":\"2021-09-29 15:37:37\",\"messageDateTimeUTC\":\"2021-09-29T20:37:37Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.84\",\"kph\":125.3,\"knots\":67.6,\"bearing\":290,\"nearest\":null,\"messageText\":\"29598:20455:[4]:09-29 15:37:37 (0.326)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21941525, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['191'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.64938\",\"30.16284\",1149.5]},\"properties\":{\"tripId\":59999,\"messageId\":21941795,\"messageDateTime\":\"2021-09-29 15:47:38\",\"messageDateTimeUTC\":\"2021-09-29T20:47:38Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"79.22\",\"kph\":127.5,\"knots\":68.8,\"bearing\":285,\"nearest\":null,\"messageText\":\"29699:20556:[4]:09-29 15:47:38 (58.543)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21941795, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['192'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.86174\",\"30.18901\",1393.5]},\"properties\":{\"tripId\":59999,\"messageId\":21942056,\"messageDateTime\":\"2021-09-29 15:57:38\",\"messageDateTimeUTC\":\"2021-09-29T20:57:38Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.35\",\"kph\":126.1,\"knots\":68.1,\"bearing\":278,\"nearest\":null,\"messageText\":\"29799:20656:[4]:09-29 15:57:38 (178.588)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21942056, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['193'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.07127\",\"30.21290\",1384.5]},\"properties\":{\"tripId\":59999,\"messageId\":21942220,\"messageDateTime\":\"2021-09-29 16:07:39\",\"messageDateTimeUTC\":\"2021-09-29T21:07:39Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.93\",\"kph\":125.4,\"knots\":67.7,\"bearing\":275,\"nearest\":null,\"messageText\":\"29900:20757:[4]:09-29 16:07:39 (0.191)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21942220, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['194'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.18125\",\"30.21020\",1411.2]},\"properties\":{\"tripId\":59999,\"messageId\":21942339,\"messageDateTime\":\"2021-09-29 16:12:40\",\"messageDateTimeUTC\":\"2021-09-29T21:12:40Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.32\",\"kph\":126,\"knots\":68.1,\"bearing\":268,\"nearest\":null,\"messageText\":\"29951:20808:[4]:09-29 16:12:40 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21942339, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['195'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.23576\",\"30.20685\",1379.6]},\"properties\":{\"tripId\":59999,\"messageId\":21942438,\"messageDateTime\":\"2021-09-29 16:17:40\",\"messageDateTimeUTC\":\"2021-09-29T21:17:40Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":265,\"nearest\":null,\"messageText\":\"29977:20834:[4]:09-29 16:17:40 (0.287)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21942438, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['196'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.24498\",\"30.12558\",1338.1]},\"properties\":{\"tripId\":59999,\"messageId\":21942934,\"messageDateTime\":\"2021-09-29 16:40:01\",\"messageDateTimeUTC\":\"2021-09-29T21:40:01Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.17\",\"kph\":125.8,\"knots\":67.9,\"bearing\":184,\"nearest\":null,\"messageText\":\"30418:20880:[4]:09-29 16:40:01 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21942934, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['197'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.25310\",\"29.94901\",1163.6]},\"properties\":{\"tripId\":59999,\"messageId\":21943460,\"messageDateTime\":\"2021-09-29 16:50:01\",\"messageDateTimeUTC\":\"2021-09-29T21:50:01Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"79.45\",\"kph\":127.9,\"knots\":69,\"bearing\":164,\"nearest\":null,\"messageText\":\"30518:20980:[4]:09-29 16:50:01 (733.705)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21943460, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['198'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.17921\",\"29.78688\",980.7]},\"properties\":{\"tripId\":59999,\"messageId\":21943462,\"messageDateTime\":\"2021-09-29 17:00:02\",\"messageDateTimeUTC\":\"2021-09-29T22:00:02Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.98\",\"kph\":127.1,\"knots\":68.6,\"bearing\":140,\"nearest\":null,\"messageText\":\"30619:21081:[4]:09-29 17:00:02 (139.739)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21943462, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['199'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.17362\",\"29.65944\",971.9]},\"properties\":{\"tripId\":59999,\"messageId\":21947250,\"messageDateTime\":\"2021-09-29 17:10:03\",\"messageDateTimeUTC\":\"2021-09-29T22:10:03Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"16.53\",\"kph\":26.6,\"knots\":14.4,\"bearing\":193,\"nearest\":null,\"messageText\":\"30691:21153:[4]:09-29 17:10:03 (0.412)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21947250, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['200'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.14192\",\"29.59466\",879.5]},\"properties\":{\"tripId\":59999,\"messageId\":21947333,\"messageDateTime\":\"2021-09-29 17:15:03\",\"messageDateTimeUTC\":\"2021-09-29T22:15:03Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"67.12\",\"kph\":108,\"knots\":58.3,\"bearing\":156,\"nearest\":null,\"messageText\":\"30732:21194:[4]:09-29 17:15:03 (0.553)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21947333, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['201'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.12084\",\"29.51649\",1002]},\"properties\":{\"tripId\":59999,\"messageId\":21947433,\"messageDateTime\":\"2021-09-29 17:20:04\",\"messageDateTimeUTC\":\"2021-09-29T22:20:04Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"67.83\",\"kph\":109.2,\"knots\":58.9,\"bearing\":166,\"nearest\":null,\"messageText\":\"30776:21238:[4]:09-29 17:20:04 (0.198)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21947433, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['202'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.15747\",\"29.37491\",1050.9]},\"properties\":{\"tripId\":59999,\"messageId\":21947623,\"messageDateTime\":\"2021-09-29 17:30:05\",\"messageDateTimeUTC\":\"2021-09-29T22:30:05Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"59.05\",\"kph\":95,\"knots\":51.3,\"bearing\":194,\"nearest\":null,\"messageText\":\"30857:21319:[4]:09-29 17:30:05 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21947623, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['203'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.20717\",\"29.32900\",1273.5]},\"properties\":{\"tripId\":59999,\"messageId\":21947920,\"messageDateTime\":\"2021-09-29 17:43:59\",\"messageDateTimeUTC\":\"2021-09-29T22:43:59Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"37.71\",\"kph\":60.7,\"knots\":32.8,\"bearing\":311,\"nearest\":null,\"messageText\":\"31317:21356:[4]:09-29 17:43:59 (0.181)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21947920, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['204'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.34127\",\"29.33412\",1169]},\"properties\":{\"tripId\":59999,\"messageId\":21948256,\"messageDateTime\":\"2021-09-29 17:54:00\",\"messageDateTimeUTC\":\"2021-09-29T22:54:00Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"62.16\",\"kph\":100,\"knots\":54,\"bearing\":258,\"nearest\":null,\"messageText\":\"31918:21948:[4]:09-29 17:54:00 (421.719)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21948256, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['205'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.47787\",\"29.30775\",964.6]},\"properties\":{\"tripId\":59999,\"messageId\":21948353,\"messageDateTime\":\"2021-09-29 18:04:01\",\"messageDateTimeUTC\":\"2021-09-29T23:04:01Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"59.42\",\"kph\":95.6,\"knots\":51.6,\"bearing\":258,\"nearest\":null,\"messageText\":\"32519:22542:[4]:09-29 18:04:01 (60.732)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21948353, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['206'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.53327\",\"29.32080\",872]},\"properties\":{\"tripId\":59999,\"messageId\":21948412,\"messageDateTime\":\"2021-09-29 18:09:01\",\"messageDateTimeUTC\":\"2021-09-29T23:09:01Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"59.41\",\"kph\":95.6,\"knots\":51.6,\"bearing\":285,\"nearest\":null,\"messageText\":\"32819:22839:[4]:09-29 18:09:01 (0.193)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21948412, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['207'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.59888\",\"29.32184\",936.7]},\"properties\":{\"tripId\":59999,\"messageId\":21948465,\"messageDateTime\":\"2021-09-29 18:14:01\",\"messageDateTimeUTC\":\"2021-09-29T23:14:01Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"62.31\",\"kph\":100.3,\"knots\":54.1,\"bearing\":271,\"nearest\":null,\"messageText\":\"33119:23136:[4]:09-29 18:14:01 (0.183)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21948465, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['208'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.76115\",\"29.26887\",805.5]},\"properties\":{\"tripId\":59999,\"messageId\":21948610,\"messageDateTime\":\"2021-09-29 18:24:02\",\"messageDateTimeUTC\":\"2021-09-29T23:24:02Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"66.68\",\"kph\":107.3,\"knots\":57.9,\"bearing\":245,\"nearest\":null,\"messageText\":\"33720:23731:[4]:09-29 18:24:02 (0.190)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21948610, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['209'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.77177\",\"29.26211\",790.8]},\"properties\":{\"tripId\":59999,\"messageId\":21948889,\"messageDateTime\":\"2021-09-29 18:45:35\",\"messageDateTimeUTC\":\"2021-09-29T23:45:35Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"28.99\",\"kph\":46.7,\"knots\":25.2,\"bearing\":237,\"nearest\":null,\"messageText\":\"34851:24030:[4]:09-29 18:45:35 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21948889, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['210'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.88234\",\"29.28562\",793.8]},\"properties\":{\"tripId\":59999,\"messageId\":21949815,\"messageDateTime\":\"2021-09-29 18:55:36\",\"messageDateTimeUTC\":\"2021-09-29T23:55:36Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"49.89\",\"kph\":80.3,\"knots\":43.4,\"bearing\":286,\"nearest\":null,\"messageText\":\"34923:24102:[4]:09-29 18:55:36 (1603.288)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21949815, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['211'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.97708\",\"29.31927\",912]},\"properties\":{\"tripId\":59999,\"messageId\":21949817,\"messageDateTime\":\"2021-09-29 19:05:37\",\"messageDateTimeUTC\":\"2021-09-30T00:05:37Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"52.39\",\"kph\":84.3,\"knots\":45.5,\"bearing\":307,\"nearest\":null,\"messageText\":\"34979:24158:[4]:09-29 19:05:37 (1002.962)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21949817, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['212'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.05056\",\"29.33302\",836.5]},\"properties\":{\"tripId\":59999,\"messageId\":21949818,\"messageDateTime\":\"2021-09-29 19:10:37\",\"messageDateTimeUTC\":\"2021-09-30T00:10:37Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"39.54\",\"kph\":63.6,\"knots\":34.4,\"bearing\":282,\"nearest\":null,\"messageText\":\"35016:24195:[4]:09-29 19:10:37 (703.190)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21949818, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['213'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.09633\",\"29.36820\",845.1]},\"properties\":{\"tripId\":59999,\"messageId\":21949849,\"messageDateTime\":\"2021-09-29 19:15:38\",\"messageDateTimeUTC\":\"2021-09-30T00:15:38Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"59.38\",\"kph\":95.6,\"knots\":51.6,\"bearing\":311,\"nearest\":null,\"messageText\":\"35047:24226:[4]:09-29 19:15:38 (584.078)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21949849, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['214'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.20468\",\"29.47375\",867.9]},\"properties\":{\"tripId\":59999,\"messageId\":21949852,\"messageDateTime\":\"2021-09-29 19:25:39\",\"messageDateTimeUTC\":\"2021-09-30T00:25:39Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"65.85\",\"kph\":106,\"knots\":57.2,\"bearing\":335,\"nearest\":null,\"messageText\":\"35128:24307:[4]:09-29 19:25:39 (0.194)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21949852, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['215'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.31940\",\"29.54219\",873.8]},\"properties\":{\"tripId\":59999,\"messageId\":21950073,\"messageDateTime\":\"2021-09-29 19:35:39\",\"messageDateTimeUTC\":\"2021-09-30T00:35:39Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"53.54\",\"kph\":86.2,\"knots\":46.5,\"bearing\":297,\"nearest\":null,\"messageText\":\"35203:24382:[4]:09-29 19:35:39 (0.460)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21950073, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['216'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.37213\",\"29.56055\",857.4]},\"properties\":{\"tripId\":59999,\"messageId\":21950251,\"messageDateTime\":\"2021-09-29 19:45:40\",\"messageDateTimeUTC\":\"2021-09-30T00:45:40Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":267,\"nearest\":null,\"messageText\":\"35235:24414:[4]:09-29 19:45:40 (0.321)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21950251, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['217'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.36383\",\"29.60383\",955]},\"properties\":{\"tripId\":59999,\"messageId\":21950475,\"messageDateTime\":\"2021-09-29 19:58:29\",\"messageDateTimeUTC\":\"2021-09-30T00:58:29Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"68.90\",\"kph\":110.9,\"knots\":59.9,\"bearing\":9,\"nearest\":null,\"messageText\":\"35719:24708:[4]:09-29 19:58:29 (0.183)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21950475, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['218'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.36013\",\"29.69294\",1098.1]},\"properties\":{\"tripId\":59999,\"messageId\":21950535,\"messageDateTime\":\"2021-09-29 20:03:30\",\"messageDateTimeUTC\":\"2021-09-30T01:03:30Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.28\",\"kph\":122.8,\"knots\":66.3,\"bearing\":2,\"nearest\":null,\"messageText\":\"36020:25006:[4]:09-29 20:03:30 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21950535, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['219'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.34073\",\"29.77954\",1333.3]},\"properties\":{\"tripId\":59999,\"messageId\":21950636,\"messageDateTime\":\"2021-09-29 20:08:30\",\"messageDateTimeUTC\":\"2021-09-30T01:08:30Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"74.06\",\"kph\":119.2,\"knots\":64.4,\"bearing\":11,\"nearest\":null,\"messageText\":\"36320:25303:[4]:09-29 20:08:30 (0.184)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21950636, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['220'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.27198\",\"29.90277\",1511.3]},\"properties\":{\"tripId\":59999,\"messageId\":21950792,\"messageDateTime\":\"2021-09-29 20:18:31\",\"messageDateTimeUTC\":\"2021-09-30T01:18:31Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.30\",\"kph\":122.8,\"knots\":66.3,\"bearing\":25,\"nearest\":null,\"messageText\":\"36921:25898:[4]:09-29 20:18:31 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21950792, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['221'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.18213\",\"30.05294\",1761.6]},\"properties\":{\"tripId\":59999,\"messageId\":21950928,\"messageDateTime\":\"2021-09-29 20:28:32\",\"messageDateTimeUTC\":\"2021-09-30T01:28:32Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"73.60\",\"kph\":118.4,\"knots\":64,\"bearing\":24,\"nearest\":null,\"messageText\":\"37522:26493:[4]:09-29 20:28:32 (0.190)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21950928, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['222'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.07081\",\"30.20118\",1523.3]},\"properties\":{\"tripId\":59999,\"messageId\":21951091,\"messageDateTime\":\"2021-09-29 20:38:32\",\"messageDateTimeUTC\":\"2021-09-30T01:38:32Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"75.54\",\"kph\":121.6,\"knots\":65.6,\"bearing\":33,\"nearest\":null,\"messageText\":\"38122:27087:[4]:09-29 20:38:32 (36.588)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21951091, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['223'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.02087\",\"30.30950\",1604.9]},\"properties\":{\"tripId\":59999,\"messageId\":21951240,\"messageDateTime\":\"2021-09-29 20:48:33\",\"messageDateTimeUTC\":\"2021-09-30T01:48:33Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":23,\"nearest\":null,\"messageText\":\"38723:27682:[4]:09-29 20:48:33 (0.168)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21951240, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['224'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.02739\",\"30.30769\",1597.7]},\"properties\":{\"tripId\":59999,\"messageId\":21951327,\"messageDateTime\":\"2021-09-29 20:53:33\",\"messageDateTimeUTC\":\"2021-09-30T01:53:33Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"27.22\",\"kph\":43.8,\"knots\":23.7,\"bearing\":252,\"nearest\":null,\"messageText\":\"39023:27726:[4]:09-29 20:53:33 (0.206)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21951327, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['225'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.10568\",\"30.32726\",1648.6]},\"properties\":{\"tripId\":59999,\"messageId\":21951402,\"messageDateTime\":\"2021-09-29 20:58:33\",\"messageDateTimeUTC\":\"2021-09-30T01:58:33Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.92\",\"kph\":125.4,\"knots\":67.7,\"bearing\":286,\"nearest\":null,\"messageText\":\"39324:28019:[4]:09-29 20:58:34 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21951402, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['226'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.28936\",\"30.42222\",1626.2]},\"properties\":{\"tripId\":59999,\"messageId\":21951562,\"messageDateTime\":\"2021-09-29 21:08:34\",\"messageDateTimeUTC\":\"2021-09-30T02:08:34Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.02\",\"kph\":124,\"knots\":66.9,\"bearing\":306,\"nearest\":null,\"messageText\":\"39925:28614:[4]:09-29 21:08:35 (0.190)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21951562, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['227'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.44349\",\"30.54445\",1543.4]},\"properties\":{\"tripId\":59999,\"messageId\":21951707,\"messageDateTime\":\"2021-09-29 21:18:35\",\"messageDateTimeUTC\":\"2021-09-30T02:18:35Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.52\",\"kph\":126.4,\"knots\":68.2,\"bearing\":312,\"nearest\":null,\"messageText\":\"40525:29208:[4]:09-29 21:18:35 (0.184)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21951707, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['228'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.51847\",\"30.60349\",1494.5]},\"properties\":{\"tripId\":59999,\"messageId\":21951827,\"messageDateTime\":\"2021-09-29 21:28:36\",\"messageDateTimeUTC\":\"2021-09-30T02:28:36Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":311,\"nearest\":null,\"messageText\":\"41126:29802:[4]:09-29 21:28:36 (0.181)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21951827, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['229'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.59674\",\"30.66542\",1441.3]},\"properties\":{\"tripId\":59999,\"messageId\":21951973,\"messageDateTime\":\"2021-09-29 21:39:23\",\"messageDateTimeUTC\":\"2021-09-30T02:39:23Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.75\",\"kph\":125.1,\"knots\":67.6,\"bearing\":312,\"nearest\":null,\"messageText\":\"41773:30099:[4]:09-29 21:39:23 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21951973, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['230'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.67800\",\"30.72946\",1401.1]},\"properties\":{\"tripId\":59999,\"messageId\":21952052,\"messageDateTime\":\"2021-09-29 21:44:23\",\"messageDateTimeUTC\":\"2021-09-30T02:44:23Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"79.25\",\"kph\":127.5,\"knots\":68.9,\"bearing\":312,\"nearest\":null,\"messageText\":\"42074:30398:[4]:09-29 21:44:24 (0.184)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21952052, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['231'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.74637\",\"30.80191\",1375.1]},\"properties\":{\"tripId\":59999,\"messageId\":21952090,\"messageDateTime\":\"2021-09-29 21:49:24\",\"messageDateTimeUTC\":\"2021-09-30T02:49:24Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.29\",\"kph\":126,\"knots\":68,\"bearing\":320,\"nearest\":null,\"messageText\":\"42374:30696:[4]:09-29 21:49:24 (0.288)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21952090, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['232'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.81959\",\"30.97924\",1338]},\"properties\":{\"tripId\":59999,\"messageId\":21952196,\"messageDateTime\":\"2021-09-29 21:59:24\",\"messageDateTimeUTC\":\"2021-09-30T02:59:24Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.45\",\"kph\":126.3,\"knots\":68.2,\"bearing\":345,\"nearest\":null,\"messageText\":\"42975:31293:[4]:09-29 21:59:25 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21952196, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['233'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.83076\",\"31.03682\",1374.5]},\"properties\":{\"tripId\":59999,\"messageId\":21952346,\"messageDateTime\":\"2021-09-29 22:12:13\",\"messageDateTimeUTC\":\"2021-09-30T03:12:13Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"22.31\",\"kph\":35.9,\"knots\":19.4,\"bearing\":339,\"nearest\":null,\"messageText\":\"43691:31592:[4]:09-29 22:12:13 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21952346, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['234'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-105.04071\",\"31.08504\",1521.5]},\"properties\":{\"tripId\":59999,\"messageId\":21952470,\"messageDateTime\":\"2021-09-29 22:22:14\",\"messageDateTimeUTC\":\"2021-09-30T03:22:14Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"82.50\",\"kph\":132.8,\"knots\":71.7,\"bearing\":290,\"nearest\":null,\"messageText\":\"44292:32177:[4]:09-29 22:22:14 (0.183)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21952470, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['235'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-105.26136\",\"31.14697\",1491.8]},\"properties\":{\"tripId\":59999,\"messageId\":21952561,\"messageDateTime\":\"2021-09-29 22:32:15\",\"messageDateTimeUTC\":\"2021-09-30T03:32:15Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"82.46\",\"kph\":132.7,\"knots\":71.7,\"bearing\":289,\"nearest\":null,\"messageText\":\"44893:32774:[4]:09-29 22:32:15 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21952561, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['236'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-105.36925\",\"31.17623\",1562.8]},\"properties\":{\"tripId\":59999,\"messageId\":21952590,\"messageDateTime\":\"2021-09-29 22:37:15\",\"messageDateTimeUTC\":\"2021-09-30T03:37:15Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"80.49\",\"kph\":129.5,\"knots\":69.9,\"bearing\":287,\"nearest\":null,\"messageText\":\"45193:33072:[4]:09-29 22:37:15 (5.536)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21952590, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['237'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-105.47187\",\"31.21322\",1563.3]},\"properties\":{\"tripId\":59999,\"messageId\":21952659,\"messageDateTime\":\"2021-09-29 22:42:15\",\"messageDateTimeUTC\":\"2021-09-30T03:42:15Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"81.37\",\"kph\":131,\"knots\":70.7,\"bearing\":292,\"nearest\":null,\"messageText\":\"45493:33370:[4]:09-29 22:42:15 (36.354)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21952659, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['238'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-105.68378\",\"31.17444\",1233.4]},\"properties\":{\"tripId\":59999,\"messageId\":21952719,\"messageDateTime\":\"2021-09-29 22:52:16\",\"messageDateTimeUTC\":\"2021-09-30T03:52:16Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"81.78\",\"kph\":131.6,\"knots\":71.1,\"bearing\":256,\"nearest\":null,\"messageText\":\"46094:33967:[4]:09-29 22:52:16 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21952719, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['239'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-105.84135\",\"31.30518\",1234.5]},\"properties\":{\"tripId\":59999,\"messageId\":21952799,\"messageDateTime\":\"2021-09-29 23:02:17\",\"messageDateTimeUTC\":\"2021-09-30T04:02:17Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"82.18\",\"kph\":132.3,\"knots\":71.4,\"bearing\":324,\"nearest\":null,\"messageText\":\"46695:34564:[4]:09-29 23:02:17 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21952799, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['240'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-106.01610\",\"31.43315\",1288.5]},\"properties\":{\"tripId\":59999,\"messageId\":21952865,\"messageDateTime\":\"2021-09-29 23:12:18\",\"messageDateTimeUTC\":\"2021-09-30T04:12:18Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"82.67\",\"kph\":133,\"knots\":71.8,\"bearing\":304,\"nearest\":null,\"messageText\":\"47296:35161:[4]:09-29 22:12:18 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21952865, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['241'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-106.17142\",\"31.57166\",1290.7]},\"properties\":{\"tripId\":59999,\"messageId\":21952940,\"messageDateTime\":\"2021-09-29 23:22:18\",\"messageDateTimeUTC\":\"2021-09-30T04:22:18Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"82.14\",\"kph\":132.2,\"knots\":71.4,\"bearing\":321,\"nearest\":null,\"messageText\":\"47896:35757:[4]:09-29 22:22:18 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21952940, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['242'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-106.23606\",\"31.65499\",1280.1]},\"properties\":{\"tripId\":59999,\"messageId\":21952982,\"messageDateTime\":\"2021-09-29 23:27:19\",\"messageDateTimeUTC\":\"2021-09-30T04:27:19Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"82.30\",\"kph\":132.4,\"knots\":71.5,\"bearing\":326,\"nearest\":null,\"messageText\":\"48197:36056:[4]:09-29 22:27:19 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21952982, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['243'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-106.30886\",\"31.72452\",1300.2]},\"properties\":{\"tripId\":59999,\"messageId\":21953031,\"messageDateTime\":\"2021-09-29 23:32:19\",\"messageDateTimeUTC\":\"2021-09-30T04:32:19Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"71.27\",\"kph\":114.7,\"knots\":61.9,\"bearing\":318,\"nearest\":null,\"messageText\":\"48497:36354:[4]:09-29 22:32:19 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21953031, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['244'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-106.48525\",\"31.76461\",1269.2]},\"properties\":{\"tripId\":59999,\"messageId\":21953126,\"messageDateTime\":\"2021-09-29 23:42:20\",\"messageDateTimeUTC\":\"2021-09-30T04:42:20Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"66.31\",\"kph\":106.7,\"knots\":57.6,\"bearing\":261,\"nearest\":null,\"messageText\":\"49098:36949:[4]:09-29 22:42:20 (0.192)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21953126, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['245'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-106.58269\",\"31.88766\",1311.8]},\"properties\":{\"tripId\":59999,\"messageId\":21953200,\"messageDateTime\":\"2021-09-29 23:52:21\",\"messageDateTimeUTC\":\"2021-09-30T04:52:21Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"73.01\",\"kph\":117.5,\"knots\":63.4,\"bearing\":336,\"nearest\":null,\"messageText\":\"49699:37544:[4]:09-29 22:52:21 (0.189)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21953200, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['246'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-106.58332\",\"31.91100\",1325.5]},\"properties\":{\"tripId\":59999,\"messageId\":21953341,\"messageDateTime\":\"2021-09-30 00:13:39\",\"messageDateTimeUTC\":\"2021-09-30T05:13:39Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"27.74\",\"kph\":44.6,\"knots\":24.1,\"bearing\":139,\"nearest\":null,\"messageText\":\"50934:37842:[4]:09-29 23:13:39 (0.200)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21953341, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['247'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-106.58056\",\"31.99599\",1341.4]},\"properties\":{\"tripId\":59999,\"messageId\":21953409,\"messageDateTime\":\"2021-09-30 00:23:40\",\"messageDateTimeUTC\":\"2021-09-30T05:23:40Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":5,\"nearest\":null,\"messageText\":\"50982:37890:[16]:09-29 23:23:40 (0.191)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21953409, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['248'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-106.58068\",\"31.99694\",1348.1]},\"properties\":{\"tripId\":59999,\"messageId\":21963034,\"messageDateTime\":\"2021-09-30 09:27:41\",\"messageDateTimeUTC\":\"2021-09-30T14:27:41Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"24.98\",\"kph\":40.2,\"knots\":21.7,\"bearing\":354,\"nearest\":null,\"messageText\":\"80127:37891:[4]:09-30 08:27:41 (0.178)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21963034, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['249'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-106.58291\",\"31.95606\",1343.7]},\"properties\":{\"tripId\":59999,\"messageId\":21963162,\"messageDateTime\":\"2021-09-30 09:32:41\",\"messageDateTimeUTC\":\"2021-09-30T14:32:41Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"75.72\",\"kph\":121.9,\"knots\":65.8,\"bearing\":182,\"nearest\":null,\"messageText\":\"80288:38014:[4]:09-30 08:32:41 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21963162, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['250'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-106.47891\",\"31.88983\",1672.9]},\"properties\":{\"tripId\":59999,\"messageId\":21963425,\"messageDateTime\":\"2021-09-30 09:42:42\",\"messageDateTimeUTC\":\"2021-09-30T14:42:42Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"55.08\",\"kph\":88.6,\"knots\":47.9,\"bearing\":105,\"nearest\":null,\"messageText\":\"80375:38101:[4]:09-30 08:42:42 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21963425, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['251'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-106.33882\",\"31.86481\",1355.5]},\"properties\":{\"tripId\":59999,\"messageId\":21963653,\"messageDateTime\":\"2021-09-30 09:52:43\",\"messageDateTimeUTC\":\"2021-09-30T14:52:43Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"74.64\",\"kph\":120.1,\"knots\":64.9,\"bearing\":117,\"nearest\":null,\"messageText\":\"80455:38181:[4]:09-30 08:52:43 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21963653, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['252'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-106.21685\",\"31.81314\",1372.5]},\"properties\":{\"tripId\":59999,\"messageId\":21963895,\"messageDateTime\":\"2021-09-30 10:02:43\",\"messageDateTimeUTC\":\"2021-09-30T15:02:43Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"69.34\",\"kph\":111.6,\"knots\":60.3,\"bearing\":88,\"nearest\":null,\"messageText\":\"80525:38251:[4]:09-30 09:02:43 (0.343)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21963895, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['253'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-106.17526\",\"31.81864\",1390.5]},\"properties\":{\"tripId\":59999,\"messageId\":21964372,\"messageDateTime\":\"2021-09-30 10:18:26\",\"messageDateTimeUTC\":\"2021-09-30T15:18:26Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"50.22\",\"kph\":80.8,\"knots\":43.6,\"bearing\":95,\"nearest\":null,\"messageText\":\"80702:38271:[4]:09-30 09:18:26 (0.192)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21964372, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['254'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-106.08421\",\"31.83137\",1455.9]},\"properties\":{\"tripId\":59999,\"messageId\":21964466,\"messageDateTime\":\"2021-09-30 10:23:26\",\"messageDateTimeUTC\":\"2021-09-30T15:23:26Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.97\",\"kph\":125.5,\"knots\":67.8,\"bearing\":80,\"nearest\":null,\"messageText\":\"80744:38313:[4]:09-30 09:23:26 (0.306)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21964466, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['255'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-105.98874\",\"31.83907\",1711.3]},\"properties\":{\"tripId\":59999,\"messageId\":21964596,\"messageDateTime\":\"2021-09-30 10:28:27\",\"messageDateTimeUTC\":\"2021-09-30T15:28:27Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"62.70\",\"kph\":100.9,\"knots\":54.5,\"bearing\":84,\"nearest\":null,\"messageText\":\"80794:38363:[4]:09-30 09:28:27 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21964596, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['256'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-105.80614\",\"31.84724\",1793.6]},\"properties\":{\"tripId\":59999,\"messageId\":21964841,\"messageDateTime\":\"2021-09-30 10:38:27\",\"messageDateTimeUTC\":\"2021-09-30T15:38:27Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"74.34\",\"kph\":119.6,\"knots\":64.6,\"bearing\":76,\"nearest\":null,\"messageText\":\"80883:38452:[4]:09-30 09:38:27 (0.296)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21964841, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['257'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-105.59863\",\"31.80164\",1544.9]},\"properties\":{\"tripId\":59999,\"messageId\":21965452,\"messageDateTime\":\"2021-09-30 10:48:28\",\"messageDateTimeUTC\":\"2021-09-30T15:48:28Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"75.09\",\"kph\":120.8,\"knots\":65.3,\"bearing\":101,\"nearest\":null,\"messageText\":\"80984:38553:[4]:09-30 10:48:28 (1040.717)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21965452, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['258'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-105.38455\",\"31.76434\",1426.5]},\"properties\":{\"tripId\":59999,\"messageId\":21965454,\"messageDateTime\":\"2021-09-30 10:58:29\",\"messageDateTimeUTC\":\"2021-09-30T15:58:29Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.65\",\"kph\":126.6,\"knots\":68.3,\"bearing\":101,\"nearest\":null,\"messageText\":\"81085:38654:[4]:09-30 10:58:29 (440.443)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21965454, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['259'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-105.18901\",\"31.74714\",1352]},\"properties\":{\"tripId\":59999,\"messageId\":21965573,\"messageDateTime\":\"2021-09-30 11:08:30\",\"messageDateTimeUTC\":\"2021-09-30T16:08:30Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.63\",\"kph\":123.3,\"knots\":66.6,\"bearing\":89,\"nearest\":null,\"messageText\":\"81176:38745:[4]:09-30 10:08:30 (0.204)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21965573, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['260'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-105.08184\",\"31.74466\",1265.1]},\"properties\":{\"tripId\":59999,\"messageId\":21965652,\"messageDateTime\":\"2021-09-30 11:13:30\",\"messageDateTimeUTC\":\"2021-09-30T16:13:30Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.67\",\"kph\":126.6,\"knots\":68.4,\"bearing\":91,\"nearest\":null,\"messageText\":\"81226:38795:[4]:09-30 10:13:30 (0.328)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21965652, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['261'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-105.01809\",\"31.75127\",1238.7]},\"properties\":{\"tripId\":59999,\"messageId\":21965817,\"messageDateTime\":\"2021-09-30 11:18:30\",\"messageDateTimeUTC\":\"2021-09-30T16:18:30Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"66.71\",\"kph\":107.4,\"knots\":58,\"bearing\":83,\"nearest\":null,\"messageText\":\"81255:38824:[4]:09-30 10:18:30 (0.416)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21965817, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['262'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.82834\",\"31.81961\",1506.5]},\"properties\":{\"tripId\":59999,\"messageId\":21966050,\"messageDateTime\":\"2021-09-30 11:28:31\",\"messageDateTimeUTC\":\"2021-09-30T16:28:31Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.92\",\"kph\":127,\"knots\":68.6,\"bearing\":52,\"nearest\":null,\"messageText\":\"81355:38924:[4]:09-30 10:28:31 (0.190)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21966050, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['263'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.82100\",\"31.89300\",1945.4]},\"properties\":{\"tripId\":59999,\"messageId\":21966269,\"messageDateTime\":\"2021-09-30 11:38:32\",\"messageDateTimeUTC\":\"2021-09-30T16:38:32Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":7,\"nearest\":null,\"messageText\":\"81410:38979:[4]:09-30 11:38:32 (0.336)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21966269, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['264'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.64828\",\"31.96708\",1534.1]},\"properties\":{\"tripId\":59999,\"messageId\":21966562,\"messageDateTime\":\"2021-09-30 11:48:33\",\"messageDateTimeUTC\":\"2021-09-30T16:48:33Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.97\",\"kph\":125.5,\"knots\":67.8,\"bearing\":61,\"nearest\":null,\"messageText\":\"81501:39070:[4]:09-30 11:48:33 (149.297)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21966562, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['265'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.50093\",\"31.93218\",1297.2]},\"properties\":{\"tripId\":59999,\"messageId\":21966798,\"messageDateTime\":\"2021-09-30 11:58:33\",\"messageDateTimeUTC\":\"2021-09-30T16:58:33Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"47.29\",\"kph\":76.1,\"knots\":41.1,\"bearing\":150,\"nearest\":null,\"messageText\":\"81597:39166:[4]:09-30 11:58:33 (149.297)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21966798, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['266'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.44355\",\"31.92434\",1258.9]},\"properties\":{\"tripId\":59999,\"messageId\":21966861,\"messageDateTime\":\"2021-09-30 12:03:34\",\"messageDateTimeUTC\":\"2021-09-30T17:03:34Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"57.41\",\"kph\":92.4,\"knots\":49.9,\"bearing\":99,\"nearest\":null,\"messageText\":\"81625:39194:[4]:09-30 12:03:34 (0.191)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21966861, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['267'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.40178\",\"31.91590\",1220]},\"properties\":{\"tripId\":59999,\"messageId\":21967006,\"messageDateTime\":\"2021-09-30 12:08:35\",\"messageDateTimeUTC\":\"2021-09-30T17:08:35Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"10.68\",\"kph\":17.2,\"knots\":9.3,\"bearing\":103,\"nearest\":null,\"messageText\":\"81646:39215:[4]:09-30 12:08:35 (0.183)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21967006, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['268'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.27802\",\"31.86861\",1245.6]},\"properties\":{\"tripId\":59999,\"messageId\":21967257,\"messageDateTime\":\"2021-09-30 12:18:36\",\"messageDateTimeUTC\":\"2021-09-30T17:18:36Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.48\",\"kph\":126.3,\"knots\":68.2,\"bearing\":113,\"nearest\":null,\"messageText\":\"81709:39278:[4]:09-30 12:18:36 (0.330)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21967257, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['269'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.11731\",\"31.82491\",1106.7]},\"properties\":{\"tripId\":59999,\"messageId\":21967449,\"messageDateTime\":\"2021-09-30 12:28:36\",\"messageDateTimeUTC\":\"2021-09-30T17:28:36Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"66.19\",\"kph\":106.5,\"knots\":57.5,\"bearing\":104,\"nearest\":null,\"messageText\":\"81788:39357:[4]:09-30 12:28:37 (0.182)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21967449, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['270'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.06403\",\"31.82296\",1065.9]},\"properties\":{\"tripId\":59999,\"messageId\":21967702,\"messageDateTime\":\"2021-09-30 12:38:37\",\"messageDateTimeUTC\":\"2021-09-30T17:38:37Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":90,\"nearest\":null,\"messageText\":\"81813:39382:[4]:09-30 12:38:38 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21967702, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['271'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.94368\",\"31.82517\",992.9]},\"properties\":{\"tripId\":59999,\"messageId\":21967930,\"messageDateTime\":\"2021-09-30 12:48:38\",\"messageDateTimeUTC\":\"2021-09-30T17:48:38Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"54.20\",\"kph\":87.2,\"knots\":47.1,\"bearing\":87,\"nearest\":null,\"messageText\":\"81868:39437:[4]:09-30 12:48:38 (0.321)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21967930, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['272'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.88530\",\"31.79780\",968.1]},\"properties\":{\"tripId\":59999,\"messageId\":21968060,\"messageDateTime\":\"2021-09-30 12:53:38\",\"messageDateTimeUTC\":\"2021-09-30T17:53:38Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.35\",\"kph\":126.1,\"knots\":68.1,\"bearing\":118,\"nearest\":null,\"messageText\":\"81903:39472:[4]:09-30 12:53:39 (0.183)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21968060, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['273'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.83016\",\"31.73398\",952.2]},\"properties\":{\"tripId\":59999,\"messageId\":21968187,\"messageDateTime\":\"2021-09-30 12:58:39\",\"messageDateTimeUTC\":\"2021-09-30T17:58:39Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"49.28\",\"kph\":79.3,\"knots\":42.8,\"bearing\":143,\"nearest\":null,\"messageText\":\"81946:39515:[4]:09-30 12:58:39 (0.326)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21968187, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['274'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.67502\",\"31.64859\",936.5]},\"properties\":{\"tripId\":59999,\"messageId\":21968456,\"messageDateTime\":\"2021-09-30 13:08:39\",\"messageDateTimeUTC\":\"2021-09-30T18:08:39Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.91\",\"kph\":123.8,\"knots\":66.8,\"bearing\":109,\"nearest\":null,\"messageText\":\"82034:39603:[4]:09-30 13:08:40 (0.183)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21968456, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['275'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.53915\",\"31.73867\",961.1]},\"properties\":{\"tripId\":59999,\"messageId\":21968695,\"messageDateTime\":\"2021-09-30 13:18:40\",\"messageDateTimeUTC\":\"2021-09-30T18:18:40Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"73.90\",\"kph\":118.9,\"knots\":64.2,\"bearing\":51,\"nearest\":null,\"messageText\":\"82124:39693:[4]:09-30 13:18:41 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21968695, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['276'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.33919\",\"31.77865\",986.7]},\"properties\":{\"tripId\":59999,\"messageId\":21968912,\"messageDateTime\":\"2021-09-30 13:28:41\",\"messageDateTimeUTC\":\"2021-09-30T18:28:41Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"74.13\",\"kph\":119.3,\"knots\":64.4,\"bearing\":81,\"nearest\":null,\"messageText\":\"82219:39788:[4]:09-30 13:28:41 (0.321)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21968912, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['277'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.17164\",\"31.82448\",962.8]},\"properties\":{\"tripId\":59999,\"messageId\":21969143,\"messageDateTime\":\"2021-09-30 13:38:42\",\"messageDateTimeUTC\":\"2021-09-30T18:38:42Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"74.95\",\"kph\":120.6,\"knots\":65.1,\"bearing\":72,\"nearest\":null,\"messageText\":\"82298:39867:[4]:09-30 13:38:42 (0.322)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21969143, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['278'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.10516\",\"31.84877\",966.3]},\"properties\":{\"tripId\":59999,\"messageId\":21969274,\"messageDateTime\":\"2021-09-30 13:43:42\",\"messageDateTimeUTC\":\"2021-09-30T18:43:42Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"18.12\",\"kph\":29.2,\"knots\":15.7,\"bearing\":66,\"nearest\":null,\"messageText\":\"82333:39902:[4]:09-30 13:43:43 (0.181)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21969274, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['279'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.10374\",\"31.84332\",960.5]},\"properties\":{\"tripId\":59999,\"messageId\":21969410,\"messageDateTime\":\"2021-09-30 13:48:43\",\"messageDateTimeUTC\":\"2021-09-30T18:48:43Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":167,\"nearest\":null,\"messageText\":\"82337:39906:[4]:09-30 13:48:43 (0.320)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21969410, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['280'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.07832\",\"31.86477\",992]},\"properties\":{\"tripId\":59999,\"messageId\":21969955,\"messageDateTime\":\"2021-09-30 14:08:21\",\"messageDateTimeUTC\":\"2021-09-30T19:08:21Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"53.78\",\"kph\":86.6,\"knots\":46.7,\"bearing\":42,\"nearest\":null,\"messageText\":\"82694:39927:[4]:09-30 14:08:21 (0.323)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21969955, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['281'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.95398\",\"31.98004\",1049.8]},\"properties\":{\"tripId\":59999,\"messageId\":21970190,\"messageDateTime\":\"2021-09-30 14:18:22\",\"messageDateTimeUTC\":\"2021-09-30T19:18:22Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"71.81\",\"kph\":115.6,\"knots\":62.4,\"bearing\":35,\"nearest\":null,\"messageText\":\"82777:40010:[4]:09-30 14:18:22 (0.325)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21970190, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['282'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.83474\",\"32.12853\",1126.8]},\"properties\":{\"tripId\":59999,\"messageId\":21970417,\"messageDateTime\":\"2021-09-30 14:28:23\",\"messageDateTimeUTC\":\"2021-09-30T19:28:23Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.59\",\"kph\":126.5,\"knots\":68.3,\"bearing\":37,\"nearest\":null,\"messageText\":\"82872:40105:[4]:09-30 14:28:23 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21970417, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['283'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.77743\",\"32.26481\",1118.5]},\"properties\":{\"tripId\":59999,\"messageId\":21970650,\"messageDateTime\":\"2021-09-30 14:38:24\",\"messageDateTimeUTC\":\"2021-09-30T19:38:24Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.76\",\"kph\":125.1,\"knots\":67.6,\"bearing\":344,\"nearest\":null,\"messageText\":\"82970:40203:[4]:09-30 14:38:24 (0.189)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21970650, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['284'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.77341\",\"32.35412\",1115.7]},\"properties\":{\"tripId\":59999,\"messageId\":21970802,\"messageDateTime\":\"2021-09-30 14:43:24\",\"messageDateTimeUTC\":\"2021-09-30T19:43:24Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"64.58\",\"kph\":103.9,\"knots\":56.1,\"bearing\":2,\"nearest\":null,\"messageText\":\"83020:40253:[4]:09-30 14:43:24 (0.324)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21970802, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['285'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.79904\",\"32.43790\",1128]},\"properties\":{\"tripId\":59999,\"messageId\":21970892,\"messageDateTime\":\"2021-09-30 14:48:24\",\"messageDateTimeUTC\":\"2021-09-30T19:48:24Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.67\",\"kph\":125,\"knots\":67.5,\"bearing\":345,\"nearest\":null,\"messageText\":\"83067:40300:[4]:09-30 14:48:24 (0.477)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21970892, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['286'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.83456\",\"32.56829\",1147.2]},\"properties\":{\"tripId\":59999,\"messageId\":21971129,\"messageDateTime\":\"2021-09-30 14:58:25\",\"messageDateTimeUTC\":\"2021-09-30T19:58:25Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.32\",\"kph\":126,\"knots\":68.1,\"bearing\":12,\"nearest\":null,\"messageText\":\"83165:40398:[4]:09-30 14:58:25 (0.310)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21971129, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['287'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.74307\",\"32.66050\",1135]},\"properties\":{\"tripId\":59999,\"messageId\":21971395,\"messageDateTime\":\"2021-09-30 15:08:26\",\"messageDateTimeUTC\":\"2021-09-30T20:08:26Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"70.55\",\"kph\":113.5,\"knots\":61.3,\"bearing\":32,\"nearest\":null,\"messageText\":\"83234:40467:[4]:09-30 15:08:26 (0.182)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21971395, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['288'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.70894\",\"32.78280\",1143.5]},\"properties\":{\"tripId\":59999,\"messageId\":21971639,\"messageDateTime\":\"2021-09-30 15:18:27\",\"messageDateTimeUTC\":\"2021-09-30T20:18:27Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"8.38\",\"kph\":13.5,\"knots\":7.3,\"bearing\":18,\"nearest\":null,\"messageText\":\"83313:40546:[4]:09-30 15:18:27 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21971639, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['289'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.80433\",\"32.93702\",1196.8]},\"properties\":{\"tripId\":59999,\"messageId\":21971848,\"messageDateTime\":\"2021-09-30 15:28:27\",\"messageDateTimeUTC\":\"2021-09-30T20:28:27Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.21\",\"kph\":124.3,\"knots\":67.1,\"bearing\":342,\"nearest\":null,\"messageText\":\"83411:40644:[4]:09-30 15:28:27 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21971848, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['290'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.81862\",\"32.96248\",1215.7]},\"properties\":{\"tripId\":59999,\"messageId\":21971957,\"messageDateTime\":\"2021-09-30 15:33:28\",\"messageDateTimeUTC\":\"2021-09-30T20:33:28Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":334,\"nearest\":null,\"messageText\":\"83428:40661:[4]:09-30 15:33:28 (0.190)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21971957, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['291'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.81899\",\"32.97905\",1222.3]},\"properties\":{\"tripId\":59999,\"messageId\":21972066,\"messageDateTime\":\"2021-09-30 15:38:28\",\"messageDateTimeUTC\":\"2021-09-30T20:38:28Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"64.32\",\"kph\":103.5,\"knots\":55.9,\"bearing\":0,\"nearest\":null,\"messageText\":\"83452:40671:[4]:09-30 15:38:28 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21972066, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['292'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.81868\",\"33.15321\",1237.6]},\"properties\":{\"tripId\":59999,\"messageId\":21972331,\"messageDateTime\":\"2021-09-30 15:48:29\",\"messageDateTimeUTC\":\"2021-09-30T20:48:29Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.92\",\"kph\":123.8,\"knots\":66.8,\"bearing\":0,\"nearest\":null,\"messageText\":\"83544:40763:[4]:09-30 15:48:29 (0.284)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21972331, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['293'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.81843\",\"33.32459\",1261.1]},\"properties\":{\"tripId\":59999,\"messageId\":21972580,\"messageDateTime\":\"2021-09-30 15:58:30\",\"messageDateTimeUTC\":\"2021-09-30T20:58:30Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.37\",\"kph\":124.5,\"knots\":67.2,\"bearing\":0,\"nearest\":null,\"messageText\":\"83636:40855:[4]:09-30 15:58:30 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21972580, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['294'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.82295\",\"33.51112\",1289.4]},\"properties\":{\"tripId\":59999,\"messageId\":21972832,\"messageDateTime\":\"2021-09-30 16:08:30\",\"messageDateTimeUTC\":\"2021-09-30T21:08:30Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.04\",\"kph\":124,\"knots\":66.9,\"bearing\":358,\"nearest\":null,\"messageText\":\"83736:40955:[4]:09-30 16:08:30 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21972832, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['295'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.80091\",\"33.61324\",1287.6]},\"properties\":{\"tripId\":59999,\"messageId\":21973091,\"messageDateTime\":\"2021-09-30 16:18:31\",\"messageDateTimeUTC\":\"2021-09-30T21:18:31Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.42\",\"kph\":123,\"knots\":66.4,\"bearing\":17,\"nearest\":null,\"messageText\":\"83796:41015:[4]:09-30 16:18:31 (0.233)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21973091, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['296'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.75964\",\"33.69626\",1283.6]},\"properties\":{\"tripId\":59999,\"messageId\":21973174,\"messageDateTime\":\"2021-09-30 16:23:32\",\"messageDateTimeUTC\":\"2021-09-30T21:23:32Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.52\",\"kph\":124.8,\"knots\":67.4,\"bearing\":22,\"nearest\":null,\"messageText\":\"83847:41066:[4]:09-30 16:23:32 (0.191)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21973174, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['297'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.75864\",\"33.76206\",1273.4]},\"properties\":{\"tripId\":59999,\"messageId\":21973289,\"messageDateTime\":\"2021-09-30 16:28:32\",\"messageDateTimeUTC\":\"2021-09-30T21:28:32Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.37\",\"kph\":122.9,\"knots\":66.4,\"bearing\":0,\"nearest\":null,\"messageText\":\"83882:41101:[4]:09-30 16:28:32 (0.330)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21973289, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['298'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.74357\",\"33.94651\",1274.8]},\"properties\":{\"tripId\":59999,\"messageId\":21973514,\"messageDateTime\":\"2021-09-30 16:38:33\",\"messageDateTimeUTC\":\"2021-09-30T21:38:33Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.56\",\"kph\":124.8,\"knots\":67.4,\"bearing\":8,\"nearest\":null,\"messageText\":\"83983:41202:[4]:09-30 16:38:33 (0.184)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21973514, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['299'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.73498\",\"34.12793\",1315.4]},\"properties\":{\"tripId\":59999,\"messageId\":21973748,\"messageDateTime\":\"2021-09-30 16:48:34\",\"messageDateTimeUTC\":\"2021-09-30T21:48:34Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"75.84\",\"kph\":122.1,\"knots\":65.9,\"bearing\":1,\"nearest\":null,\"messageText\":\"84082:41301:[4]:09-30 16:48:34 (0.193)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21973748, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['300'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.72365\",\"34.22637\",1293.6]},\"properties\":{\"tripId\":59999,\"messageId\":21973967,\"messageDateTime\":\"2021-09-30 16:58:34\",\"messageDateTimeUTC\":\"2021-09-30T21:58:34Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":35,\"nearest\":null,\"messageText\":\"84137:41356:[10]:09-30 16:58:34 (0.468)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21973967, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['301'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.72246\",\"34.30530\",1314.4]},\"properties\":{\"tripId\":59999,\"messageId\":21974273,\"messageDateTime\":\"2021-09-30 17:11:25\",\"messageDateTimeUTC\":\"2021-09-30T22:11:25Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.82\",\"kph\":123.6,\"knots\":66.8,\"bearing\":0,\"nearest\":null,\"messageText\":\"84282:41398:[4]:09-30 17:11:25 (0.326)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21974273, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['302'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.71613\",\"34.39754\",1355.3]},\"properties\":{\"tripId\":59999,\"messageId\":21974357,\"messageDateTime\":\"2021-09-30 17:16:26\",\"messageDateTimeUTC\":\"2021-09-30T22:16:26Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.95\",\"kph\":123.8,\"knots\":66.9,\"bearing\":3,\"nearest\":null,\"messageText\":\"84333:41449:[4]:09-30 17:16:26 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21974357, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['303'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.72822\",\"34.48720\",1362]},\"properties\":{\"tripId\":59999,\"messageId\":21974501,\"messageDateTime\":\"2021-09-30 17:21:26\",\"messageDateTimeUTC\":\"2021-09-30T22:21:26Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.26\",\"kph\":124.3,\"knots\":67.1,\"bearing\":353,\"nearest\":null,\"messageText\":\"84383:41499:[4]:09-30 17:21:26 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21974501, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['304'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.71849\",\"34.64102\",1366.3]},\"properties\":{\"tripId\":59999,\"messageId\":21974748,\"messageDateTime\":\"2021-09-30 17:31:27\",\"messageDateTimeUTC\":\"2021-09-30T22:31:27Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"21.22\",\"kph\":34.2,\"knots\":18.4,\"bearing\":7,\"nearest\":null,\"messageText\":\"84470:41586:[4]:09-30 17:31:27 (0.332)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21974748, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['305'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.56931\",\"34.70512\",1339.1]},\"properties\":{\"tripId\":59999,\"messageId\":21974958,\"messageDateTime\":\"2021-09-30 17:41:27\",\"messageDateTimeUTC\":\"2021-09-30T22:41:27Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.08\",\"kph\":124,\"knots\":67,\"bearing\":57,\"nearest\":null,\"messageText\":\"84546:41662:[4]:09-30 17:41:28 (0.184)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21974958, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['306'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.40575\",\"34.81154\",1293]},\"properties\":{\"tripId\":59999,\"messageId\":21975158,\"messageDateTime\":\"2021-09-30 17:51:28\",\"messageDateTimeUTC\":\"2021-09-30T22:51:28Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"22.16\",\"kph\":35.7,\"knots\":19.3,\"bearing\":45,\"nearest\":null,\"messageText\":\"84639:41755:[4]:09-30 17:51:28 (0.328)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21975158, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['307'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.40331\",\"34.95106\",1319.6]},\"properties\":{\"tripId\":59999,\"messageId\":21975366,\"messageDateTime\":\"2021-09-30 18:01:29\",\"messageDateTimeUTC\":\"2021-09-30T23:01:29Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.77\",\"kph\":125.2,\"knots\":67.6,\"bearing\":0,\"nearest\":null,\"messageText\":\"84714:41830:[4]:09-30 18:01:29 (0.326)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21975366, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['308'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.40217\",\"35.04428\",1327]},\"properties\":{\"tripId\":59999,\"messageId\":21975494,\"messageDateTime\":\"2021-09-30 18:06:29\",\"messageDateTimeUTC\":\"2021-09-30T23:06:29Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.06\",\"kph\":124,\"knots\":67,\"bearing\":0,\"nearest\":null,\"messageText\":\"84764:41880:[4]:09-30 18:06:30 (0.183)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21975494, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['309'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.40066\",\"35.13749\",1361]},\"properties\":{\"tripId\":59999,\"messageId\":21975568,\"messageDateTime\":\"2021-09-30 18:11:30\",\"messageDateTimeUTC\":\"2021-09-30T23:11:30Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.50\",\"kph\":124.7,\"knots\":67.3,\"bearing\":0,\"nearest\":null,\"messageText\":\"84814:41930:[4]:09-30 18:11:30 (0.209)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21975568, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['310'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.42897\",\"35.23828\",1367.6]},\"properties\":{\"tripId\":59999,\"messageId\":21975763,\"messageDateTime\":\"2021-09-30 18:21:30\",\"messageDateTimeUTC\":\"2021-09-30T23:21:30Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":339,\"nearest\":null,\"messageText\":\"84871:41987:[4]:09-30 18:21:31 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21975763, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['311'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.38791\",\"35.29985\",1358.5]},\"properties\":{\"tripId\":59999,\"messageId\":21976238,\"messageDateTime\":\"2021-09-30 18:47:25\",\"messageDateTimeUTC\":\"2021-09-30T23:47:25Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.85\",\"kph\":125.3,\"knots\":67.6,\"bearing\":28,\"nearest\":null,\"messageText\":\"86107:42282:[4]:09-30 18:47:25 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21976238, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['312'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.25732\",\"35.44921\",1190.6]},\"properties\":{\"tripId\":59999,\"messageId\":21976407,\"messageDateTime\":\"2021-09-30 18:57:26\",\"messageDateTimeUTC\":\"2021-09-30T23:57:26Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.23\",\"kph\":124.3,\"knots\":67.1,\"bearing\":39,\"nearest\":null,\"messageText\":\"86708:42877:[4]:09-30 18:57:26 (0.183)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21976407, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['313'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.30488\",\"35.62218\",1204.2]},\"properties\":{\"tripId\":59999,\"messageId\":21976557,\"messageDateTime\":\"2021-09-30 19:07:27\",\"messageDateTimeUTC\":\"2021-10-01T00:07:27Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"79.09\",\"kph\":127.3,\"knots\":68.7,\"bearing\":340,\"nearest\":null,\"messageText\":\"87309:43472:[4]:09-30 19:07:27 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21976557, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['314'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.32886\",\"35.68665\",1294.8]},\"properties\":{\"tripId\":59999,\"messageId\":21976635,\"messageDateTime\":\"2021-09-30 19:12:27\",\"messageDateTimeUTC\":\"2021-10-01T00:12:27Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"34.61\",\"kph\":55.7,\"knots\":30.1,\"bearing\":343,\"nearest\":null,\"messageText\":\"87609:43770:[4]:09-30 19:12:27 (0.183)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21976635, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['315'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.33095\",\"35.77090\",1326.9]},\"properties\":{\"tripId\":59999,\"messageId\":21976713,\"messageDateTime\":\"2021-09-30 19:17:28\",\"messageDateTimeUTC\":\"2021-10-01T00:17:28Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.52\",\"kph\":126.4,\"knots\":68.2,\"bearing\":358,\"nearest\":null,\"messageText\":\"87910:44065:[4]:09-30 19:17:28 (0.184)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21976713, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['316'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.42458\",\"35.93361\",1336.5]},\"properties\":{\"tripId\":59999,\"messageId\":21976873,\"messageDateTime\":\"2021-09-30 19:27:28\",\"messageDateTimeUTC\":\"2021-10-01T00:27:28Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.47\",\"kph\":126.3,\"knots\":68.2,\"bearing\":335,\"nearest\":null,\"messageText\":\"88510:44661:[4]:09-30 19:27:28 (0.184)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21976873, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['317'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.51777\",\"36.06287\",1360.9]},\"properties\":{\"tripId\":59999,\"messageId\":21977034,\"messageDateTime\":\"2021-09-30 19:37:29\",\"messageDateTimeUTC\":\"2021-10-01T00:37:29Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"44.72\",\"kph\":72,\"knots\":38.9,\"bearing\":320,\"nearest\":null,\"messageText\":\"89111:45258:[4]:09-30 19:37:29 (0.196)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21977034, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['318'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.67698\",\"36.16468\",1413.9]},\"properties\":{\"tripId\":59999,\"messageId\":21977188,\"messageDateTime\":\"2021-09-30 19:47:30\",\"messageDateTimeUTC\":\"2021-10-01T00:47:30Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.90\",\"kph\":123.8,\"knots\":66.8,\"bearing\":307,\"nearest\":null,\"messageText\":\"89712:45851:[4]:09-30 19:47:30 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21977188, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['319'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.86530\",\"36.27703\",1489.9]},\"properties\":{\"tripId\":59999,\"messageId\":21977361,\"messageDateTime\":\"2021-09-30 19:57:31\",\"messageDateTimeUTC\":\"2021-10-01T00:57:31Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"79.17\",\"kph\":127.4,\"knots\":68.8,\"bearing\":306,\"nearest\":null,\"messageText\":\"90313:46446:[4]:09-30 19:57:31 (0.195)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21977361, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['320'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.95966\",\"36.33281\",1535.2]},\"properties\":{\"tripId\":59999,\"messageId\":21977421,\"messageDateTime\":\"2021-09-30 20:02:31\",\"messageDateTimeUTC\":\"2021-10-01T01:02:31Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.79\",\"kph\":125.2,\"knots\":67.6,\"bearing\":306,\"nearest\":null,\"messageText\":\"90613:46743:[4]:09-30 20:02:31 (0.298)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21977421, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['321'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.01866\",\"36.37430\",1592.1]},\"properties\":{\"tripId\":59999,\"messageId\":21977499,\"messageDateTime\":\"2021-09-30 20:07:32\",\"messageDateTimeUTC\":\"2021-10-01T01:07:32Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":311,\"nearest\":null,\"messageText\":\"90914:47042:[4]:09-30 20:07:32 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21977499, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['322'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.93322\",\"36.31676\",1533.8]},\"properties\":{\"tripId\":59999,\"messageId\":21977726,\"messageDateTime\":\"2021-09-30 20:21:17\",\"messageDateTimeUTC\":\"2021-10-01T01:21:17Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"79.11\",\"kph\":127.3,\"knots\":68.7,\"bearing\":129,\"nearest\":null,\"messageText\":\"91274:47091:[4]:09-30 20:21:17 (0.313)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21977726, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['323'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.74495\",\"36.20487\",1448.7]},\"properties\":{\"tripId\":59999,\"messageId\":21977870,\"messageDateTime\":\"2021-09-30 20:31:18\",\"messageDateTimeUTC\":\"2021-10-01T01:31:18Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.93\",\"kph\":125.4,\"knots\":67.7,\"bearing\":126,\"nearest\":null,\"messageText\":\"91375:47192:[4]:09-30 20:31:18 (0.181)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21977870, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['324'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.59298\",\"36.11317\",1389.4]},\"properties\":{\"tripId\":59999,\"messageId\":21977999,\"messageDateTime\":\"2021-09-30 20:41:19\",\"messageDateTimeUTC\":\"2021-10-01T01:41:19Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"68.55\",\"kph\":110.3,\"knots\":59.6,\"bearing\":127,\"nearest\":null,\"messageText\":\"91458:47275:[4]:09-30 20:41:19 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21977999, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['325'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.45119\",\"36.10822\",1349.2]},\"properties\":{\"tripId\":59999,\"messageId\":21978143,\"messageDateTime\":\"2021-09-30 20:51:19\",\"messageDateTimeUTC\":\"2021-10-01T01:51:19Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"65.97\",\"kph\":106.2,\"knots\":57.3,\"bearing\":59,\"nearest\":null,\"messageText\":\"91535:47352:[4]:09-30 20:51:19 (0.371)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21978143, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['326'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.35891\",\"36.16287\",1339.6]},\"properties\":{\"tripId\":59999,\"messageId\":21978228,\"messageDateTime\":\"2021-09-30 20:56:20\",\"messageDateTimeUTC\":\"2021-10-01T01:56:20Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.63\",\"kph\":126.5,\"knots\":68.3,\"bearing\":53,\"nearest\":null,\"messageText\":\"91585:47402:[4]:09-30 20:56:20 (0.189)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21978228, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['327'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.26334\",\"36.21962\",1305.2]},\"properties\":{\"tripId\":59999,\"messageId\":21978269,\"messageDateTime\":\"2021-09-30 21:01:20\",\"messageDateTimeUTC\":\"2021-10-01T02:01:20Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.65\",\"kph\":125,\"knots\":67.5,\"bearing\":53,\"nearest\":null,\"messageText\":\"91635:47452:[4]:09-30 21:01:20 (0.184)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21978269, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['328'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.07878\",\"36.32881\",1250.7]},\"properties\":{\"tripId\":59999,\"messageId\":21978411,\"messageDateTime\":\"2021-09-30 21:11:21\",\"messageDateTimeUTC\":\"2021-10-01T02:11:21Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"49.66\",\"kph\":79.9,\"knots\":43.2,\"bearing\":53,\"nearest\":null,\"messageText\":\"91734:47551:[4]:09-30 21:11:21 (0.305)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21978411, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['329'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-101.87768\",\"36.32852\",1204.3]},\"properties\":{\"tripId\":59999,\"messageId\":21978536,\"messageDateTime\":\"2021-09-30 21:21:22\",\"messageDateTimeUTC\":\"2021-10-01T02:21:22Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.85\",\"kph\":125.3,\"knots\":67.6,\"bearing\":89,\"nearest\":null,\"messageText\":\"91822:47639:[4]:09-30 21:21:22 (0.200)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21978536, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['330'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-101.65370\",\"36.32369\",1146.6]},\"properties\":{\"tripId\":59999,\"messageId\":21978656,\"messageDateTime\":\"2021-09-30 21:31:22\",\"messageDateTimeUTC\":\"2021-10-01T02:31:22Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.09\",\"kph\":125.7,\"knots\":67.9,\"bearing\":92,\"nearest\":null,\"messageText\":\"91919:47736:[4]:09-30 21:31:22 (0.458)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21978656, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['331'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-101.45480\",\"36.26985\",1089.4]},\"properties\":{\"tripId\":59999,\"messageId\":21978761,\"messageDateTime\":\"2021-09-30 21:41:24\",\"messageDateTimeUTC\":\"2021-10-01T02:41:24Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.59\",\"kph\":126.5,\"knots\":68.3,\"bearing\":90,\"nearest\":null,\"messageText\":\"92021:47838:[4]:09-30 21:41:24 (0.178)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21978761, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['332'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-101.37222\",\"36.24709\",1077.7]},\"properties\":{\"tripId\":59999,\"messageId\":21978823,\"messageDateTime\":\"2021-09-30 21:46:24\",\"messageDateTimeUTC\":\"2021-10-01T02:46:24Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.85\",\"kph\":126.9,\"knots\":68.5,\"bearing\":108,\"nearest\":null,\"messageText\":\"92061:47878:[4]:09-30 21:46:25 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21978823, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['333'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-101.27802\",\"36.19728\",1064.3]},\"properties\":{\"tripId\":59999,\"messageId\":21978881,\"messageDateTime\":\"2021-09-30 21:51:25\",\"messageDateTimeUTC\":\"2021-10-01T02:51:25Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.34\",\"kph\":126.1,\"knots\":68.1,\"bearing\":123,\"nearest\":null,\"messageText\":\"92111:47928:[4]:09-30 21:51:25 (0.189)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21978881, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['334'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-101.19614\",\"36.19999\",1057.3]},\"properties\":{\"tripId\":59999,\"messageId\":21979031,\"messageDateTime\":\"2021-09-30 22:04:47\",\"messageDateTimeUTC\":\"2021-10-01T03:04:47Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"27.09\",\"kph\":43.6,\"knots\":23.5,\"bearing\":43,\"nearest\":null,\"messageText\":\"92258:47964:[4]:09-30 22:04:47 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21979031, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['335'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-101.02315\",\"36.29413\",1020.9]},\"properties\":{\"tripId\":59999,\"messageId\":21979154,\"messageDateTime\":\"2021-09-30 22:14:48\",\"messageDateTimeUTC\":\"2021-10-01T03:14:48Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.37\",\"kph\":126.1,\"knots\":68.1,\"bearing\":58,\"nearest\":null,\"messageText\":\"92348:48054:[4]:09-30 22:14:48 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21979154, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['336'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.82543\",\"36.38956\",995.1]},\"properties\":{\"tripId\":59999,\"messageId\":21979259,\"messageDateTime\":\"2021-09-30 22:24:49\",\"messageDateTimeUTC\":\"2021-10-01T03:24:49Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"62.86\",\"kph\":101.2,\"knots\":54.6,\"bearing\":59,\"nearest\":null,\"messageText\":\"92448:48154:[4]:09-30 22:24:49 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21979259, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['337'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.64857\",\"36.45608\",976.5]},\"properties\":{\"tripId\":59999,\"messageId\":21979364,\"messageDateTime\":\"2021-09-30 22:34:49\",\"messageDateTimeUTC\":\"2021-10-01T03:34:49Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.65\",\"kph\":125,\"knots\":67.5,\"bearing\":69,\"nearest\":null,\"messageText\":\"92533:48239:[4]:09-30 22:34:50 (0.183)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21979364, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['338'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.54066\",\"36.45550\",955.4]},\"properties\":{\"tripId\":59999,\"messageId\":21979401,\"messageDateTime\":\"2021-09-30 22:39:50\",\"messageDateTimeUTC\":\"2021-10-01T03:39:50Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"34.32\",\"kph\":55.2,\"knots\":29.8,\"bearing\":90,\"nearest\":null,\"messageText\":\"92580:48286:[4]:09-30 22:39:50 (0.320)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21979401, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['339'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.44530\",\"36.44866\",952.6]},\"properties\":{\"tripId\":59999,\"messageId\":21979479,\"messageDateTime\":\"2021-09-30 22:44:50\",\"messageDateTimeUTC\":\"2021-10-01T03:44:50Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.66\",\"kph\":126.6,\"knots\":68.4,\"bearing\":95,\"nearest\":null,\"messageText\":\"92623:48329:[4]:09-30 22:44:50 (0.460)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21979479, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['340'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.23179\",\"36.43383\",887.5]},\"properties\":{\"tripId\":59999,\"messageId\":21979574,\"messageDateTime\":\"2021-09-30 22:54:51\",\"messageDateTimeUTC\":\"2021-10-01T03:54:51Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.02\",\"kph\":125.6,\"knots\":67.8,\"bearing\":98,\"nearest\":null,\"messageText\":\"92718:48424:[4]:09-30 22:54:51 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21979574, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['341'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.14174\",\"36.43269\",885.8]},\"properties\":{\"tripId\":59999,\"messageId\":21979686,\"messageDateTime\":\"2021-09-30 23:09:36\",\"messageDateTimeUTC\":\"2021-10-01T04:09:36Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"24.27\",\"kph\":39.1,\"knots\":21.1,\"bearing\":196,\"nearest\":null,\"messageText\":\"92878:48465:[4]:09-30 23:09:36 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21979686, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['342'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.13131\",\"36.29084\",819.4]},\"properties\":{\"tripId\":59999,\"messageId\":21979775,\"messageDateTime\":\"2021-09-30 23:19:37\",\"messageDateTimeUTC\":\"2021-10-01T04:19:37Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"75.43\",\"kph\":121.4,\"knots\":65.5,\"bearing\":179,\"nearest\":null,\"messageText\":\"92956:48543:[4]:09-30 23:19:37 (0.257)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21979775, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['343'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.18629\",\"36.17225\",839.4]},\"properties\":{\"tripId\":59999,\"messageId\":21979830,\"messageDateTime\":\"2021-09-30 23:29:38\",\"messageDateTimeUTC\":\"2021-10-01T04:29:38Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"71.22\",\"kph\":114.6,\"knots\":61.9,\"bearing\":232,\"nearest\":null,\"messageText\":\"93041:48628:[4]:09-30 23:29:38 (0.184)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21979830, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['344'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.27625\",\"36.16393\",863.2]},\"properties\":{\"tripId\":59999,\"messageId\":21979868,\"messageDateTime\":\"2021-09-30 23:34:38\",\"messageDateTimeUTC\":\"2021-10-01T04:34:38Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"72.70\",\"kph\":117,\"knots\":63.2,\"bearing\":263,\"nearest\":null,\"messageText\":\"93082:48669:[4]:09-30 23:34:38 (0.266)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21979868, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['345'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.27660\",\"36.07717\",917.6]},\"properties\":{\"tripId\":59999,\"messageId\":21979892,\"messageDateTime\":\"2021-09-30 23:39:39\",\"messageDateTimeUTC\":\"2021-10-01T04:39:39Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"73.18\",\"kph\":117.8,\"knots\":63.6,\"bearing\":180,\"nearest\":null,\"messageText\":\"93126:48713:[4]:09-30 23:39:39 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21979892, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['346'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.36870\",\"35.94958\",814.9]},\"properties\":{\"tripId\":59999,\"messageId\":21979954,\"messageDateTime\":\"2021-09-30 23:49:39\",\"messageDateTimeUTC\":\"2021-10-01T04:49:39Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.43\",\"kph\":126.2,\"knots\":68.2,\"bearing\":233,\"nearest\":null,\"messageText\":\"93220:48807:[4]:09-30 23:49:39 (0.189)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21979954, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['347'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.38495\",\"35.91491\",804.8]},\"properties\":{\"tripId\":59999,\"messageId\":21980286,\"messageDateTime\":\"2021-10-01 00:08:26\",\"messageDateTimeUTC\":\"2021-10-01T05:08:26Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"24.48\",\"kph\":39.4,\"knots\":21.3,\"bearing\":231,\"nearest\":null,\"messageText\":\"93462:48829:[4]:10-01 00:08:26 (0.189)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980286, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['348'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.38661\",\"35.75735\",885.6]},\"properties\":{\"tripId\":59999,\"messageId\":21980333,\"messageDateTime\":\"2021-10-01 00:18:27\",\"messageDateTimeUTC\":\"2021-10-01T05:18:27Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.31\",\"kph\":124.4,\"knots\":67.2,\"bearing\":174,\"nearest\":null,\"messageText\":\"93550:48917:[4]:10-01 00:18:27 (0.230)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980333, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['349'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.31356\",\"35.58213\",915.7]},\"properties\":{\"tripId\":59999,\"messageId\":21980379,\"messageDateTime\":\"2021-10-01 00:28:28\",\"messageDateTimeUTC\":\"2021-10-01T05:28:28Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.67\",\"kph\":123.4,\"knots\":66.6,\"bearing\":154,\"nearest\":null,\"messageText\":\"93651:49018:[4]:10-01 00:28:28 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980379, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['350'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.29004\",\"35.49144\",827.5]},\"properties\":{\"tripId\":59999,\"messageId\":21980402,\"messageDateTime\":\"2021-10-01 00:33:28\",\"messageDateTimeUTC\":\"2021-10-01T05:33:28Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.77\",\"kph\":123.5,\"knots\":66.7,\"bearing\":168,\"nearest\":null,\"messageText\":\"93701:49068:[4]:10-01 00:33:28 (0.194)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980402, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['351'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.27177\",\"35.42848\",868.1]},\"properties\":{\"tripId\":59999,\"messageId\":21980423,\"messageDateTime\":\"2021-10-01 00:38:29\",\"messageDateTimeUTC\":\"2021-10-01T05:38:29Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"52.73\",\"kph\":84.9,\"knots\":45.8,\"bearing\":166,\"nearest\":null,\"messageText\":\"93738:49105:[4]:10-01 00:38:29 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980423, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['352'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.24628\",\"35.25635\",748.4]},\"properties\":{\"tripId\":59999,\"messageId\":21980466,\"messageDateTime\":\"2021-10-01 00:48:29\",\"messageDateTimeUTC\":\"2021-10-01T05:48:29Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"75.63\",\"kph\":121.7,\"knots\":65.7,\"bearing\":185,\"nearest\":null,\"messageText\":\"93837:49204:[4]:10-01 00:48:29 (0.331)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980466, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['353'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.23768\",\"35.12777\",769.9]},\"properties\":{\"tripId\":59999,\"messageId\":21980504,\"messageDateTime\":\"2021-10-01 00:58:30\",\"messageDateTimeUTC\":\"2021-10-01T05:58:30Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"71.52\",\"kph\":115.1,\"knots\":62.1,\"bearing\":172,\"nearest\":null,\"messageText\":\"93909:49276:[4]:10-01 00:58:30 (0.298)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980504, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['354'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.22150\",\"34.95012\",686.2]},\"properties\":{\"tripId\":59999,\"messageId\":21980545,\"messageDateTime\":\"2021-10-01 01:08:31\",\"messageDateTimeUTC\":\"2021-10-01T06:08:31Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.64\",\"kph\":123.3,\"knots\":66.6,\"bearing\":174,\"nearest\":null,\"messageText\":\"94004:49371:[4]:10-01 01:08:31 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980545, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['355'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.19214\",\"34.78134\",663.6]},\"properties\":{\"tripId\":59999,\"messageId\":21980577,\"messageDateTime\":\"2021-10-01 01:18:32\",\"messageDateTimeUTC\":\"2021-10-01T06:18:32Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.72\",\"kph\":125.1,\"knots\":67.5,\"bearing\":172,\"nearest\":null,\"messageText\":\"94098:49465:[4]:10-01 01:18:32 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980577, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['356'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.18879\",\"34.68760\",597.8]},\"properties\":{\"tripId\":59999,\"messageId\":21980586,\"messageDateTime\":\"2021-10-01 01:23:32\",\"messageDateTimeUTC\":\"2021-10-01T06:23:32Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.37\",\"kph\":124.5,\"knots\":67.2,\"bearing\":178,\"nearest\":null,\"messageText\":\"94149:49516:[4]:10-01 01:23:32 (0.293)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980586, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['357'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.18914\",\"34.59680\",584.4]},\"properties\":{\"tripId\":59999,\"messageId\":21980614,\"messageDateTime\":\"2021-10-01 01:28:32\",\"messageDateTimeUTC\":\"2021-10-01T06:28:32Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.86\",\"kph\":126.9,\"knots\":68.5,\"bearing\":180,\"nearest\":null,\"messageText\":\"94197:49564:[4]:10-01 01:28:32 (0.391)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980614, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['358'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.22364\",\"34.43353\",652.6]},\"properties\":{\"tripId\":59999,\"messageId\":21980636,\"messageDateTime\":\"2021-10-01 01:38:33\",\"messageDateTimeUTC\":\"2021-10-01T06:38:33Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"31.67\",\"kph\":51,\"knots\":27.5,\"bearing\":190,\"nearest\":null,\"messageText\":\"94288:49655:[4]:10-01 01:38:33 (0.286)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980636, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['359'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.21905\",\"34.43186\",644.4]},\"properties\":{\"tripId\":59999,\"messageId\":21980716,\"messageDateTime\":\"2021-10-01 02:01:53\",\"messageDateTimeUTC\":\"2021-10-01T07:01:53Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"36.40\",\"kph\":58.6,\"knots\":31.6,\"bearing\":123,\"nearest\":null,\"messageText\":\"94700:49659:[4]:10-01 02:01:53 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980716, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['360'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.03394\",\"34.37504\",550]},\"properties\":{\"tripId\":59999,\"messageId\":21980758,\"messageDateTime\":\"2021-10-01 02:11:54\",\"messageDateTimeUTC\":\"2021-10-01T07:11:54Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.09\",\"kph\":122.5,\"knots\":66.1,\"bearing\":108,\"nearest\":null,\"messageText\":\"94789:49748:[4]:10-01 02:11:54 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980758, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['361'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.82294\",\"34.31387\",512.3]},\"properties\":{\"tripId\":59999,\"messageId\":21980806,\"messageDateTime\":\"2021-10-01 02:21:54\",\"messageDateTimeUTC\":\"2021-10-01T07:21:54Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.33\",\"kph\":124.5,\"knots\":67.2,\"bearing\":109,\"nearest\":null,\"messageText\":\"94890:49849:[4]:10-01 02:21:55 (0.186)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980806, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['362'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.73791\",\"34.28892\",532.5]},\"properties\":{\"tripId\":59999,\"messageId\":21980824,\"messageDateTime\":\"2021-10-01 02:26:55\",\"messageDateTimeUTC\":\"2021-10-01T07:26:55Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"43.65\",\"kph\":70.2,\"knots\":37.9,\"bearing\":109,\"nearest\":null,\"messageText\":\"94931:49890:[4]:10-01 02:26:55 (0.326)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980824, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['363'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.63802\",\"34.26842\",501.8]},\"properties\":{\"tripId\":59999,\"messageId\":21980839,\"messageDateTime\":\"2021-10-01 02:31:55\",\"messageDateTimeUTC\":\"2021-10-01T07:31:55Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.18\",\"kph\":124.2,\"knots\":67.1,\"bearing\":103,\"nearest\":null,\"messageText\":\"94978:49937:[4]:10-01 02:31:56 (0.191)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980839, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['364'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.44124\",\"34.23542\",463]},\"properties\":{\"tripId\":59999,\"messageId\":21980890,\"messageDateTime\":\"2021-10-01 02:41:56\",\"messageDateTimeUTC\":\"2021-10-01T07:41:56Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.09\",\"kph\":125.7,\"knots\":67.9,\"bearing\":105,\"nearest\":null,\"messageText\":\"95069:50028:[4]:10-01 02:41:56 (0.402)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980890, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['365'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.24802\",\"34.15298\",395.8]},\"properties\":{\"tripId\":59999,\"messageId\":21980939,\"messageDateTime\":\"2021-10-01 02:51:57\",\"messageDateTimeUTC\":\"2021-10-01T07:51:57Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.93\",\"kph\":125.4,\"knots\":67.7,\"bearing\":114,\"nearest\":null,\"messageText\":\"95170:50129:[4]:10-01 02:51:57 (0.189)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980939, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['366'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.04316\",\"34.08548\",417.2]},\"properties\":{\"tripId\":59999,\"messageId\":21981015,\"messageDateTime\":\"2021-10-01 03:01:58\",\"messageDateTimeUTC\":\"2021-10-01T08:01:58Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.68\",\"kph\":125,\"knots\":67.5,\"bearing\":121,\"nearest\":null,\"messageText\":\"95271:50230:[4]:10-01 03:01:58 (0.184)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21981015, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['367'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.00942\",\"34.07027\",418.5]},\"properties\":{\"tripId\":59999,\"messageId\":21981209,\"messageDateTime\":\"2021-10-01 03:32:07\",\"messageDateTimeUTC\":\"2021-10-01T08:32:07Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"21.04\",\"kph\":33.9,\"knots\":18.3,\"bearing\":173,\"nearest\":null,\"messageText\":\"95918:50248:[4]:10-01 03:32:07 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21981209, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['368'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-98.90411\",\"34.04175\",408.2]},\"properties\":{\"tripId\":59999,\"messageId\":21981236,\"messageDateTime\":\"2021-10-01 03:37:07\",\"messageDateTimeUTC\":\"2021-10-01T08:37:07Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"79.24\",\"kph\":127.5,\"knots\":68.9,\"bearing\":108,\"nearest\":null,\"messageText\":\"95967:50297:[4]:10-01 03:37:07 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21981236, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['369'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-98.81255\",\"33.98450\",363.5]},\"properties\":{\"tripId\":59999,\"messageId\":21981270,\"messageDateTime\":\"2021-10-01 03:42:08\",\"messageDateTimeUTC\":\"2021-10-01T08:42:08Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.96\",\"kph\":127.1,\"knots\":68.6,\"bearing\":127,\"nearest\":null,\"messageText\":\"96018:50348:[4]:10-01 03:42:08 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21981270, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['370'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-98.58840\",\"33.95357\",337.1]},\"properties\":{\"tripId\":59999,\"messageId\":21981331,\"messageDateTime\":\"2021-10-01 03:52:09\",\"messageDateTimeUTC\":\"2021-10-01T08:52:09Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"79.32\",\"kph\":127.7,\"knots\":68.9,\"bearing\":97,\"nearest\":null,\"messageText\":\"96119:50449:[4]:10-01 03:52:09 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21981331, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['371'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-98.42073\",\"33.88136\",335.2]},\"properties\":{\"tripId\":59999,\"messageId\":21981392,\"messageDateTime\":\"2021-10-01 04:02:09\",\"messageDateTimeUTC\":\"2021-10-01T09:02:09Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"78.39\",\"kph\":126.2,\"knots\":68.1,\"bearing\":114,\"nearest\":null,\"messageText\":\"96212:50542:[4]:10-01 04:02:09 (0.360)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21981392, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['372'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-98.21698\",\"33.81375\",305.5]},\"properties\":{\"tripId\":59999,\"messageId\":21981451,\"messageDateTime\":\"2021-10-01 04:12:10\",\"messageDateTimeUTC\":\"2021-10-01T09:12:10Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"59.64\",\"kph\":96,\"knots\":51.8,\"bearing\":116,\"nearest\":null,\"messageText\":\"96311:50641:[4]:10-01 04:12:10 (0.331)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21981451, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['373'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-98.18338\",\"33.81530\",306.5]},\"properties\":{\"tripId\":59999,\"messageId\":21981543,\"messageDateTime\":\"2021-10-01 04:25:44\",\"messageDateTimeUTC\":\"2021-10-01T09:25:44Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"38.32\",\"kph\":61.7,\"knots\":33.3,\"bearing\":67,\"nearest\":null,\"messageText\":\"96422:50657:[4]:10-01 04:25:44 (0.184)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21981543, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['374'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-98.07638\",\"33.81273\",300.9]},\"properties\":{\"tripId\":59999,\"messageId\":21981576,\"messageDateTime\":\"2021-10-01 04:30:44\",\"messageDateTimeUTC\":\"2021-10-01T09:30:44Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"81.32\",\"kph\":130.9,\"knots\":70.7,\"bearing\":91,\"nearest\":null,\"messageText\":\"96470:50705:[4]:10-01 04:30:44 (0.321)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21981576, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['375'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.96224\",\"33.81705\",290.1]},\"properties\":{\"tripId\":59999,\"messageId\":21981600,\"messageDateTime\":\"2021-10-01 04:35:44\",\"messageDateTimeUTC\":\"2021-10-01T09:35:44Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.99\",\"kph\":125.5,\"knots\":67.8,\"bearing\":87,\"nearest\":null,\"messageText\":\"96520:50755:[4]:10-01 04:35:44 (0.176)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21981600, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['376'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.74015\",\"33.78210\",311.9]},\"properties\":{\"tripId\":59999,\"messageId\":21981663,\"messageDateTime\":\"2021-10-01 04:45:45\",\"messageDateTimeUTC\":\"2021-10-01T09:45:45Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"52.54\",\"kph\":84.6,\"knots\":45.7,\"bearing\":100,\"nearest\":null,\"messageText\":\"96621:50856:[4]:10-01 04:45:45 (0.289)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21981663, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['377'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.56471\",\"33.72430\",354.9]},\"properties\":{\"tripId\":59999,\"messageId\":21981732,\"messageDateTime\":\"2021-10-01 04:55:46\",\"messageDateTimeUTC\":\"2021-10-01T09:55:46Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"77.47\",\"kph\":124.7,\"knots\":67.3,\"bearing\":119,\"nearest\":null,\"messageText\":\"96709:50944:[4]:10-01 04:55:46 (0.183)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21981732, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['378'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.38356\",\"33.64832\",326.2]},\"properties\":{\"tripId\":59999,\"messageId\":21981798,\"messageDateTime\":\"2021-10-01 05:05:47\",\"messageDateTimeUTC\":\"2021-10-01T10:05:47Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"55.32\",\"kph\":89,\"knots\":48.1,\"bearing\":110,\"nearest\":null,\"messageText\":\"96801:51036:[4]:10-01 05:05:47 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21981798, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['379'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.19102\",\"33.64089\",264.7]},\"properties\":{\"tripId\":59999,\"messageId\":21981866,\"messageDateTime\":\"2021-10-01 05:15:47\",\"messageDateTimeUTC\":\"2021-10-01T10:15:47Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"60.26\",\"kph\":97,\"knots\":52.4,\"bearing\":92,\"nearest\":null,\"messageText\":\"96887:51122:[4]:10-01 05:15:47 (0.326)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21981866, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['380'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.12684\",\"33.64228\",269.5]},\"properties\":{\"tripId\":59999,\"messageId\":21981910,\"messageDateTime\":\"2021-10-01 05:20:47\",\"messageDateTimeUTC\":\"2021-10-01T10:20:47Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"40.08\",\"kph\":64.5,\"knots\":34.8,\"bearing\":88,\"nearest\":null,\"messageText\":\"96916:51151:[4]:10-01 05:20:47 (0.425)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21981910, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['381'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.04380\",\"33.64978\",277.7]},\"properties\":{\"tripId\":59999,\"messageId\":21981944,\"messageDateTime\":\"2021-10-01 05:25:47\",\"messageDateTimeUTC\":\"2021-10-01T10:25:47Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"62.02\",\"kph\":99.8,\"knots\":53.9,\"bearing\":83,\"nearest\":null,\"messageText\":\"96953:51188:[4]:10-01 05:25:47 (0.469)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21981944, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['382'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.84817\",\"33.67270\",248.5]},\"properties\":{\"tripId\":59999,\"messageId\":21982037,\"messageDateTime\":\"2021-10-01 05:35:48\",\"messageDateTimeUTC\":\"2021-10-01T10:35:48Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"71.00\",\"kph\":114.3,\"knots\":61.7,\"bearing\":76,\"nearest\":null,\"messageText\":\"97042:51277:[4]:10-01 05:35:48 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21982037, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['383'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.64055\",\"33.67098\",263.1]},\"properties\":{\"tripId\":59999,\"messageId\":21982135,\"messageDateTime\":\"2021-10-01 05:45:49\",\"messageDateTimeUTC\":\"2021-10-01T10:45:49Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"62.01\",\"kph\":99.8,\"knots\":53.9,\"bearing\":89,\"nearest\":null,\"messageText\":\"97130:51365:[4]:10-01 05:45:49 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21982135, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['384'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.58949\",\"33.70975\",232]},\"properties\":{\"tripId\":59999,\"messageId\":21982238,\"messageDateTime\":\"2021-10-01 05:55:49\",\"messageDateTimeUTC\":\"2021-10-01T10:55:49Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"35.09\",\"kph\":56.5,\"knots\":30.5,\"bearing\":16,\"nearest\":null,\"messageText\":\"97196:51431:[4]:10-01 05:55:49 (0.443)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21982238, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['385'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.59239\",\"33.70856\",233.8]},\"properties\":{\"tripId\":59999,\"messageId\":21982370,\"messageDateTime\":\"2021-10-01 06:06:50\",\"messageDateTimeUTC\":\"2021-10-01T11:06:50Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"18.74\",\"kph\":30.2,\"knots\":16.3,\"bearing\":341,\"nearest\":null,\"messageText\":\"97274:51435:[4]:10-01 06:06:51 (0.188)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21982370, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['386'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.59043\",\"33.70900\",236.3]},\"properties\":{\"tripId\":59999,\"messageId\":21982427,\"messageDateTime\":\"2021-10-01 06:11:51\",\"messageDateTimeUTC\":\"2021-10-01T11:11:51Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":74,\"nearest\":null,\"messageText\":\"97277:51438:[4]:10-01 06:11:51 (0.276)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21982427, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['387'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.61062\",\"33.66840\",277.4]},\"properties\":{\"tripId\":59999,\"messageId\":21982542,\"messageDateTime\":\"2021-10-01 06:16:51\",\"messageDateTimeUTC\":\"2021-10-01T11:16:51Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"75.60\",\"kph\":121.7,\"knots\":65.7,\"bearing\":202,\"nearest\":null,\"messageText\":\"97302:51463:[4]:10-01 06:16:51 (0.331)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21982542, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['388'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.61974\",\"33.49907\",280.8]},\"properties\":{\"tripId\":59999,\"messageId\":21982787,\"messageDateTime\":\"2021-10-01 06:26:52\",\"messageDateTimeUTC\":\"2021-10-01T11:26:52Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.79\",\"kph\":123.6,\"knots\":66.7,\"bearing\":187,\"nearest\":null,\"messageText\":\"97395:51556:[4]:10-01 06:26:52 (0.309)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21982787, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['389'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.59070\",\"33.31713\",222.6]},\"properties\":{\"tripId\":59999,\"messageId\":21982978,\"messageDateTime\":\"2021-10-01 06:36:53\",\"messageDateTimeUTC\":\"2021-10-01T11:36:53Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"79.43\",\"kph\":127.8,\"knots\":69,\"bearing\":183,\"nearest\":null,\"messageText\":\"97494:51655:[4]:10-01 06:36:53 (0.290)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21982978, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['390'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.65046\",\"33.14517\",216.6]},\"properties\":{\"tripId\":59999,\"messageId\":21983291,\"messageDateTime\":\"2021-10-01 06:46:53\",\"messageDateTimeUTC\":\"2021-10-01T11:46:53Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"76.06\",\"kph\":122.4,\"knots\":66.1,\"bearing\":189,\"nearest\":null,\"messageText\":\"97592:51753:[4]:10-01 06:46:54 (0.187)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21983291, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['391'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.71850\",\"33.08510\",226.7]},\"properties\":{\"tripId\":59999,\"messageId\":21983584,\"messageDateTime\":\"2021-10-01 06:56:54\",\"messageDateTimeUTC\":\"2021-10-01T11:56:54Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":226,\"nearest\":null,\"messageText\":\"97643:51804:[7]:10-01 06:56:55 (0.185)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#0f0\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21983584, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['392'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.71844\",\"33.08506\",230]},\"properties\":{\"tripId\":59999,\"messageId\":21983640,\"messageDateTime\":\"2021-10-01 06:58:53\",\"messageDateTimeUTC\":\"2021-10-01T11:58:53Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":128,\"nearest\":null,\"messageText\":\"97647:51805:[15]:10-01 06:58:54 (0.582)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#fff\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\",\"borderColor\":\"#ff00ff\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21983640, 'TRACK'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['393'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.06254\",\"33.43461\",126.1]},\"properties\":{\"tripId\":59999,\"messageId\":21909224,\"messageDateTime\":\"2021-09-28 10:19:06\",\"messageDateTimeUTC\":\"2021-09-28T15:19:06Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"FOOD\",\"messageTypeDescription\":\"Food\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":277,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/79169b9375c3bc35b96af2f5d944bfa3-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/79169b9375c3bc35b96af2f5d944bfa3.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21909224, 'FOOD'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['394'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.84188\",\"27.52990\",12.4]},\"properties\":{\"tripId\":59999,\"messageId\":21924258,\"messageDateTime\":\"2021-09-28 22:09:51\",\"messageDateTimeUTC\":\"2021-09-29T03:09:51Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"FOOD\",\"messageTypeDescription\":\"Food\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":294,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/7d57f8c0c743dd4660dd0e637e5efcf9-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/7d57f8c0c743dd4660dd0e637e5efcf9.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21924258, 'FOOD'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['395'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.22450\",\"26.07281\",2.8]},\"properties\":{\"tripId\":59999,\"messageId\":21928978,\"messageDateTime\":\"2021-09-29 06:29:28\",\"messageDateTimeUTC\":\"2021-09-29T11:29:28Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"FOOD\",\"messageTypeDescription\":\"Food\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":89,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/5dcc9229b475dba8411d77d43d392619-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/5dcc9229b475dba8411d77d43d392619.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21928978, 'FOOD'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['396'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.85597\",\"28.52344\",176.1]},\"properties\":{\"tripId\":59999,\"messageId\":21935779,\"messageDateTime\":\"2021-09-29 11:45:52\",\"messageDateTimeUTC\":\"2021-09-29T16:45:52Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"FOOD\",\"messageTypeDescription\":\"Food\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":228,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/a18061092d3e8500b710a223de89b35c-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/a18061092d3e8500b710a223de89b35c.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21935779, 'FOOD'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['397'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.38668\",\"30.13676\",937.1]},\"properties\":{\"tripId\":59999,\"messageId\":21941312,\"messageDateTime\":\"2021-09-29 15:28:41\",\"messageDateTimeUTC\":\"2021-09-29T20:28:41Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"FOOD\",\"messageTypeDescription\":\"Food\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":156,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/0cac62c8c3a8d2e7553aae2278c052a9-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/0cac62c8c3a8d2e7553aae2278c052a9.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21941312, 'FOOD'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['398'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.77083\",\"29.26263\",791.4]},\"properties\":{\"tripId\":59999,\"messageId\":21948785,\"messageDateTime\":\"2021-09-29 18:36:13\",\"messageDateTimeUTC\":\"2021-09-29T23:36:13Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"FOOD\",\"messageTypeDescription\":\"Food\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":318,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/4ca7f8fdb043b60514e1944143d5897c-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/4ca7f8fdb043b60514e1944143d5897c.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21948785, 'FOOD'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['399'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-106.58429\",\"31.91197\",1325]},\"properties\":{\"tripId\":59999,\"messageId\":21953331,\"messageDateTime\":\"2021-09-30 00:12:14\",\"messageDateTimeUTC\":\"2021-09-30T05:12:14Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"FOOD\",\"messageTypeDescription\":\"Food\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":271,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/7f969a497a3b8993fd15080d5119d4b1-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/7f969a497a3b8993fd15080d5119d4b1.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21953331, 'FOOD'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['400'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-106.17754\",\"31.81883\",1376.8]},\"properties\":{\"tripId\":59999,\"messageId\":21964218,\"messageDateTime\":\"2021-09-30 10:13:33\",\"messageDateTimeUTC\":\"2021-09-30T15:13:33Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"FOOD\",\"messageTypeDescription\":\"Food\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":270,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/a3873f0e1b0e827ed06dc2fa80f2722e-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/a3873f0e1b0e827ed06dc2fa80f2722e.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21964218, 'FOOD'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['401'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.42905\",\"35.23831\",1375.7]},\"properties\":{\"tripId\":59999,\"messageId\":21975848,\"messageDateTime\":\"2021-09-30 18:26:29\",\"messageDateTimeUTC\":\"2021-09-30T23:26:29Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"FOOD\",\"messageTypeDescription\":\"Food\",\"messageSource\":\"SWConnect\",\"mph\":\"0.28\",\"kph\":0.5,\"knots\":0.2,\"bearing\":294,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/3450654a8feafc38fe87daac3f16a97a-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/3450654a8feafc38fe87daac3f16a97a.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21975848, 'FOOD'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['402'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.38318\",\"35.91606\",813.1]},\"properties\":{\"tripId\":59999,\"messageId\":21980037,\"messageDateTime\":\"2021-10-01 00:03:13\",\"messageDateTimeUTC\":\"2021-10-01T05:03:13Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"FOOD\",\"messageTypeDescription\":\"Food\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":301,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/1f5be08bce926b13218015e837f3d765-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/1f5be08bce926b13218015e837f3d765.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980037, 'FOOD'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['403'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.00955\",\"34.07126\",414.6]},\"properties\":{\"tripId\":59999,\"messageId\":21981084,\"messageDateTime\":\"2021-10-01 03:13:37\",\"messageDateTimeUTC\":\"2021-10-01T08:13:37Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"FOOD\",\"messageTypeDescription\":\"Food\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":180,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/e2860499aa3c599ce372ae1d2dd19a59-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/e2860499aa3c599ce372ae1d2dd19a59.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21981084, 'FOOD'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['404'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.18503\",\"31.79014\",93.8]},\"properties\":{\"tripId\":59999,\"messageId\":21912694,\"messageDateTime\":\"2021-09-28 12:28:33\",\"messageDateTimeUTC\":\"2021-09-28T17:28:33Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"GAS\",\"messageTypeDescription\":\"Gas\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":40,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/19c69413977f3cae39cd5056a7b26e7d-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/19c69413977f3cae39cd5056a7b26e7d.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21912694, 'GAS'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['405'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-93.95413\",\"29.87129\",3.3]},\"properties\":{\"tripId\":59999,\"messageId\":21916185,\"messageDateTime\":\"2021-09-28 15:06:15\",\"messageDateTimeUTC\":\"2021-09-28T20:06:15Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"GAS\",\"messageTypeDescription\":\"Gas\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":174,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/14f17e663a74dcc2f35143b59655e781-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/14f17e663a74dcc2f35143b59655e781.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21916185, 'GAS'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['406'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-94.81066\",\"29.29543\",1.4]},\"properties\":{\"tripId\":59999,\"messageId\":21918971,\"messageDateTime\":\"2021-09-28 17:02:13\",\"messageDateTimeUTC\":\"2021-09-28T22:02:13Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"GAS\",\"messageTypeDescription\":\"Gas\",\"messageSource\":\"SWConnect\",\"mph\":\"0.34\",\"kph\":0.5,\"knots\":0.3,\"bearing\":89,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/43f7af4301a3ac4f162ba3ef6d30898e-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/43f7af4301a3ac4f162ba3ef6d30898e.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21918971, 'GAS'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['407'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.96630\",\"28.77812\",34.2]},\"properties\":{\"tripId\":59999,\"messageId\":21922630,\"messageDateTime\":\"2021-09-28 20:15:07\",\"messageDateTimeUTC\":\"2021-09-29T01:15:07Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"GAS\",\"messageTypeDescription\":\"Gas\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":191,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/52f34d69e0519f9ca33c6ef5b5661e67-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/52f34d69e0519f9ca33c6ef5b5661e67.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21922630, 'GAS'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['408'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.16373\",\"26.08414\",5.1]},\"properties\":{\"tripId\":59999,\"messageId\":21925591,\"messageDateTime\":\"2021-09-29 00:28:52\",\"messageDateTimeUTC\":\"2021-09-29T05:28:52Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"GAS\",\"messageTypeDescription\":\"Gas\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":204,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/58da819f470d8cae2f8b62b933be2e43-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/58da819f470d8cae2f8b62b933be2e43.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21925591, 'GAS'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['409'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-99.50235\",\"27.53064\",130.2]},\"properties\":{\"tripId\":59999,\"messageId\":21933709,\"messageDateTime\":\"2021-09-29 10:21:57\",\"messageDateTimeUTC\":\"2021-09-29T15:21:57Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"GAS\",\"messageTypeDescription\":\"Gas\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":5,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/ba6e25e2ca7c5e00f796055747fe029f-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/ba6e25e2ca7c5e00f796055747fe029f.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21933709, 'GAS'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['410'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.90569\",\"29.38607\",350.4]},\"properties\":{\"tripId\":59999,\"messageId\":21938811,\"messageDateTime\":\"2021-09-29 13:46:43\",\"messageDateTimeUTC\":\"2021-09-29T18:46:43Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"GAS\",\"messageTypeDescription\":\"Gas\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":221,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/7ac360de6b05e0cfed96230f61801563-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/7ac360de6b05e0cfed96230f61801563.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21938811, 'GAS'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['411'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.23574\",\"30.20684\",1388.5]},\"properties\":{\"tripId\":59999,\"messageId\":21942742,\"messageDateTime\":\"2021-09-29 16:31:19\",\"messageDateTimeUTC\":\"2021-09-29T21:31:19Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"GAS\",\"messageTypeDescription\":\"Gas\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":120,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/4a226e2e27c70b0254a629c65099bc97-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/4a226e2e27c70b0254a629c65099bc97.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21942742, 'GAS'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['412'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.37215\",\"29.56049\",859.7]},\"properties\":{\"tripId\":59999,\"messageId\":21950281,\"messageDateTime\":\"2021-09-29 19:48:07\",\"messageDateTimeUTC\":\"2021-09-30T00:48:07Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"GAS\",\"messageTypeDescription\":\"Gas\",\"messageSource\":\"SWConnect\",\"mph\":\"1.27\",\"kph\":2,\"knots\":1.1,\"bearing\":196,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/a2257672236ab46313c0abaae491b210-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/a2257672236ab46313c0abaae491b210.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21950281, 'GAS'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['413'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-104.83042\",\"31.03603\",1376.8]},\"properties\":{\"tripId\":59999,\"messageId\":21952323,\"messageDateTime\":\"2021-09-29 22:08:26\",\"messageDateTimeUTC\":\"2021-09-30T03:08:26Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"GAS\",\"messageTypeDescription\":\"Gas\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":298,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/e0fae69fc71cb9a72c47df745b091aeb-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/e0fae69fc71cb9a72c47df745b091aeb.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21952323, 'GAS'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['414'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.10377\",\"31.84332\",962.2]},\"properties\":{\"tripId\":59999,\"messageId\":21969425,\"messageDateTime\":\"2021-09-30 13:49:27\",\"messageDateTimeUTC\":\"2021-09-30T18:49:27Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"GAS\",\"messageTypeDescription\":\"Gas\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":270,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/cf797ce0d5c09af90378eab6db18a0ac-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/cf797ce0d5c09af90378eab6db18a0ac.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21969425, 'GAS'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['415'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.81899\",\"32.96326\",1214.3]},\"properties\":{\"tripId\":59999,\"messageId\":21972022,\"messageDateTime\":\"2021-09-30 15:36:29\",\"messageDateTimeUTC\":\"2021-09-30T20:36:29Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"GAS\",\"messageTypeDescription\":\"Gas\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":338,\"nearest\":null,\"messageText\":null,\"smallPic\":null,\"largePic\":null,\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21972022, 'GAS'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['416'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-102.72361\",\"34.22640\",1284.2]},\"properties\":{\"tripId\":59999,\"messageId\":21974010,\"messageDateTime\":\"2021-09-30 17:00:49\",\"messageDateTimeUTC\":\"2021-09-30T22:00:49Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"GAS\",\"messageTypeDescription\":\"Gas\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":47,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/ab21e58c585d512a25d6b30da76feec0-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/ab21e58c585d512a25d6b30da76feec0.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21974010, 'GAS'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['417'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.01873\",\"36.37428\",1584.2]},\"properties\":{\"tripId\":59999,\"messageId\":21977544,\"messageDateTime\":\"2021-09-30 20:10:51\",\"messageDateTimeUTC\":\"2021-10-01T01:10:51Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"GAS\",\"messageTypeDescription\":\"Gas\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":250,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/7bb9b4e54e9b7f6d2a2ca9f784b5fa0d-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/7bb9b4e54e9b7f6d2a2ca9f784b5fa0d.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21977544, 'GAS'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['418'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-101.19771\",\"36.19867\",1055.4]},\"properties\":{\"tripId\":59999,\"messageId\":21978986,\"messageDateTime\":\"2021-09-30 22:00:33\",\"messageDateTimeUTC\":\"2021-10-01T03:00:33Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"GAS\",\"messageTypeDescription\":\"Gas\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":223,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/23a9abd29a69d8dc1cd4d96b338827ea-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/23a9abd29a69d8dc1cd4d96b338827ea.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21978986, 'GAS'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['419'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.14138\",\"36.43367\",879.7]},\"properties\":{\"tripId\":59999,\"messageId\":21979677,\"messageDateTime\":\"2021-09-30 23:08:12\",\"messageDateTimeUTC\":\"2021-10-01T04:08:12Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"GAS\",\"messageTypeDescription\":\"Gas\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":61,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/68ca83155dfc761b25ed0ef4b4f41ede-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/68ca83155dfc761b25ed0ef4b4f41ede.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21979677, 'GAS'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['420'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-100.22090\",\"34.43286\",639]},\"properties\":{\"tripId\":59999,\"messageId\":21980662,\"messageDateTime\":\"2021-10-01 01:47:26\",\"messageDateTimeUTC\":\"2021-10-01T06:47:26Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"GAS\",\"messageTypeDescription\":\"Gas\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":344,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/ffd5c304686f1700f98c45c128cc978f-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/ffd5c304686f1700f98c45c128cc978f.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21980662, 'GAS'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['421'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.59201\",\"33.70760\",230.5]},\"properties\":{\"tripId\":59999,\"messageId\":21982290,\"messageDateTime\":\"2021-10-01 06:01:34\",\"messageDateTimeUTC\":\"2021-10-01T11:01:34Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"GAS\",\"messageTypeDescription\":\"Gas\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":227,\"nearest\":null,\"messageText\":null,\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/62f8d0d5ec2650d9e04ea9dc9285b771-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/62f8d0d5ec2650d9e04ea9dc9285b771.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21982290, 'GAS'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['422'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.21688\",\"26.07150\",11]},\"properties\":{\"tripId\":59999,\"messageId\":21926546,\"messageDateTime\":\"2021-09-29 00:50:35\",\"messageDateTimeUTC\":\"2021-09-29T05:50:35Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"HOTEL\",\"messageTypeDescription\":\"Hotel \\\/ Lodging\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":183,\"nearest\":null,\"messageText\":\"sleep Start\",\"smallPic\":null,\"largePic\":null,\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21926546, 'HOTEL'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['423'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-97.21708\",\"26.07128\",6.5]},\"properties\":{\"tripId\":59999,\"messageId\":21928879,\"messageDateTime\":\"2021-09-29 06:20:21\",\"messageDateTimeUTC\":\"2021-09-29T11:20:21Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"HOTEL\",\"messageTypeDescription\":\"Hotel \\\/ Lodging\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":219,\"nearest\":null,\"messageText\":\"sleep end\",\"smallPic\":null,\"largePic\":null,\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21928879, 'HOTEL'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['424'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-106.58082\",\"31.99587\",1342.2]},\"properties\":{\"tripId\":59999,\"messageId\":21953468,\"messageDateTime\":\"2021-09-30 00:33:05\",\"messageDateTimeUTC\":\"2021-09-30T05:33:05Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"HOTEL\",\"messageTypeDescription\":\"Hotel \\\/ Lodging\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":241,\"nearest\":null,\"messageText\":\"sleep start\",\"smallPic\":null,\"largePic\":null,\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21953468, 'HOTEL'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['425'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-106.58083\",\"31.99584\",1342.7]},\"properties\":{\"tripId\":59999,\"messageId\":21962916,\"messageDateTime\":\"2021-09-30 09:22:06\",\"messageDateTimeUTC\":\"2021-09-30T14:22:06Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"HOTEL\",\"messageTypeDescription\":\"Hotel \\\/ Lodging\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":195,\"nearest\":null,\"messageText\":\"sleep end\",\"smallPic\":null,\"largePic\":null,\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21962916, 'HOTEL'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['426'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-106.58057\",\"31.99596\",1341.5]},\"properties\":{\"tripId\":59999,\"messageId\":21962976,\"messageDateTime\":\"2021-09-30 09:24:57\",\"messageDateTimeUTC\":\"2021-09-30T14:24:57Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"HOTEL\",\"messageTypeDescription\":\"Hotel \\\/ Lodging\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":61,\"nearest\":null,\"messageText\":\"leaving\",\"smallPic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/bb3c6b98839b0b7644b88b444cb78e42-T.png\",\"largePic\":\"https:\\\/\\\/s3.amazonaws.com\\\/storage-public.spotwalla.com\\\/prd\\\/pics\\\/2945\\\/bb3c6b98839b0b7644b88b444cb78e42.png\",\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21962976, 'HOTEL'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['427'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n var feature = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-103.20615\",\"29.32820\",1267.8]},\"properties\":{\"tripId\":59999,\"messageId\":21947832,\"messageDateTime\":\"2021-09-29 17:37:25\",\"messageDateTimeUTC\":\"2021-09-29T22:37:25Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"BLOC\",\"messageTypeDescription\":\"Bonus Location\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":135,\"nearest\":null,\"messageText\":\"Panther Junction\",\"smallPic\":null,\"largePic\":null,\"color\":\"#000\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\"}};\n\n var a = null;\n bearing = 0;\n var hasPic = false;\n if (feature.geometry.type === 'Point') {\n if (feature.properties.smallPic !== undefined && feature.properties.smallPic !== null && feature.properties.smallPic.length > 0 && feature.properties.largePic !== undefined && feature.properties.largePic !== null && feature.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + feature.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(feature.geometry.coordinates)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n markersWithPics.push(m);\n hasPic = true;\n }\n\n if (feature.properties.messageType === 'TRACK') {\n a = document.createElement('div');\n bearing = feature.properties.bearing;\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; color: #000;\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'CUST') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'OK') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'HELP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKRES') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else if (feature.properties.messageType === 'TRKSTP') {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; font-size: 6px; vertical-align: middle; color: \" + feature.properties.color + \";\";\n a.innerHTML = '';\n } else {\n a = document.createElement('div');\n a.style = \"color: \" + feature.properties.color + \"; background-color: #eee; padding: 2px; border: 1px solid #000; border-radius: 4px;\";\n a.innerHTML = feature.properties.icon;\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21947832, 'BLOC'); });\n\n var anchor = 'center';\n var m = new mapboxgl.Marker({ 'element': a, 'rotation': bearing, 'color': feature.properties.color, 'anchor': anchor })\n .setLngLat(feature.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(feature.geometry.coordinates);\n markers.push(m);\n if (hasPic) {\n picListMarkers['428'] = m;\n plHtml += '
\"A<\/div>';\n }\n }\n af = {\"type\":\"Feature\",\"geometry\":{\"type\":\"Point\",\"coordinates\":[\"-96.71844\",\"33.08506\",230]},\"properties\":{\"tripId\":59999,\"messageId\":21983640,\"messageDateTime\":\"2021-10-01 06:58:53\",\"messageDateTimeUTC\":\"2021-10-01T11:58:53Z\",\"timezone\":\"America\\\/Chicago\",\"messageType\":\"TRACK\",\"messageTypeDescription\":\"Tracking\",\"messageSource\":\"SWConnect\",\"mph\":\"0.00\",\"kph\":0,\"knots\":0,\"bearing\":128,\"nearest\":null,\"messageText\":\"97647:51805:[15]:10-01 06:58:54 (0.582)\",\"smallPic\":null,\"largePic\":null,\"color\":\"#fff\",\"icon\":\"<\\\/i>\",\"profileIcon\":\"fa-solid fa-arrow-alt-up fa-bounce\",\"borderColor\":\"#ff00ff\"}};\n bearing = 0;\n if (af.type === 'Feature' && af.geometry.type === 'Point') {\n el = document.createElement('div');\n \/\/el.className = \"sw-marker-last-active\";\n if (af.properties.messageType === 'OK') {\n el.style = \"color: #000; background-color: #0f0;padding: 2px; border: 2px solid \" + af.properties.borderColor + \"; border-radius: 4px;\";\n el.innerHTML = '<\/i>';\n bearing = af.properties.bearing;\n } else if (af.properties.messageType === 'TRACK' || af.properties.messageType === 'TRACE') {\n el.style = \"color: #000; background-color: #ffa500;padding: 2px; border: 2px solid \" + af.properties.borderColor + \"; border-radius: 4px;\";\n el.innerHTML = '<\/i>';\n bearing = af.properties.bearing;\n } else if (af.properties.messageType === 'CUST') {\n el.style = \"color: #000; background-color: #ff0;padding: 2px; border: 2px solid \" + af.properties.borderColor + \"; border-radius: 4px;\";\n el.innerHTML = '<\/i>';\n bearing = af.properties.bearing;\n } else if (af.properties.messageType === 'HELP') {\n el.style = \"color: #000; background-color: #f00;padding: 2px; border: 2px solid \" + af.properties.borderColor + \"; border-radius: 4px;\";\n el.innerHTML = '<\/i>';\n bearing = af.properties.bearing;\n } else {\n el.style = \"color: #000; background-color: #eee;padding: 2px; border: 2px solid \" + af.properties.borderColor + \"; border-radius: 4px;\";\n el.innerHTML = '<\/i>';\n }\n\n p = new mapboxgl.Popup({ offset: 3, maxWidth: 'none', closeButton: true });\n p.on('open', function(e) { displayPopup(e.target, 59999, 21983640, 'TRACK'); });\n\n m = new mapboxgl.Marker({ 'element': el, 'rotation': bearing })\n .setLngLat(af.geometry.coordinates)\n .setPopup(p)\n .addTo(map);\n bounds.extend(af.geometry.coordinates);\n markers.push(m);\n if (lastLocation == null) lastLocation = af.geometry.coordinates;\n if (af.properties.smallPic !== undefined && af.properties.smallPic !== null && af.properties.smallPic.length > 0 && af.properties.largePic !== undefined && af.properties.largePic !== null && af.properties.largePic.length > 0) {\n a = document.createElement('div');\n a.style = \"display: inline-block; padding: 0; margin: 0; text-align: center; vertical-align: middle; opacity: 0.8; color: \" + af.properties.color + \";\";\n a.innerHTML = '\"\"<\/a>';\n\n m = new mapboxgl.Marker({ 'element': a, 'anchor': 'bottom-left' })\n .setLngLat(af.geometry.coordinates)\n .addTo(map);\n markers.push(m);\n markersWithPics.push(m);\n picListMarkers['429'] = m;\n plHtml += '
\"A<\/div>';\n }\n\n }\n \nif (plHtml.length > 0) {\n picList.html('
' + plHtml + '<\/div>');\n} else {\n picList.html('<\/i>Sorry. This trip does not have any locations with pictures.');\n}\n\n var nc = $('#message-counts');\n var t = '
Message Type<\/th>Available<\/th>On Map<\/th><\/tr><\/thead>';\n t += '
Ok<\/td>1<\/td>1<\/td><\/tr>';\n t += '
Tracking<\/td>653<\/td>392<\/td><\/tr>';\n t += '
Food<\/td>11<\/td>11<\/td><\/tr>';\n t += '
Gas<\/td>18<\/td>18<\/td><\/tr>';\n t += '
Hotel \/ Lodging<\/td>5<\/td>5<\/td><\/tr>';\n t += '
Bonus Location<\/td>1<\/td>1<\/td><\/tr>';\n t += '<\/table>';\n nc.html(t);\n\n if (! bounds.isEmpty()) map.fitBounds(bounds, { padding: 80 });\n\n$('#num-views').html('<\/i> 513');\n\n\n\n","nextSegment":-1}