bs-simple-maps

bs-react-simple-maps

BuckleScript bindings for react-simple-maps

Installation

npm install --save bs-simple-maps

In your bsconfig.json, include "bs-simple-maps" in the bs-dependencies.

Examples

<ComposableMap
  projectionConfig=(ComposableMap.projectionConfig(~scale=200, ()))
  width=1000
  height=600>
  <ZoomableGroup center=(0., 0.)>
    <Geographies geography="/examples/world-50m.json">
      (
        (geographies, projection) =>
          Array.map(
            geography =>
              <Geography
                key=(Geography.id(geography))
                geography
                projection
                style=(
                  Types.style(
                    ~default=ReactDOMRe.Style.make(~fill="#ECEFF1", ()),
                    (),
                  )
                )
              />,
            geographies,
          )
      )
    </Geographies>
  </ZoomableGroup>
</ComposableMap>

To run other examples:

npm run start
# and in a separate tab 
npm run examples
# then open localhost:3000 

• Basic map
• Simple markers

Usage

The API follows react-simple-maps rather closely, with a few exceptions:

• Marker takes a prop coordinates instead of a nested {marker: {coordinates}} object.
• Line takes props start and stop instead of a nested {line: {coordinates: {start, end}}} object.

Limitations

• Geographies only supports a string for its geographies (i.e. a JSON file path).
• Geography and Marker don't support any events yet.
• ZoomableGlobe is not supported yet.

Development

npm run start

Tests

There will be some tests using bs-jest.

npm run test

For now, we just test by looking at the examples.

Thanks

These bindings started as a joint effort of Ali, Jan, Patrick, and Timo at the Reason-Dojo organized by Ben and Sean.

Right now, there are similar (yet less complete) bindings published as bs-react-simple-maps maintained at DeFuex's repo. We will try to unify these in the future.