$ не определено для карты d3 в угловом компоненте

Question

• Я пытаюсь выучить карты d3.
• поэтому я взял приведенный ниже пример и включил его в свой стек-блиц.
• но сейчас я сталкиваюсь с ошибкой из-за jquery
• Я реализую один за другим, чтобы я выучил
• Подскажите, как это исправить.
• со стеком и кодом ниже

https://medium.com/@andybarefoot/making-a-map-using-d3-js-8aa3637304ee

https://stackblitz.com/edit/angular-d3-v4-barchart-5pkcdj?file=app/shared/barchart/barchart.component.ts

let svg = d3
      .select("#map-holder")
      .append("svg")
      // set to the same size as the "map-holder" div
      .attr("width", $("#map-holder").width())
      .attr("height", $("#map-holder").height())
      // add zoom functionality
      //.call(zoom)
      ;

VM17251:37 ERROR ReferenceError: $ is not defined
    at BarchartComponent.createChart (barchart.component.ts:82)
    at BarchartComponent.ngOnInit (barchart.component.ts:49)
    at checkAndUpdateDirectiveInline (provider.js:252)
    at checkAndUpdateNodeInline (view.js:472)
    at checkAndUpdateNode (view.js:415)
    at debugCheckAndUpdateNode (services.js:504)
    at debugCheckDirectivesFn (services.js:445)
    at Object.eval [as updateDirectives] (HomeComponent.html:2)
    at Object.debugUpdateDirectives [as updateDirectives] (services.js:425)
    at checkAndUpdateView (view.js:382)