How do I change the default icon created by KML Reader on a Here API map? Or substitute an image?

I'm using a KML file to load placemarks on a map, so I do not edit the individual markers. Therefore, I'd like to change the default color and size of the icon, which defaults to a really large blue bubble. I've tried editing the ICON entries in the CSS file but have had no success.

Here's how I'm loading the markers using H.data.kml.Reader

var defaultLayers = platform.createDefaultLayers();
var map = new H.Map(...);
var behavior = new H.mapevents.Behavior(new H.mapevents.MapEvents(map));
var ui = H.ui.UI.createDefault(map, defaultLayers);
var reader = new H.data.kml.Reader('/temp/pure-gas.kml');
reader.parse();
layer = reader.getLayer();
map.addLayer(layer);

Solution

Default Icon's bitmap can't be changed. You should create one custom Icon and use it for all markers. In order to change KML parsed objects, instead of adding layer to the map you can get array of all parsed objects using getParsedObjects() method, update and then add them to the map:

var svg = '<svg xmlns="http://www.w3.org/2000/svg" width="28px" height="36px">' +
    '<path d="M 13 0 C 9.5 0 6.3 1.3 3.8 3.8 C 1.4 7.8 0 9.4 0 12.8 C 0 16.3 1.4 19.5 3.8 21.9 L 13 31 L 22.2' +
    ' 21.9 C 24.6 19.5 25.9 16.3 25.9 12.8 C 25.9 9.4 24.6 6.1 22.1 3.8 C 19.7 1.3 16.5 0 13 0 Z" fill="#AAF"/>' +
    '<path d="M 13 2.2 C 6 2.2 2.3 7.2 2.1 12.8 C 2.1 16.1 3.1 18.4 5.2 20.5 L 13 28.2 L 20.8 20.5 C' +
    ' 22.9 18.4 23.8 16.2 23.8 12.8 C 23.6 7.07 20 2.2 13 2.2 Z" fill="#B32"/>' +
    '</svg>',
  customIcon = new H.map.Icon(svg, {
    size: {w: 13, h: 18}
  }),
  group = new H.map.Group(),
  reader = new H.data.kml.Reader('YOUR_KML_FILE');

reader.addEventListener('statechange', function (evt) {
  if (evt.state == H.data.AbstractReader.State.ERROR) {
    console.log('Error in KML reader', evt);
  }
  else if (evt.state == H.data.AbstractReader.State.READY) {
    reader.getParsedObjects().forEach(function(obj) {
      // assume all parsed objects are Point Geometries
      obj.setIcon(customIcon);
    });
    group.addObjects(reader.getParsedObjects());
    map.addObject(group);
  }
});

reader.parse();

See KML reader description and Icon description for more details