Как использовать D3.js для заливки разных цветов определенной областью (регионом) в настраиваемом файле Geojson?

Question

Я хотел бы использовать настроенный файл geojson, чтобы заполнить различные цвета определенной областью, такой как кампус.Тем не менее, я использую «d.properties.campus», но он показывает сообщение об ошибке, в котором я не идентифицирую переменную «кампус».

Поэтому я не могу заполнить цвет успешно: (

Это первый способ, которым я пытаюсь использовать метод стиля для построения функции внутри, чтобы извлечь конкретное значение, которое является кампусом, и заполнить его различными цветами. => Этот способ показывает сообщение об ошибке, чтобы продемонстрировать, что я надеваюне могу определить «кампус», но я прочитал какое-то решение, чтобы увидеть, как разные случаи заполняют цвет, и в этом случае это работает (поэтому я понятия не имею, почему я не могу использовать один и тот же способ, чтобы получить тот же результат :(!!!)

  d3.json('au_map.json', function(err, geojson) { 
  projection.fitSize([width,height],geojson);
  svg.selectAll('path')
      .data(geojson.features)
      .enter()
      .append('path')
      .attr('d', path(geojson))
      .attr('stroke', '#8080ff')
      .style('opacity', '0.1') // draw the features
      .style('fill', function(d){
        if (d.features.properties.campus === 'ABC Campus'){
            return '#409ffb';
            }
        })});

Это второй способ, которым я пытаюсь использовать метод фильтра для фильтрации различных кампусов и заполнения цвета, но это не работает (Кстати, этот способ не показываетсообщение об ошибке)

  d3.json('au_map.json', function(err, geojson) { 
  projection.fitSize([width,height],geojson);
  svg.selectAll('path')
      .data(geojson.features)
      .enter()
      .append('path')
      .attr('d', path(geojson))
      .attr('stroke', '#8080ff')
      .style('opacity', '0.1') // draw the features
      .filter(function(d) { return d.campus;})
      .style('fill', function(d){
        if (d === 'ABC Campus'){
            return '#409ffb';
            }
        })});

Исходные данные извлекаются из файла geojson и выглядят так: (и этот файл содержит много разных кампусов, и я хотел бы заполнить различныеаренда цвета для каждого кампуса)

(""type": "FeatureCollection", "features": [{"type": "Feature","properties": {"stroke": "#8080ff","stroke-width": 2,"stroke-opacity": 1,"fill": "#0080c0",
"fill-opacity": 0.5,"campus": "ABC Campus"},"geometry": {"type": "Polygon", "coordinates": [
        [
            [
                144.971088845,
                -37.835130412
            ],
            [
                144.971691022,
                -37.8342620029999
            ],
            [
                144.971644667,
                -37.8339130749999
            ],
            [
                144.97171201,
                -37.833676738
            ],
            [
                144.971732559,
                -37.8335318269999
            ],
            [
                144.971765628,
                -37.833291623
            ],
            [
                144.971767088,
                -37.833097854
            ],
            [
                144.971754642,
                -37.8329717399999
            ],")

Это показывает, что «кампус» не идентифицирует, поэтому он не может заполнить определенный цвет в пределах конкретного кампуса