Bing Maps V7 Modules

Reopened Issue: Calling Clustering Code SetData with single point causes error [935]

rbrundritt — Fri, 14 Jun 2013 07:21:48 GMT

When calling the "SetData" property with a single point, the clustering scripts fails (using the non-mini reference version of V7CientSideClutering.js) at line 173

pixel = _map.tryLocationToPixel(_data[i]._LatLong, Microsoft.Maps.PixelReference.control);

reason is that the SetData routine at line 326

if (i > 0) {

should be
if (i >= 0) {

With the original (if (i > 0)) , a single points count is equal to 0 and thus the _data[i]._LatLong property is not set which is needed for call at line 173.
I've corrected in my version but thought I would pass on my finding.
BTW, thanks for all your work and contributions. The code is awesome and works very well.
Thanks again
David

Reopened Issue: Bing Maps v7 Module not loading [1040]

rbrundritt — Fri, 14 Jun 2013 07:21:47 GMT

I'm trying to use the Well Known Text Reader/Writer (http://bingmapsv7modules.codeplex.com/wikipage?title=Well%20Known%20Text%20Reader%2fWriter) but I'm having issues loading the module. I load the module here:

Microsoft.Maps.registerModule("WKTModule", "../../JS/WKTModule.js");
Microsoft.Maps.loadModule("WKTModule");

I then define a layer to add shapes to:

var countyLayer = new Microsoft.Maps.EntityCollection();

But when I try to use the model in this next block, I get the error "WKTModule is not defined"

Updated Wiki: Mini-Map Module

rbrundritt — Wed, 05 Jun 2013 13:19:07 GMT

Mini-Map

Author: OnTerra Systems

Category: Layout

Module Size: 4 kb

Dependencies: JQuery

Description:

The Bing Maps Ajax v7 control doesn’t include support for adding a Mini Map. The Mini Map is a small map at the top right corner of the parent map that’s collapsible and shows the extents covered by the current map. This module adds a mini map at the top right corner of the screen. Mini-map view helps to give a zoomed out overview of your location.

Download:

MiniMapModule.zip

Updated Wiki: Point Based Clustering

rbrundritt — Thu, 30 May 2013 20:19:26 GMT

Point Based Clustering

Author: Ricky Brundritt

Category: Layout

Module Size: 15 kb (minified 4 kb)

Dependencies: none

Description:

This module allows you to easily add in client side clustering to your application. Client Side Clustering is a method where pushpins that are close together are grouped and represented as a single pushpin, often using a different icon to indicate the cluster. This is a great way to improve both the user experience and the performance of the map. To make things easier several features have been added to give you full control of the clustering control without having to modify the code for the module. This is similat yo Client Side Clustering module that already exists but uses a different type of algorithm for grouping clusters. The algorithm used by this module prevents pushpins from overlapping and only clusters the data when the zoom level changes. Addiitonally this module keeps track of clustered information for each zoom level making the algorithm faster the more you use it. This module is recommended for clustering 2000 pushpins or less in the browser. If you need to support 2000 - 5000 pushpins then look at the other Client side Clustering module

What is Client Side Clustering?

Often we want to load a lot of data on the map, for example if you were a real estate company you would likely want to load up all the properties that matched a user’s search. This could potentially be a couple hundred, if not thousands of results. If you are zoomed in close to the map it will be pretty easy to identify each location on the map, but if you zoom out the pushpins will likely overlap and the map will become cluttered. Here is an example of 1000 pushpins that are unclustered:

Clustering is the process of grouping closely positioned locations together and representing them with a single pushpin. When you zoom in those locations will become further apart and will separate into their own pushpins. The client side part of “Client Side Clustering” is clustering the data on the fly in JavaScript rather than going back to the server to request more data. When you have a few thousand or less location to display on the map client side clustering can be significantly faster than server side clustering and also cuts down on request to your server thus making your application more scalable. Here is an example of the same 1000 pushpins from before being clustered:

Download:

BMv7.PointBasedClustering.zip

Closed Issue: infobox appears behind pins after using ClusteredEntityCollection [1084]

rbrundritt — Thu, 30 May 2013 19:33:40 GMT

I can create hundreds of push pins normally with infoboxes, when I click on one of the pins the infobox appears over the pushpins behind it. Is I do the same thing through the ClusteredEntityCollection, if I click on it to show the infobox, all the push pins now show ever top of the infobox.

New Post: Windows 8 support

rbrundritt — Mon, 20 May 2013 20:20:01 GMT

Most of these work in Windows 8 without any changes being needed. When I get a chance I plan on going through all the modules and testing them in a windows Store app and fix the ones that aren't supported.

Closed Issue: Calling Clustering Code SetData with single point causes error [935]

rbrundritt — Thu, 16 May 2013 10:21:47 GMT

Closed Issue: Bing Maps v7 Module not loading [1040]

rbrundritt — Thu, 16 May 2013 10:21:46 GMT

Updated Wiki: Home

rbrundritt — Fri, 19 Apr 2013 17:37:00 GMT

Project Description
The Bing Maps V7 map control is designed to support a modular framework. The purpose of this project is to compile all the community created modules into one location. Modules are a great way to create common reusable code that is easy to integrate into Bing Maps. By using modules you can save development time and money. Also take a look the list of other useful Bing Maps Resources.

This project has been a great success with many of these modules being used by millions of people every day. If you have a great idea for a module submit it under the discussion panel.

Active Modules

Module Name	Category	Description	Submitted By
Canvas Pushpins	Layout	This module creates an HTML Canvas pushpin class which can be used to create amazing pushpin effects.	Ricky Brundritt
Canvas Tile Layer	Layout	This module allows you to create a custom tile layer where the images, instead of being fetched from the server, are generated on-the-fly using HTML5 Canvas.	Pedro Sousa
Circle Module	Layout	This module extends the Polygon class to create Circle and RegularPolygon shape classes.	Ricky Brundritt
Client Side Clustering	Layout	This module allows you to easily add in clustering functionality into Bing Maps simply by using an extended version of the EntityCollection class called ClusteredEntityCollection.	InKnowledge
Client Side Heatmap	Layout	This module renders beautiful heatmap overlays that can be placed on top of the map. Client browser must support the <canvas> element (IE9, Chrome, Firefox 3.6 or greater)	Alastair Aitchison
Custom Infobox Control	Layout	This module generates highly customizable infoboxes.	InKnowledge
Drag Handles	Extension	This module makes it easy to edit shapes by adding handles to drag the vertices of the shapes to update their values.	Mike Garza
Elevation Plot	Layout	This module makes it easy to use the Bing Maps elevation service to create an elevation profile plot to you page. It supports simple points and routes and mouseover interactivity.	SoulSolutions
GeoJSON Module	Data	This module allows you to import GeoJSON files into Bing Maps. This module supports majority of GeoJSON tags.	Earthware Ltd.
GeoRSS	Data	This module allows you to import GeoRSS files into Bing Maps. This module supports majority of GeoRSS and GML tags.	InKnowledge
GPX Parser	Data	This module allows you to import GPX files into Bing Maps.	InKnowledge
Image Overlays	Layout	This module takes an image and stretches it over a defined bounding box. The image resizes and stays positioned as the map is panned and zoomed.	Ricky Brundritt
Mini Map Module	Layout	The Mini Map is a small map at right corner of the parent map that’s collapsible and shows the extents covered by the current map. Mini-map view helps to give a zoomed out overview of your location.	OnTerra Systems
Persistence	Extension	This module allows you to provide your users with a url they can share to return to the exact location and map style they can currrently see. Optionally this can also be automatically saved so the next time the user visits they can continue exactly where they last were.	SoulSolutions
Point Based Clustering	Layout	This module is a modified version of the Client Side Clustering module. This module uses a point based algorithm rather than a grid based one for grouping clusters.	Ricky Brundritt
Route Optimization - RouteSavvy Module	Optimization	RouteSavvy is a simple but powerful tool that takes from just a few up to hundreds of locations that one may need to visit, and reorders them based on whether you'd like to visit them in a "round-trip" OR as a one-way trip - with the last stop chosen either by you or by the software (whichever is preferred).	OnTerra Systems
Route Service Helper	Extension	This module wraps the Bing Maps REST Routing service and makes it easy to request routes with any number of waypoints.	Ricky Brundritt
Shape Toolbox Module	Extension	The Shape Toolbox module allows you to add shape drawing functionality to any map.	Mike Garza
Simple GeoRSS	Data	This is a light weight module that can load a Simple GeoRSS feed to Bing Maps.	Johannes Kebeck
Well Known Text Reader/Writer	Data	This module allows you to easily read and write Well Know Text data.	Ricky Brundritt

If you would like to download all the modules at once go to the Source Code tab and click download under the "Latest Version" section.

Updated Wiki: Canvas Tile Layer Module

rbrundritt — Fri, 19 Apr 2013 17:34:28 GMT

Canvas Tile Layer Module

Author: Pedro Sousa

Category: Layout

Module Size: 7 kb (minified 3 kb)

Original Source: Creating a Bing Maps Tile Layer

Dependencies: HTML5 Canvas, (optional) Jscache

Description:

This module allows you to create a custom tile layer where the images, instead of being fetched from the server, are generated on-the-fly using HTML5 Canvas.

BMv7.CanvasTileLayer.zip

Screenshots:

Updated Wiki: Canvas Pushpin Module

rbrundritt — Fri, 19 Apr 2013 17:32:36 GMT

Canvas Pushpins

Author: Ricky Brundritt

Category: Layout

Module Size: 3 kb (minified 1 kb)

Original Source: TBA

Dependencies: Requires browser to support HTML5 canvas. use excanvas to support IE7/8

Description:

This module wraps the standard pushpin class to create a new HTML5 Canvas pushpin class. There are a lot of cool and interesting things we can do with the canvas that would require a lot more work using traditional HTML and JavaScript. By using this module tasks such as rotating a pushpin or programmatically changing the color can be easily achieved.

Screenshots of samples:

BMv7.CanvasPushpins.zip

Updated Wiki: Canvas Tile Layer Module

rbrundritt — Fri, 19 Apr 2013 17:27:51 GMT

Author: Pedro Sousa

Category: Layout

Module Size: 7 kb (minified 3 kb)

Original Source: Creating a Bing Maps Tile Layer

Dependencies: HTML5 Canvas, (optional) Jscache

Description:

This module allows you to create a custom tile layer where the images, instead of being fetched from the server, are generated on-the-fly using HTML5 Canvas.

BMv7.CanvasTileLayer.zip

Screenshots:

Source code checked in, #25571

rbrundritt — Fri, 19 Apr 2013 17:13:41 GMT

Adding Canvas Tile Layer module

Patch Uploaded: #14224

MSmearer — Mon, 01 Apr 2013 22:36:58 GMT

MSmearer has uploaded a patch.

Description:
In several of the parse functions, the array loop is "for (var i in theArray)". If you have added prototype function elsewhere to Array, these methods are iterated as well. I've changed these for-loops to use "for (i = 0; i < theArray.length; i++)".

Commented Issue: infobox appears behind pins after using ClusteredEntityCollection [1084]

rbrundritt — Wed, 27 Mar 2013 13:32:32 GMT

Watch the order in which you add your layers. Also look at using the zIndex on the layers to move your Infobox so it's about the pushpins. Take a look at this blog post for info on how to properly keep the infobox about pins: http://rbrundritt.wordpress.com/2011/10/13/multiple-pushpins-and-infoboxes-in-bing-maps-v7/

Source code checked in, #24786

rbrundritt — Mon, 25 Mar 2013 16:40:30 GMT

Adding Circle, Image Overlay and Canvas Pushpin Modules

Updated Wiki: Well Known Text Reader/Writer

rbrundritt — Fri, 15 Feb 2013 09:00:01 GMT

Well Known Text Reader/Writer

Author: Ricky Brundritt

Category: Data

Module Size: 11 kb (minified 4 kb)

Description:

This module allows you to easily read and write Well Know Text data. When reading Well Know Text data it is parsed into Bing Maps shapes. MultiPoint, MultiLinstring, MultiPolygon and GeometryCollection are turned into an EntityCollection of shapes.To write Well Known text simply pass in a Bing Maps shape and the Well Known Text equivalent will be returned.

Supported WKT tags:

Point
Linestring
Polygon – Supports Complex Polygons
MultiPoint
MultiLinestring
MultiPolygon
Geometrycollection

Loading the Module:

//Register and load the Persistence Module
Microsoft.Maps.registerModule("WKTModule", "scripts/WKTModule.js");
Microsoft.Maps.loadModule("WKTModule");

Write Example:

var p = new Microsoft.Maps.Point(new Microsoft.Maps.Location(0,0));
var wkt = WKTModule.Write(p);
--> wkt = 'POINT(0,0)'

Read Example:

var wkt = 'LINESTRING(0 0, 10 10)';
var shape = WKTModule.Read(wkt);
--> shape = Microsoft.Map.Polyline

Options:

Style Options - Pass in styles into the Read method to override the default styles options for generating the shapes. These styles will be merged with the default option styles.

Download:

BMv7.WKTModule.zip

Source code checked in, #23562

rbrundritt — Fri, 15 Feb 2013 08:57:56 GMT

Bug Fixes

Source code checked in, #23561

rbrundritt — Fri, 15 Feb 2013 08:57:29 GMT

Bug fixes

Source code checked in, #23560

rbrundritt — Fri, 15 Feb 2013 08:57:05 GMT

Bug fix for WKT module