angular - 想要根据美国 D3 地图中的经纬度标记

Question

我正在尝试使用地图标记 acc 制作美国地图。给 Lat Long。我从某处参考并构建了基本的美国地图。但现在不知道如何在地图上放置标记。

请耐心等待，因为我是 d3 的新手。

以下是代码：

import { Component, OnInit } from '@angular/core';

import * as d3 from 'd3-selection';
import * as d3Scale from 'd3-scale';
import * as d3Shape from 'd3-shape';
import * as D3 from 'd3';
import 'd3-transition';

import * as d3Array from 'd3-array';
import * as d3Axis from 'd3-axis';
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
  private margin = { top: 10, right: 10, bottom: 10, left: 10 };
  private svg: any;
  private g: any;

  width: any
  height: any
  ngOnInit() {
    var sampleData = {};    /* Sample random data. */    
    this.uStates("#statesvg", sampleData);
  }

  uStates(id: any, data: any, ) {
    let uStatePaths = [
      { id: "HI", n: "Hawaii", d: "M233.08751,519.30948L235.02744,515.75293L237.2907,515.42961L237.61402,516.23791L235.51242,519.30948L233.08751,519.30948ZM243.27217,515.59127L249.4153,518.17784L251.51689,517.85452L253.1335,513.97465L252.48686,510.57977L248.28366,510.09479L244.24213,511.87306L243.27217,515.59127ZM273.9878,525.61427L277.706,531.11074L280.13092,530.78742L281.26255,530.30244L282.7175,531.59573L286.43571,531.43407L287.40568,529.97912L284.49577,528.20085L282.55584,524.48263L280.45424,520.92609L274.63444,523.83599L273.9878,525.61427ZM294.19545,534.50564L295.48874,532.5657L300.17691,533.53566L300.82356,533.05068L306.96668,533.69732L306.64336,534.99062L304.05678,536.44556L299.69193,536.12224L294.19545,534.50564ZM299.53027,539.67879L301.47021,543.55866L304.54176,542.42703L304.86509,540.81041L303.24848,538.70882L299.53027,538.3855L299.53027,539.67879ZM306.4817,538.54716L308.74496,535.63726L313.43313,538.06218L317.79798,539.19381L322.16284,541.94205L322.16284,543.88198L318.6063,545.66026L313.75645,546.63022L311.33154,545.17527L306.4817,538.54716ZM323.13281,554.06663L324.74942,552.77335L328.14431,554.38997L335.74238,557.94651L339.13727,560.0481L340.75387,562.47302L342.69381,566.83787L346.73534,569.42445L346.41202,570.71775L342.53215,573.95097L338.32896,575.40592L336.87401,574.75928L333.80244,576.53754L331.37753,579.77077L329.11427,582.68067L327.33599,582.51901L323.77945,579.93243L323.45613,575.40592L324.10277,572.981L322.48616,567.32286L320.38456,565.54458L320.2229,562.958L322.48616,561.98804L324.58776,558.91648L325.07274,557.94651L323.45613,556.16823L323.13281,554.06663Z" },
      { id: "AK", n: "Alaska", d: "M158.07671,453.67502L157.75339,539.03215L159.36999,540.00211L162.44156,540.16377L163.8965,539.03215L166.48308,539.03215L166.64475,541.94205L173.59618,548.73182L174.08117,551.3184L177.47605,549.37846L178.1227,549.2168L178.44602,546.14524L179.90096,544.52863L181.0326,544.36697L182.97253,542.91201L186.04409,545.01361L186.69074,547.92352L188.63067,549.05514L189.7623,551.48006L193.64218,553.25833L197.03706,559.2398L199.78529,563.11966L202.04855,565.86791L203.50351,569.58611L208.515,571.36439L213.68817,573.46598L214.65813,577.83084L215.14311,580.9024L214.17315,584.29729L212.39487,586.56054L210.77826,585.75224L209.32331,582.68067L206.57507,581.22573L204.7968,580.09409L203.98849,580.9024L205.44344,583.65065L205.6051,587.36885L204.47347,587.85383L202.53354,585.9139L200.43195,584.62061L200.91693,586.23722L202.21021,588.0155L201.40191,588.8238C201.40191,588.8238,200.59361,588.50048,200.10863,587.85383C199.62363,587.20719,198.00703,584.45895,198.00703,584.45895L197.03706,582.19569C197.03706,582.19569,196.71374,583.48898,196.06709,583.16565C195.42044,582.84233,194.7738,581.71071,194.7738,581.71071L196.55207,579.77077L195.09712,578.31582L195.09712,573.30432L194.28882,573.30432L193.48052,576.6992L192.34888,577.1842L191.37892,573.46598L190.73227,569.74777L189.92396,569.26279L190.24729,574.92094L190.24729,576.05256L188.79233,574.75928L185.23579,568.77781L183.13419,568.29283L182.48755,564.57462L180.87094,561.66472L179.25432,560.53308L179.25432,558.26983L181.35592,556.97654L180.87094,556.65322L178.28436,557.29986L174.88947,554.87495L172.30289,551.96504L167.45306,549.37846L163.41152,546.79188L164.70482,543.55866L164.70482,541.94205L162.92654,543.55866L160.01664,544.69029L156.29843,543.55866L150.64028,541.13375L145.14381,541.13375L144.49717,541.61873L138.03072,537.73885L135.92912,537.41553L133.18088,531.59573L129.62433,531.91905L126.06778,533.374L126.55277,537.90052L127.68439,534.99062L128.65437,535.31394L127.19941,539.67879L130.43263,536.93055L131.07928,538.54716L127.19941,542.91201L125.90612,542.58869L125.42114,540.64875L124.12785,539.84045L122.83456,540.97208L120.08632,539.19381L117.01475,541.29541L115.23649,543.397L111.8416,545.4986L107.15342,545.33693L106.66844,543.23534L110.38664,542.58869L110.38664,541.29541L108.12338,540.64875L109.09336,538.22384L111.35661,534.34397L111.35661,532.5657L111.51827,531.75739L115.88313,529.49413L116.85309,530.78742L119.60134,530.78742L118.30805,528.20085L114.58983,527.87752L109.57834,530.62576L107.15342,534.02064L105.37515,536.60723L104.24352,538.87049L100.04033,540.32543L96.96876,542.91201L96.645439,544.52863L98.908696,545.4986L99.717009,547.60018L96.96876,550.83341L90.502321,555.03661L82.742574,559.2398L80.640977,560.37142L75.306159,561.50306L69.971333,563.76631L71.749608,565.0596L70.294654,566.51455L69.809672,567.64618L67.061434,566.67621L63.828214,566.83787L63.019902,569.10113L62.049939,569.10113L62.37326,566.67621L58.816709,567.96951L55.90681,568.93947L52.511924,567.64618L49.602023,569.58611L46.368799,569.58611L44.267202,570.87941L42.65059,571.68771L40.548995,571.36439L37.962415,570.23276L35.699158,570.87941L34.729191,571.84937L33.112578,570.71775L33.112578,568.77781L36.184142,567.48452L42.488929,568.13117L46.853782,566.51455L48.955378,564.41296L51.86528,563.76631L53.643553,562.958L56.391794,563.11966L58.008406,564.41296L58.978369,564.08964L61.241626,561.3414L64.313196,560.37142L67.708076,559.72478L69.00137,559.40146L69.648012,559.88644L70.456324,559.88644L71.749608,556.16823L75.791141,554.71329L77.731077,550.99508L79.994336,546.46856L81.610951,545.01361L81.934272,542.42703L80.317657,543.72032L76.922764,544.36697L76.276122,541.94205L74.982838,541.61873L74.012865,542.58869L73.851205,545.4986L72.39625,545.33693L70.941306,539.51713L69.648012,540.81041L68.516388,540.32543L68.193068,538.3855L64.151535,538.54716L62.049939,539.67879L59.463361,539.35547L60.918305,537.90052L61.403286,535.31394L60.756645,533.374L62.211599,532.40404L63.504883,532.24238L62.858241,530.4641L62.858241,526.09925L61.888278,525.12928L61.079966,526.58423L54.936843,526.58423L53.481892,525.29094L52.835247,521.41108L50.733651,517.85452L50.733651,516.88456L52.835247,516.07625L52.996908,513.97465L54.128536,512.84303L53.320231,512.35805L52.026941,512.84303L50.895313,510.09479L51.86528,505.08328L56.391794,501.85007L58.978369,500.23345L60.918305,496.51525L63.666554,495.22195L66.253132,496.35359L66.576453,498.77851L69.00137,498.45517L72.23459,496.03026L73.851205,496.67691L74.821167,497.32355L76.437782,497.32355L78.701041,496.03026L79.509354,491.6654C79.509354,491.6654,79.832675,488.75551,80.479317,488.27052C81.125959,487.78554,81.44928,487.30056,81.44928,487.30056L80.317657,485.36062L77.731077,486.16893L74.497847,486.97723L72.557911,486.49225L69.00137,484.71397L63.989875,484.55231L60.433324,480.83411L60.918305,476.95424L61.564957,474.52932L59.463361,472.75105L57.523423,469.03283L58.008406,468.22453L64.798177,467.73955L66.899773,467.73955L67.869736,468.70951L68.516388,468.70951L68.354728,467.0929L72.23459,466.44626L74.821167,466.76958L76.276122,467.90121L74.821167,470.00281L74.336186,471.45775L77.084435,473.07437L82.095932,474.85264L83.874208,473.88268L81.610951,469.51783L80.640977,466.2846L81.610951,465.47629L78.21606,463.53636L77.731077,462.40472L78.21606,460.78812L77.407756,456.90825L74.497847,452.22007L72.072929,448.01688L74.982838,446.07694L78.21606,446.07694L79.994336,446.72359L84.197528,446.56193L87.915733,443.00539L89.047366,439.93382L92.765578,437.5089L94.382182,438.47887L97.130421,437.83222L100.84863,435.73062L101.98027,435.56896L102.95023,436.37728L107.47674,436.21561L110.22498,433.14405L111.35661,433.14405L114.91316,435.56896L116.85309,437.67056L116.36811,438.80219L117.01475,439.93382L118.63137,438.31721L122.51124,438.64053L122.83456,442.35873L124.7745,443.81369L131.88759,444.46033L138.19238,448.66352L139.64732,447.69356L144.82049,450.28014L146.92208,449.6335L148.86202,448.82518L153.71185,450.76512L158.07671,453.67502ZM42.973913,482.61238L45.075509,487.9472L44.913847,488.91717L42.003945,488.59384L40.225672,484.55231L38.447399,483.09737L36.02248,483.09737L35.86082,480.51078L37.639093,478.08586L38.770722,480.51078L40.225672,481.96573L42.973913,482.61238ZM40.387333,516.07625L44.105542,516.88456L47.823749,517.85452L48.632056,518.8245L47.015444,522.5427L43.94388,522.38104L40.548995,518.8245L40.387333,516.07625ZM19.694697,502.01173L20.826327,504.5983L21.957955,506.21492L20.826327,507.02322L18.72473,503.95166L18.72473,502.01173L19.694697,502.01173ZM5.9534943,575.0826L9.3483796,572.81934L12.743265,571.84937L15.329845,572.17269L15.814828,573.7893L17.754763,574.27429L19.694697,572.33436L19.371375,570.71775L22.119616,570.0711L25.029518,572.65768L23.897889,574.43595L19.533037,575.56758L16.784795,575.0826L13.066588,573.95097L8.7017347,575.40592L7.0851227,575.72924L5.9534943,575.0826ZM54.936843,570.55609L56.553455,572.49602L58.655048,570.87941L57.2001,569.58611L54.936843,570.55609ZM57.846745,573.62764L58.978369,571.36439L61.079966,571.68771L60.271663,573.62764L57.846745,573.62764ZM81.44928,571.68771L82.904234,573.46598L83.874208,572.33436L83.065895,570.39442L81.44928,571.68771ZM90.17899,559.2398L91.310623,565.0596L94.220522,565.86791L99.232017,562.958L103.59687,560.37142L101.98027,557.94651L102.46525,555.52159L100.36365,556.81488L97.453752,556.00657L99.070357,554.87495L101.01029,555.68325L104.89016,553.90497L105.37515,552.45003L102.95023,551.64172L103.75853,549.70178L101.01029,551.64172L96.322118,555.19827L91.472284,558.10817L90.17899,559.2398ZM132.53423,539.35547L134.95915,537.90052L133.98918,536.12224L132.21091,537.09221L132.53423,539.35547Z" },
      { id: "FL", n: "Florida", d: "M759.8167,439.1428L762.08236,446.4614L765.81206,456.20366L771.14685,465.57996L774.86504,471.88472L779.71486,477.38118L783.75637,481.09937L785.37297,484.00926L784.24135,485.30254L783.43305,486.59582L786.34293,494.03221L789.25282,496.94209L791.83939,502.27689L795.39592,508.09667L799.92241,516.34135L801.2157,523.93939L801.70068,535.90227L802.34732,537.68053L802.024,541.0754L799.59909,542.36869L799.92241,544.30861L799.27577,546.24854L799.59909,548.67344L800.08407,550.61337L797.33585,553.84658L794.2643,555.30152L790.38445,555.46318L788.9295,557.07979L786.5046,558.04975L785.21131,557.56477L784.07969,556.59481L783.75637,553.68492L782.94806,550.29005L779.55319,545.11691L775.99666,542.85367L772.11681,542.53035L771.30851,543.82363L768.23696,539.4588L767.59032,535.90227L765.00375,531.86076L763.22549,530.72913L761.60888,532.83072L759.83062,532.5074L757.72903,527.49592L754.81914,523.61607L751.90925,518.28128L749.32269,515.20973L745.76616,511.49154L747.86774,509.06663L751.10095,503.57017L750.93929,501.95357L746.4128,500.98361L744.79619,501.63025L745.11952,502.27689L747.70608,503.24685L746.25114,507.77335L745.44284,508.25833L743.66457,504.21682L742.37129,499.367L742.04797,496.61877L743.50291,491.93062L743.50291,482.39265L740.43136,478.67446L739.13808,475.60291L733.96494,474.30963L732.02502,473.66299L730.40841,471.07642L727.01354,469.45981L725.88192,466.06494L723.13369,465.09498L720.70878,461.37679L716.50561,459.92185L713.59572,458.4669L711.00916,458.4669L706.96764,459.27521L706.80598,461.21513L707.61429,462.18509L707.1293,463.31672L704.05776,463.15506L700.33957,466.71159L696.78303,468.65151L692.90318,468.65151L689.66997,469.9448L689.34665,467.19657L687.73005,465.25664L684.82016,464.12502L683.20356,462.67007L675.12053,458.79022L667.52249,457.01196L663.15766,457.6586L657.17622,458.14358L651.19478,460.24517L647.71554,460.85813L647.47762,452.80838L644.89105,450.86846L643.11278,449.09019L643.4361,446.01863L653.62072,444.72535L679.16312,441.81546L685.95287,441.16882L691.38887,441.44909L693.97544,445.32895L695.43038,446.78389L703.52854,447.29911L714.34829,446.65247L735.86068,445.35918L741.3064,444.68481L746.41398,444.88932L746.84081,447.79921L749.07381,448.60751L749.30875,443.97751L747.78053,439.80456L749.08893,438.36473L754.64356,438.81948L759.8167,439.1428ZM772.36211,571.54788L774.78703,570.90124L776.08031,570.65875L777.53527,568.31466L779.87935,566.69805L781.17264,567.18304L782.87008,567.50636L783.27423,568.55715L779.79853,569.76961L775.59533,571.22456L773.25125,572.43702L772.36211,571.54788ZM785.86081,566.53639L787.07327,567.58719L789.82151,565.4856L795.15632,561.28241L798.87452,557.40254L801.38027,550.77444L802.35024,549.077L802.5119,545.68212L801.78442,546.1671L800.81446,548.99617L799.3595,553.6035L796.12628,558.8575L791.76144,563.06068L788.36656,565.00061L785.86081,566.53639Z" },
      { id: "NH", n: "New Hampshire", d: "M880.79902,142.42476L881.66802,141.34826L882.75824,138.05724L880.21516,137.14377L879.73017,134.07221L875.85032,132.94059L875.527,130.19235L868.25225,106.75153L863.65083,92.208542L862.75375,92.203482L862.10711,93.820087L861.46047,93.335106L860.4905,92.365143L859.03556,94.305068L858.98709,99.337122L859.29874,105.00434L861.23866,107.75258L861.23866,111.7941L857.52046,116.85688L854.93389,117.98852L854.93389,119.12014L856.06552,120.89841L856.06552,129.46643L855.25721,138.6811L855.09555,143.53092L856.06552,144.82422L855.90386,149.35071L855.41887,151.12899L856.38768,151.83821L873.17535,147.41366L875.35022,146.81121L877.19379,144.03788L880.79902,142.42476Z" },
      { id: "MI", n: "Michigan", d: "M581.61931,82.059006L583.4483,80.001402L585.62022,79.201221L590.99286,75.314624L593.27908,74.743065L593.73634,75.200319L588.59232,80.344339L585.27728,82.287628L583.21967,83.202124L581.61931,82.059006ZM667.79369,114.18719L668.44033,116.69293L671.67355,116.85459L672.96684,115.64213C672.96684,115.64213,672.88601,114.18719,672.56269,114.02552C672.23936,113.86386,670.94608,112.16642,670.94608,112.16642L668.76366,112.40891L667.14704,112.57057L666.82372,113.7022L667.79369,114.18719ZM567.49209,111.21318L568.20837,110.63278L570.9566,109.82447L574.51313,107.56123L574.51313,106.59126L575.15978,105.94462L581.14121,104.97466L583.56612,103.03473L587.93095,100.93315L588.09261,99.639864L590.03254,96.729975L591.8108,95.921673L593.10409,94.143408L595.36733,91.880161L599.73217,89.455254L604.42032,88.970273L605.55194,90.101896L605.22862,91.071859L601.51043,92.041822L600.05549,95.113371L597.79224,95.921673L597.30726,98.34658L594.88235,101.57979L594.55903,104.16636L595.36733,104.65134L596.3373,103.51972L599.89383,100.60983L601.18711,101.90311L603.45036,101.90311L606.68357,102.87307L608.13851,104.0047L609.59345,107.07625L612.34168,109.82447L616.22153,109.66281L617.67648,108.69285L619.29308,109.98613L620.90969,110.47112L622.20297,109.66281L623.33459,109.66281L624.9512,108.69285L628.99271,105.13632L632.38758,104.0047L639.01566,103.68138L643.54215,101.74145L646.12872,100.44817L647.58367,100.60983L647.58367,106.26794L648.06865,106.59126L650.97853,107.39957L652.91846,106.91458L659.06156,105.29798L660.19318,104.16636L661.64813,104.65134L661.64813,111.60274L664.88134,114.67429L666.17462,115.32093L667.4679,116.29089L666.17462,116.61421L665.36632,116.29089L661.64813,115.80591L659.54654,116.45255L657.28329,116.29089L654.05008,117.74584L652.27182,117.74584L646.45204,116.45255L641.27891,116.61421L639.33898,119.20078L632.38758,119.84742L629.96267,120.65572L628.83105,123.72727L627.53777,124.8589L627.05279,124.69724L625.59784,123.08063L621.07135,125.50554L620.42471,125.50554L619.29308,123.88893L618.48478,124.05059L616.54486,128.41543L615.57489,132.45694L612.39377,139.45774L611.21701,138.42347L609.84527,137.39215L607.90449,127.10413L604.36001,125.73408L602.30743,123.44785L590.18707,120.70437L587.3318,119.67473L579.10138,117.50199L571.21139,116.35887L567.49209,111.21318ZM697.8,177.2L694.6,168.9L692.3,159.9L689.9,156.7L687.3,154.9L685.7,156L681.8,157.8L679.9,162.8L677.1,166.5L676,167.2L674.5,166.5C674.5,166.5,671.9,165.1,672.1,164.4C672.3,163.8,672.6,159.4,672.6,159.4L676,158.1L676.8,154.7L677.4,152.1L679.9,150.5L679.5,140.5L677.9,138.2L676.6,137.4L675.8,135.3L676.6,134.5L678.2,134.8L678.4,133.2L676,131L674.7,128.4L672.1,128.4L667.6,126.9L662.1,123.5L659.3,123.5L658.7,124.2L657.7,123.7L654.6,121.4L651.7,123.2L648.8,125.5L649.2,129L650.1,129.3L652.2,129.8L652.7,130.6L650.1,131.4L647.5,131.8L646.1,133.5L645.8,135.6L646.1,137.3L646.4,142.8L642.8,144.9L642.2,144.7L642.2,140.5L643.5,138.1L644.1,135.6L643.3,134.8L641.4,135.6L640.4,139.8L637.7,141L635.9,142.9L635.7,143.9L636.4,144.7L635.7,147.3L633.5,147.8L633.5,148.9L634.3,151.3L633.1,157.5L631.5,161.5L632.2,166.2L632.7,167.3L631.9,169.8L631.5,170.6L631.2,173.3L634.8,179.3L637.7,185.8L639.1,190.6L638.3,195.3L637.3,201.3L634.9,206.4L634.6,209.2L631.3,212.3L635.8,212.1L657.2,209.9L664.4,208.9L664.5,210.5L671.4,209.3L681.7,207.8L685.5,207.4L685.7,206.8L685.8,205.3L687.9,201.6L689.9,199.9L689.7,194.8L691.3,193.2L692.4,192.9L692.6,189.3L694.2,186.3L695.2,186.9L695.4,187.5L696.2,187.7L698.1,186.7L697.8,177.2Z" },
      { id: "VT", n: "Vermont", d: "M844.48416,154.05791L844.80086,148.71228L841.91015,137.92811L841.26351,137.60479L838.35361,136.3115L839.16191,133.40161L838.35361,131.30002L835.65356,126.66004L836.62353,122.78018L835.81522,117.60703L833.39031,111.14059L832.58474,106.21808L859.0041,99.48626L859.3128,105.00847L861.22906,107.7507L861.22906,111.79222L857.52191,116.85021L854.93534,117.99288L854.92429,119.11345L856.23426,120.63257L855.92333,128.73054L855.3139,137.9894L855.08595,143.54634L856.05591,144.83963L855.89425,149.41032L855.40927,151.10021L856.42345,151.82737L848.9859,153.33408L844.48416,154.05791Z" },
      { id: "ME", n: "Maine", d: "M922.83976,78.830719L924.77969,80.932305L927.04294,84.650496L927.04294,86.590422L924.94135,91.278575L923.00142,91.925217L919.60655,94.996766L914.75674,100.49322C914.75674,100.49322,914.1101,100.49322,913.46346,100.49322C912.81682,100.49322,912.49349,98.391636,912.49349,98.391636L910.71523,98.553296L909.74527,100.00824L907.32036,101.46319L906.3504,102.91813L907.967,104.37307L907.48202,105.01972L906.99704,107.76794L905.05711,107.60628L905.05711,105.98968L904.73379,104.69639L903.27885,105.01972L901.50058,101.78651L899.399,103.07979L900.69228,104.53473L901.0156,105.66636L900.2073,106.95964L900.53062,110.03119L900.69228,111.64779L899.07568,114.23436L896.16579,114.71934L895.84247,117.62923L890.50767,120.70078L889.21439,121.18576L887.59778,119.73082L884.52623,123.28735L885.4962,126.52056L884.04125,127.81384L883.87959,132.17867L882.75631,138.43803L880.29406,137.28208L879.80907,134.21052L875.92922,133.07889L875.6059,130.33065L868.33115,106.88983L863.63257,92.250088L865.05311,92.131923L866.5669,92.541822L866.5669,89.955254L867.8752,85.458798L870.46177,80.770645L871.91672,76.729133L869.97679,74.304226L869.97679,68.322789L870.78509,67.352826L871.5934,64.604598L871.43174,63.149654L871.27007,58.29984L873.04834,53.450026L875.95823,44.5587L878.05981,40.355528L879.3531,40.355528L880.64638,40.517188L880.64638,41.648811L881.93967,43.912058L884.68789,44.5587L885.4962,43.750397L885.4962,42.780435L889.53771,39.870546L891.31597,38.092281L892.77092,38.253942L898.75235,40.678849L900.69228,41.648811L909.74527,71.555998L915.7267,71.555998L916.53501,73.495924L916.69667,78.345738L919.60655,80.608984L920.41486,80.608984L920.57652,80.124003L920.09154,78.99238L922.83976,78.830719ZM901.90801,108.97825L903.44379,107.44247L904.81791,108.49327L905.38372,110.91819L903.68628,111.80732L901.90801,108.97825ZM908.61694,103.07763L910.39521,104.93673C910.39521,104.93673,911.6885,105.01755,911.6885,104.69423C911.6885,104.37091,911.93099,102.67347,911.93099,102.67347L912.82013,101.86517L912.01182,100.08689L909.99106,100.81437L908.61694,103.07763Z" },
      { id: "RI", n: "Rhode Island", d: "M874.07001,178.89536L870.37422,163.93937L876.6435,162.09423L878.83463,164.02135L882.14112,168.342L884.82902,172.74409L881.82968,174.36888L880.5364,174.20722L879.40478,175.98549L876.97987,177.92541L874.07001,178.89536Z" },
       ...
       ...
    ];


    d3.select('#statesvg').selectAll("svg > *").remove();
    this.svg = d3.select('#statesvg');

    this.width = document.getElementById("statesvg").parentElement.offsetWidth - this.margin.left - this.margin.right;
    this.height = document.getElementById("statesvg").parentElement.offsetHeight - 30

    d3.select('#statesvg')
      .attr("viewBox", "0 0 960 600")
    this.g = this.svg.append("g")
      .attr("transform", "translate(" + this.margin.left + "," + this.margin.top + ")")

    var trans = this.g.selectAll(".state ")
      .data(uStatePaths).enter()
      .append("path")
      .attr("class", "state")
      .attr("d", (d) => { return d.d; })
      .style("stroke", "#ffffff")
      .style("stroke-width", "1px")
      .style("fill","#cccccc")

下面是我用于标记的一个，但它没有显示任何内容。它还给出错误：“ERROR TypeError: d3.geoAlbersUsa is not a function”

    var projection: d3.GeoProjection = d3.geoAlbersUsa();
    var marks = [{long: -75, lat: 43},{long: -78, lat: 41},{long: -70, lat: 53}];
    this.g.selectAll(".mark")
    .data(marks)
    .enter()
    .append("image")
    .attr('class','mark')
    .attr('width', 20)
    .attr('height', 20)
    .attr("xlink:href",'assets/marker.png')
    .attr("transform", d => `translate(${projection([d.long,d.lat])}`);
  }

}

谢谢。

标签： angulartypescriptd3.js