Add Stroked Point Markers to a Google Line Chart

I was pretty easily able to add point markers to a google line chart, but it took a little more digging to be able to add a line stroke to those points.  I wanted something like the following (which is the result of the code used below):

It came down to making sure to use the arrayToDataTable functionlity to insert the data instead of the data.addRows functionality.  This allows you to insert more parameters for each point, allowing you to specify storke colors, sizing, fill colors, and point size for each point:

  google.load(\'visualization\', \'1.0\', {\'packages\':[\'corechart\']});
  google.setOnLoadCallback(drawChart);

  function drawChart() {

    //Create the data table:
      var data = new google.visualization.DataTable();
      data.addColumn(\'string\', \'Topping\');
      data.addColumn(\'number\', \'Slices\');
				
    //Add the data:	
      var data = google.visualization.arrayToDataTable
        ([[\'X\', \'Y\', {\'type\': \'string\', \'role\': \'style\'}],
          [1, 3, \'point { size: 5; fill-color: white; stroke-color: #639426; stroke-width: 2}\'],
          [2, 2.5, \'point { size: 5; fill-color: white; stroke-color: #639426; stroke-width: 2}\'],
          [3, 3, \'point { size: 5; fill-color: white; stroke-color: #639426; stroke-width: 2}\'],
          [4, 4, \'point { size: 5; fill-color: white; stroke-color: #639426; stroke-width: 2}\'],
          [5, 5, \'point { size: 5; fill-color: white; stroke-color: #639426; stroke-width: 2}\'],
          [6, 3, \'point { size: 5; fill-color: white; stroke-color: #639426; stroke-width: 2}\'],
          [7, 2.5, \'point { size: 5; fill-color: white; stroke-color: #639426; stroke-width: 2}\'],
          [8, 3, \'point { size: 5; fill-color: white; stroke-color: #639426; stroke-width: 2}\']
       ]);

    //Set chart options:
       var options = {
         width:1000,
         height:500,
         backgroundColor: \'white\',
         chartArea: {backgroundColor: \'white\'},
         colors: [\'#639426\'],
         pointSize: 5
       };

    //Draw chart:
        var chart = new google.visualization.AreaChart(document.getElementById(\'chart_div\'));
        chart.draw(data, options);
  }	

I couldn\’t find a way to \’globally\’ apply those values so they don\’t have to be added with each piece of point data, but since I\’m generally looping through something to generate the data points, it\’s not too big of a deal.