ProfessionalWiki / ProfessionalWiki/Maps

Ability to add custom maptypes with the googlemaps service

Open
#23 7 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

enhancement good first issue GoogleMaps
Dominant language
JavaScript
Stars
78
Forks
65
Avg merge
9h 17m
Merged PRs (30d)
6

Description

Import from https://bugzilla.wikimedia.org/show_bug.cgi?id=44869

It would be great to be able to add custom map types to the googlemaps service. In my specific case, for instance, I would like to overlay the map offered by the Norwegian Mapping Authority (Statens Kartverk) alongside Google's terrain map. Documentation for how to do this can be found here: https://developers.google.com/maps/documentation/javascript/maptypes#CustomMapTypes

Using a practical example, with the Norwegian Mapping authority as described, the Javascript code would/could like like this:

function StatkartMapType(name, layer) {
  this.layer = layer
  this.name = name
  this.alt = name
  this.tileSize = new google.maps.Size(256,256);
  this.maxZoom = 19;
  this.getTile = function(coord, zoom, ownerDocument) {
    var div = ownerDocument.createElement('DIV');
    div.style.width = this.tileSize.width + 'px';
    div.style.height = this.tileSize.height + 'px';
    div.style.backgroundImage = "url(http://opencache.statkart.no/gatekeeper/gk/gk.open_gmaps?layers=" + this.layer + "&zoom=" + zoom + "&x=" + coord.x + "&y=" + coord.y + ")";
    return div;
  };
}

var map;

function initialize() {
  var mapOptions = {
    zoom: 8,
    center: new google.maps.LatLng(60,9),
    mapTypeControlOptions: {
      mapTypeIds: ['topo2', google.maps.MapTypeId.TERRAIN]
    }
  };
  map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
  map.mapTypes.set('topo2',new StatkartMapType("S.Kartverk", "topo2"));
  map.setMapTypeId('topo2');
}

-- kvolden@gmail.com 2013-02-11 11:34:08 UTC

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the googlemaps service and the Google Maps JavaScript API custom map types documentation linked in the issue. Compare the requested Norwegian Mapping Authority example with the service's current map-type handling; done means users can register and use a custom map type alongside Google's terrain map.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.