Giter Site home page Giter Site logo

vikasrana1989 / google-maps-markup Goto Github PK

View Code? Open in Web Editor NEW

This project forked from knownasilya/google-maps-markup

0.0 2.0 0.0 2.23 MB

Ember markup component for Google Maps - Draw and Measure

Home Page: http://knownasilya.github.io/google-maps-markup

License: MIT License

JavaScript 89.86% HTML 9.79% CSS 0.35%

google-maps-markup's Introduction

google-maps-markup

Drawing and measurement tools for a Google Map

npm version Build Status Coverage Status Ember Observer Score

Preview Demo

Usage

ember install google-maps-markup
{{google-maps-markup map=map}}

Available Attributes

  • map - REQUIRED; Google Map instance, defaults to undefined. Bring your own map!
  • editable - (experimental) Allow shapes to be edited. Defaults to true.
  • panForOffscreen - On hover pan to shape if not in view (reset to last bounds after). Defaults to true.
  • autoResetToPan - After drawing a shape the tool changes to "Pan" instead of staying on the current tool. Defaults to false.

Actions

  • afterAddFeature - Fires after finishing some markup on the map. Passes the result as the first argument, i.e. afterAddFeature(result) {}.
  • afterClearResults - Fires after clicking "Clear" for a mode. Passes the mode as the first argument, i.e afterClearResults(mode) {}.

Service

The service is called markupData and allows access to the result data that gets created when you create markup on the map. It also has some helper functions.

markupData: Ember.inject.service()

Properties

  • layers - Array of Google Maps Data layers, one for draw and one for measure.
  • results - Markup data for each markup you create, based on mode. See markupResults for all results.
  • markupResults - The object of all the results, no matter the mode.
  • mode - The drawing mode, either 'draw' or 'measure'.

Methods

  • activate - Add all layers to the map. activate(map).
  • changeModeByResults - Changes the mode to the first layer with results.
  • featureToResult - Converts a Google Maps Data Feature to a markup result, for loading data without actually drawing on the map (ie, load via url). featureToResult(feature, layer).

Installation

  • git clone this repository
  • npm install
  • bower install

Running

Running Tests

  • ember test
  • ember test --server

Building

  • ember build

For developing locally with your app, you can use DEVELOPING=true npm start for your app, and npm link path/to/this/addon and your app will automatically rebuild as you make changes to your local version of this addon.

For more information on using ember-cli, visit http://www.ember-cli.com/.

Github Pages/Demo

Build by checking out the relevant branch, since the test dummy app is actually the demo app.

Run the following command:

ember github-pages:commit --message <message describing demo release>

google-maps-markup's People

Contributors

ember-tomster avatar ganesh4 avatar knownasilya avatar vidyadharbhatt avatar vikasrana1989 avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.