I am binding to a custom data source which I am converting to Json in MVC. Based on the value of "RealizedRatePerHour", I want to adjust the size of the marker shown on the map. I can't find anything showing how this can be done

@model IEnumerable<OpsOverallGeoMapViewModel>

<style>
#tooltipTable {
font-family: Verdana, Arial, Helvetica, sans-serif;
width: 100%;
border-collapse: collapse;
}

#tooltipTable td, #tooltipTable th {
font-size: 9px;
border: 1px solid #28b51c;
padding: 3px 7px 2px 7px;
}

#tooltipTable th {
font-weight: bold;
font-size: 11px;
text-align: left;
padding-top: 5px;
padding-bottom: 4px;
background-color: #28b51c;
color: #ffffff;
}
</style>
<script id="tooltipTemplate" type="text/x-jquery-tmpl">
<table id="tooltipTable">
<tr><th class="tooltipHeading" colspan="2">${item.Country}</th></tr>
<tr>
<td>Total Hours:</td>
<td>${item.Hours}</td>
</tr>
<tr>
<td>Total Billing:</td>
<td>${item.Billing}</td>
</tr>
<tr>
<td>Realized Rate Per Hour:</td>
<td>${item.RealizedRatePerHour}</td>
</tr>
</table>
</script>

<div id="map"></div>

<script>

$(function () {

var model = @Html.Raw(Json.Encode(Model));

$("#map").igMap({
width: "700px",
height: "500px",
windowRect: { left: 0.225, top: 0.1, height: 0.6, width: 0.6 },
series: [{
type: "geographicSymbol",
name: "worldCities",
dataSource: model, //JSON Array defined above
latitudeMemberPath: "Latitude",
longitudeMemberPath: "Longitude",
markerType: "automatic",
markerOutline: "#28b51c",
markerBrush: "#28b51c",
showTooltip: true,
tooltipTemplate: "tooltipTemplate"

}],

});
});
</script>

<div id="map"></div>