javascript - Colour-coding points on Google Maps -

i'm developing application page of college project display information house price costs , looking implement colour-coded map different years. idea there dot each house sold located on map (google maps example), , colour-coded green red depending on how expensive was.

i'm looking way implement using google maps api, have been unable find solution doesn't slow application loading in ~30k datapoints each year , application had 5 years worth of data.

would have suggestions on use. i've looked @ google's geocharts , don't offer looking for. i've looked @ heatmaps, , though colouring effect i'm looking for, points weighted colour dependent on proximity rather specified variable, price.

30k points * 5 years = 150k markers. might much. should looking way show 1 year of history @ time and/or use marker clustering.

regarding color markers, use svg markers that. can change color of svg path. little bit of calculation, should able process points , define color in draw markers.

example round svg marker:

var icon = {     path: "m-20,0a20,20 0 1,0 40,0a20,20 0 1,0 -40,0",     fillcolor: // marker color,     fillopacity: .8,     anchor: new google.maps.point(0, 0),     strokeweight: 0 }  var marker = new google.maps.marker({     position: // marker position,     map: map,     draggable: false,     icon: icon,     title: 'some title' }); 

here quick example:

jsfiddle demo