html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function() {

​

  // This sample uses 3rd party proj4 component

  // that makes it possible to set coordinates

  // for the points and labels on the map and

  // required for custom projections and grid labels formatting.

  // See https://docs.anychart.com/7.14.3/Maps/Map_Projections

  var dataSet = anychart.data.set([

    {'id': 'AU.WA', 'value': 300},  // Western Australia

    {'id': 'AU.JB', 'value': 270},  // Jervis Bay Territory

    {'id': 'AU.NS', 'value': 240},  // New South Wales

    {'id': 'AU.VI', 'value': 75},   // Victoria

    {'id': 'AU.NT', 'value': 130},  // Northern Territory

    {'id': 'AU.TS', 'value': 190},  // Tasmania

    {'id': 'AU.CT', 'value': 100, labels: false}, // Australian Capital Territory

    {'id': 'AU.SA', 'value': 280},  // South Australia

    {'id': 'AU.QL', 'value': 220}   // Queensland

  ]);

​

  //

  var map = anychart.map();

  map.geoData(anychart.maps.australia);

​

  // set the background color

  map.background('none');

  // set the title and its preferences

  map.title().useHtml(true).hAlign('center');

  map.title('<span style="font-size: 18px;">Linear Color Scale with a colorRange</span>');

​

  // set the series

  var series = map.choropleth(dataSet);

    // disable the labels

  series.labels(false);

  series.geoIdField('code_hasc');

  series.stroke('#000 .3');

  series.colorScale(anychart.scales.linearColor('#EC6E07', '#64B5F6'));

​

    // create and enable the colorRange

  var colorRange = map.colorRange();

  colorRange.enabled(true);

  // set the container

  map.container('container');

  map.draw();

});