100 thousand. Or more markers on Google maps without clustering.

I have data that is being collected, although a GPS device is installed in the car. So the data that I have is mainly on the street / road. Each coordinate has a certain meaning. The data format is something like this.

lat         | long        | value
---------------------------------
12.979155   | 77.644925   | 6 
---------------------------------
12.97916833 | 77.64493667 | 2
---------------------------------
12.97917167 | 77.64492167 | 8 

My task is to draw these long-longs on a google map. This seems to be a fairly simple task when we talk about placing markers 10, 100 or 1000. But, as I mentioned above, we collect data using the drive, and the distance between two lat-long or two points will be in several places (say , 2-3 feet).

So, at the end of the survey I will have 90-100 thousand lats for a small part of the city and can reach up to a million for the whole city.

I tried adding a 9-10k token and its nice woking, but when I try to download 40k, 50k, 60k, it makes my browser very slow, and this is the error message I'm ending up with.

Uncaught RangeError: Maximum call stack size exceeded      main.js:1

I talked a lot about this, but I could not find any example or tutorial that would force me to place 1 million markers using technologies that I know a little (this is asp.net). I found this example http://www.scribblemaps.com/markerComplex/ Jonathan Wagner, but I can not understand and implement it in my existing code, which looks like this.

// To get lat-long from the MSSQL server.

function PushValues(ParameterID) {
         a = ParameterID.slice(5);
    var CityID = $('#ddlCity').val().split('|');
    $.ajax({
        type: "POST",
        url: "index.aspx/PushLatLong",
        data: "{CityID:'" + CityID[0] + "',OperatorID:'" + $('#ddlOperator').val() + "',ParameterID:'" + ParameterID.slice(4) + "'}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        async: false,
        cache: false,
        success: function (response) {
            GooglePlaces = response.d.split('#');
            if (GooglePlaces != "Blank") {
                HasValues = 1;
            } else {
                HasValues = 0;
            }

        },
        Error: function (r) {

        }
    });
}

// Sets the values ​​in the google map.

function PlaceValues() {
    var options = { zoom: 3, center: new google.maps.LatLng(37.09, -95.71), mapTypeId: google.maps.MapTypeId.ROADMAP };
    var map = new google.maps.Map(document.getElementById('map'), options);
    var bounds = new google.maps.LatLngBounds();
    for (var i = 0; i < GooglePlaces.length; i = i + 2) {
        ltlg = new google.maps.LatLng(GooglePlaces[i], GooglePlaces[i + 1]);
        var marker = new google.maps.Marker({
            position: ltlg,
            map: map,
            title: 'Place number',
            icon: "img/GoogleIcons/" + legendfirstvalue[1]
        });
        bounds.extend(ltlg);
    }
    map.fitBounds(bounds)
    $('#DivLoadImage').hide();
}

, , , lat-long. . clustring , , , . clustring.

, . , . - .

+5
2

( ) - , , , - , api .

Fusion .

API Google , Google Fusion FusionTablesLayer.

fusiontables - , , , " ", , . google docs (fusiontables) . Fusiontables api .

- , , , . ( - ?)

, :

100 000 .

.

.

+1

Fusion - . GmapGIS.

0

All Articles