Refactor vectorTileLayerStyles into Symbolizers

When I first made this, I really gave a lot of thought to the vectorTileLayerStyles option. It was just the fastest idea at that time.

With some of the more complex vector tile sources, the styling can get out of hand.

And not to speak of the confusion between data layers and leaflet layers.

So I'm thinking of changing the paradigms (or at least, the names), by adopting the good old "Symbolizer" nomenclature from Mapnik.

So instead of stuff like...

var vectorGrid = L.vectorGrid.protobuf(url, {
   vectorTileLayerStyles: {
      water: {[
         fill: 'blue'
      ]},
      roads: function(props, zoom) { if (zoom > 10) return {color: 'black'}; else return null; }
   }
}).addTo(map);

I'd have something like...

var vectorGrid = L.vectorGrid.protobuf(url);
vectorGrid.addSymbolizer('water', 'fill', {fill: 'blue'});
vectorGrid.addSymbolizer('roads', 'line', function(props, zoom) {...} );
vectorGrid.addTo(map)

The problem with the current approach is that the vectorTileLayerStyles easily gets 3 or 4 nested levels of brackets and braces, and then you have to put that in an options object.

It should be easy to keep a symbolizers option, and vectorTileLayerStyles as a legacy alias for it; let users use addSymbolizer only for the more complex styles.

@perliedman @jkuebart Opinions?

Start by reviewing the current vectorTileLayerStyles option and the proposed symbolizers option and addSymbolizer entry points described in the issue. Compare the existing nested style forms with the proposed Symbolizer naming, then clarify the compatibility and API decisions before implementation; done means the new approach and legacy alias have an agreed, testable scope.