Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

cmaps

Package Overview
Dependencies
Maintainers
1
Versions
1
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

cmaps

Control options and customization of the Google Maps colors

  • 3.0.0
  • latest
  • Source
  • npm
  • Socket score

Version published
Maintainers
1
Created
Source

Custom Maps

Control options and customization of the Google Maps colors, just 1,7 KB.

Preview

Install

yarn add cMaps

After installing, include the scripts in html.

<script src="node_modules/cMaps/dist/cMaps.min.js"></script>

Wrapper map need be something like:

<div id="map"></div>

Starting map

var map = new cMaps(options);

Options

OptionTypeDescriptionExampleRequired
wrapperIdstringContainer id map'map'true
KeystringGoogle API Key'api_key'true
pinLatnumberpin latitude-23.562353true
pinLngnumberpin latitude-46.503113true
mapLatnumbermap latitude-23.562353true
mapLngnumbermap latitude-46.503113true
stylesarraygoogle styles[{},{}]true
namestringMap name'cMaps'false
iconstringurl to pin the way'imgs/pin.png'false
zoomnumberInitial zoom map16false
zoomControlbooleanManual zoom controltruefalse
scrollwheelbooleanMouse scroll for zoomfalsefalse
mapTypeControlbooleanChoose the map type in the upper left cornertruefalse
draggablebooleanIf this option is false the map can not be draggedtruefalse
streetViewbooleanControl street viewfalsefalse

Usage

// *Example* Code that was exported from Styled Maps Wizard or Snazzy Maps
var styles = [{"featureType":"all","elementType":"labels","stylers":[{"visibility":"on"}]} ...];

var map = new cMaps({
  'name': 'cMap',
  'wrapperId':'map',
  'pinLat': -23.562353,
  'pinLng': -46.503113,
  'mapLat': -23.562353,
  'mapLng': -46.503113
  'styles': styles,
  'key': 'YOUR_API_KEY'
});
Style

Use the Styled Maps Wizard or Snazzy Maps to export a JSON with all possible options and include as a parameter to the cMap.

Disclaimer

In the example folder has an demonstration of everything working if necessary :)

Keywords

FAQs

Package last updated on 28 Dec 2017

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc