简体   繁体   中英

React JVectorMap marker

The problem refers to marker appearing - Im using React

https://i.stack.imgur.com/hkqnZ.jpg

My markers shows up in right places I have no doubts, but there is some initial marker on 0,0 which is not disappearing and I have no idea how to remove it. It disappears only when I remove 'markers' property from VectorMap component but as you know none of markers would appear after then.

Moreover I've tried fill markers 'transparently' etc, but it also affect to correct markers.

Is there some setup to delete this bugged one? Have I done anything wrong or is it just the library bug?

 <VectorMap
            map={"world_mill"}
            markers={{
              latLng: [this.state.CountryFetchLat, this.state.CountryFetchLon],
              name: this.state.CountryRegion
            }}
            backgroundColor="transparent"
            zoomOnScroll={true}
            zoomButtons={false}
            containerStyle={{
              width: "100%",
              height: "90%"
            }}
            containerClassName="map"
            markerStyle={{
              initial: {
                fill: "#4DAC26"
              }
            }}
            regionStyle={{
              initial: {
                fill: "#cccccc",
                "fill-opacity": 1,
                stroke: "none",
                "stroke-width": 0,
                "stroke-opacity": 0
              },
              hover: {
                "fill-opacity": 1,
                fill: "#99ff99",
                cursor: "pointer"
              },
              selected: {
                fill: "#ff0000"
              }
            }}
            selectedRegions={
              this.state.CountryRegion
                ? this.state.CountryRegion.toUpperCase()
                : null
            }
          />

Try arranging the markers in this format:

markers={{
          US: { latLng: [38.9, -98.45], name: 'Name of City' }
        }}

That will make the "phantom" marker go away.

Hope this helps.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM