History of GmapPackage

Comparing versions
Version 14Current version
The goal of this project is to create a package that lets you edit a Google Map like a wiki, with some Flickr integration thrown in for spice.

A Road Map for the package is well underway. You can find part of it below and part of it on this wiki page I'm beginning to move things over here as they become more clarified.

If you want to join in I'm not a professional programmer, but have faith, this is going to be sweet. If you do want to help out, well I guess you can email me wjames5 -at - nyc.rr.com or find me on the bitweaver irc thing.

Puzzles

Sets

This needs to be a lot like categories. Markers and Polys need to be grouped, or added to sets, but it would make sense to be able to add them to multiple sets. Probably need a new table for this. Should the sets be nested. Could the Categories module be duplicated as is to serve as a set manager? Does it need any modification?

RoadMap

Database Structure

TABLE: tiki_gmap

  • map_id
  • user_id
  • version
  • title
  • description
  • width
  • height
  • location_lat
  • location_Lon
  • zoom_level
  • map_type
  • show_controls (S/L/N)
  • show_scale (T/F)
  • show_map_types (T/F)
  • init_marker_set
  • init_polylines_set
  • init_polygon_set
  • add_map_types
  • marker_sets
  • polyline_sets
  • polygon_sets
  • comments (T/F?)
  • points
  • votes
  • page_rank
  • cache (?)
  • wiki_cache (?)
  • cache_timestamp (?)
  • flag (?)

TABLE: tiki_gmap_marker

  • marker_id
  • name
  • location_lat
  • location_Lon
  • icon_id (Style - Default or Custom)
  • click_action (assign actions here or type?)
  • window_data
  • style_id (Style - Default/Custom)
  • label_data (Tool Tip in PdMarker Class only)
  • zindex
  • flickr_image_id (path?)

TABLE: tiki_gmap_iconstyle
  • icon_id
  • name
  • type (GIcon / XIcon)
  • image
  • image_size
  • shadow_image
  • shadow_size
  • rollover (Image for PdMarker Type only? here or in marker styles below?)
  • icon_anchor_x
  • icon_anchor_y
  • infowindow_anchor_x
  • infowindow_anchor_y
  • infoshadow_anchor_x
  • infoshadow_anchor_y

TABLE: tiki_gmap_markerstyles
  • style_id
  • name
  • type (PdMarker / XMarker])
  • icon_hover_image (PdMarker Class)
  • label_hover_opacity (PdMarker Class)
  • label_opacity (PdMarker Class)
  • label_hover_styles (CSS for PdMarker Class)
    (should this also have a seperate style for label/tool tip when it is shown after click?)
  • window_styles (CSS for PdMarker Class)
    (is this the same as above? - waiting for email from maker of PdMarker)

TABLE: tiki_gmap_polyline

  • polyline_id
  • name
  • type (Default / XPolyline)
  • points_data (an array)
  • style_id
  • border_text
  • zindex

TABLE: tiki_gmap_polylinestyles
  • style_id
  • name
  • color
  • weight
  • opacity
  • pattern
  • segment_count
  • begin_arrow
  • end_arrow
  • arrows_every
  • font (CSS)
  • text_every
  • text_fgstyle_color
  • text_fgstyle_weight
  • text_fgstyle_opacity
  • text_fgstyle_zindex
  • text_bgstyle_color
  • text_bgstyle_weight
  • text_bgstyle_opacity
  • text_bgstyle_zindex

TABLE: tiki_gmap_polygon

note: Polygons must be XPolygons
  • polygon_id
  • name
  • type (Polygon / Circle)
  • points_data (an array for polygon)
  • center (for circle)
  • radius (for circle)
  • polylinestyle_id (uses polyline style above)
  • style_id
  • border_text
  • zindex

TABLE: tiki_gmap_polygonstyles
  • style_id
  • name
  • color
  • weight
  • opacity

TABLE tiki_gmap_sidepanel

  • show (T/F)
  • list_map_types (T/F)
  • list_markers (T/F)

Interface

this is a start toward building the UI

<form method="POST" action="submit.php" name="mapform" id="mapform">

Map Tools


Title <input name="map_title" id="map_title" type="text" size="25" value="Some Title" />

Description <input name="map_desc" id="map_desc" type="text" size="25" value="About this map" />

Width <input name="map_w" id="map_w" type="text" size="25" value="auto" />

Height <input name="map_h" id="map_h" type="text" size="25" value="auto" />

Latitude <input name="map_lat" id="map_lat" type="text" size="25" value="somenumber" />

Longitude <input name="map_lon" id="map_lon" type="text" size="25" value="somenumber" />

Zoom Level <input name="map_z" id="map_z" type="text" size="25" value="7" />

Map Type <select name="map_type" id="map_type"><option>Street Map</option><option>Satellite</option><option>Hybrid</option><option>Any custom map types</option></select>

Show Controls <select name="map_showcont" id="map_showcont"><option>Small</option><option>Large</option><option>None</option></select>

Show Scale <input name="map_showscale" id="map_showscale" type="checkbox" value="True" />

Show_map_types <input name="map_showtype" id="map_showtype" type="checkbox" value="True" />

Marker Sets (table with options)

Include On Launch <input name="map_marklaunch" id="map_marklaunch" type="checkbox" value="True" />
Include In Side Pane <input name="map_markside" id="map_markside" type="checkbox" value="True" />

Polylines Sets (table with options)

Include On Launch <input name="map_linelaunch1" id="map_linelaunch1" type="checkbox" value="True" />
Include In Side Pane <input name="map_lineside1" id="map_lineside1" type="checkbox" value="True" />

Polygon Sets (table with options)

Include On Launch <input name="map_polylaunch1" id="map_polylaunch1" type="checkbox" value="True" />
Include In Side Pane <input name="map_polyside1" id="map_polyside1" type="checkbox" value="True" />

Additional Map Types (table with options)

Include On Launch <input name="map_typelaunch1" id="map_typelaunch1" type="checkbox" value="True" />
Include In Side Pane <input name="map_typeside1" id="map_typeside1" type="checkbox" value="True" />

Comments <input name="map_comm" id="map_comm" type="checkbox" value="True" />
<input type="submit" name="mapsubmit" value="Submit" /></form>

<form method="POST" action="submit.php" name="markerform" id="markerform">

Marker Tools


Marker


Name<input name="marker_name" id="marker_name" type="text" size="25" value="somenumber" />

Latitude<input name="marker_lat" id="marker_lat" type="text" size="25" value="somenumber" />

Longitude<input name="marker_lon" id="marker_lon" type="text" size="25" value="somenumber" />

Icon Type<select name="marker_icontype" id="marker_icontype"><option>Default Style</option><option>Custom Style 1</option><option>Custom Style 1</option></select>

Click Action (assign actions here or type?)

Window Text<textarea name="marker_wintext" id="marker_wintext" cols="30" rows="5" />

Marker Style<select name="marker_style" id="marker_style"><option>Default Style</option><option>Custom Style 1</option><option>Custom Style 1</option></select>

Label Text <textarea name="marker_labeltext" id="marker_labeltext" cols="30" rows="2" />

zIndex <input name="marker_zi" id="marker_zi" type="text" size="25" value="auto" />

Flickr Image (how to get path? menu?)

Custom Icon Tools


Name <input name="icon_name" id="icon_name" type="text" size="25" value="Some Name" />

Type<select name="icon_type" id="icon_type"><option>GIcon</option><option>XIcon</option></select>

Icon Image Path <input name="icon_img" id="icon_img" type="text" size="25" value="Some Value" />

Image Size <input name="icon_imgsize" id="icon_imgsize" type="text" size="25" value="Some Value" />

Shadow Image Path <input name="icon_shadow" id="icon_shadow" type="text" size="25" value="Some Value" />

Shadow Size <input name="icon_shadowsize" id="icon_shadowsize" type="text" size="25" value="Some Value" />

Icon Anchor x <input name="icon_anchorx" id="icon_anchorx" type="text" size="25" value="Some Value" />

Icon Anchor y <input name="icon_anchory" id="icon_anchory" type="text" size="25" value="Some Value" />

Info Window Anchor x <input name="icon_winanchorx" id="icon_winanchorx" type="text" size="25" value="Some Value" />

Info Window Anchor y <input name="icon_winanchory" id="icon_winanchory" type="text" size="25" value="Some Value" />

Info Shadow Anchor x <input name="icon_shadowanchorx" id="icon_shadowanchorx" type="text" size="25" value="Some Value" />

Info Shadow Anchor y <input name="icon_shadowanchory" id="icon_shadowanchory" type="text" size="25" value="Some Value" />

Custom Marker Tools


Name <input name="marker_styname" id="marker_styname" type="text" size="25" value="Some Value" />

Type <select name="marker_stytype" id="marker_stytype"><option>PdMarker</option><option>XMarker</option></select>
(PdMarker Class Only)

Icon Hover Image Path <input name="icon_hover" id="icon_hover" type="text" size="25" value="Some Value" />

Label Hover Opacity <input name="icon_hoverop" id="icon_hoverop" type="text" size="25" value="A Number" />

Label Opacity <input name="icon_labelop" id="icon_labelop" type="text" size="25" value="A Number" />

Label Hover Styles <input name="icon_hoverstyle" id="icon_hoverstyle" type="text" size="25" value="Some Value" />

Window Styles <input name="icon_winstyle" id="icon_winstyle" type="text" size="25" value="Some Value" />
<input type="submit" name="markersubmit" value="Submit" /></form>

<form method="POST" action="submit.php" name="polyform" id="polyform">

Polyline Tools


Ployline


Name <input name="line_name" id="line_name" type="text" size="25" value="Some Value" />

Type<select name="line_type" id="line_type"><option>Default</option><option>XPolyline</option></select>

Points Data <textarea name="line_data" id="line_data" cols="30" rows="5" />

Style<select name="line_style" id="line_style"><option>Default</option><option>Custom</option></select>
(selects a style by id

Border Text <input name="line_bordertext" id="line_bordertext" type="text" size="25" value="Some Value" />

zIndex <input name="line_zi" id="line_zi" type="text" size="25" value="A Number" />

Polyline Styles


Name <input name="line_styname" id="line_styname" type="text" size="25" value="Some Value" />

Color <input name="line_color" id="line_color" type="text" size="25" value="Hex Value" />

Weight <input name="line_name" id="line_name" type="text" size="25" value="A Number" />

Opacity <input name="line_w" id="line_w" type="text" size="25" value="A Number" />

Pattern <input name="line_pattern" id="line_patter" type="text" size="25" value="A Number" />

Segment_count <input name="line_seg" id="line_seg" type="text" size="25" value="A Number" />

Begin Arrow <input name="line_beginarrow" id="line_beginarrow" type="checkbox" value="True" />

End Arrow <input name="line_endarrow" id="line_endarrow" type="checkbox" value="True" />

Arrows Every <input name="line_arrowint" id="line_arrowint" type="text" size="25" value="A Number" />

Font (CSS) <input name="line_font" id="line_font" type="text" size="25" value="Some Value" />

Text Every <input name="line_textint" id="line_textint" type="text" size="25" value="A Number" />

Text fgstyle_color <input name="line_txtfgcolor" id="line_txtfgcolor" type="Text" size="25" value="Hex Value" />

Text fgstyle_weight <input name="line_txtfgweight" id="line_txtfgweight" type="Text" size="25" value="A Number" />

Text fgstyle_opacity <input name="line_txtfgop" id="line_txtfgop" type="Text" size="25" value="A Number" />

Text fgstyle_zindex <input name="line_txtfgzi" id="line_txtfgzi" type="Text" size="25" value="A Number" />

Text bgstyle_color <input name="line_txtbgcolor" id="line_txtbgcolor" type="Text" size="25" value="Hex Value" />

Text bgstyle_weight <input name="line_txtbgweight" id="line_txtbgweight" type="Text" size="25" value="A Number" />

Text bgstyle_opacity <input name="line_txtbgop" id="line_txtbgop" type="Text" size="25" value="A Number" />

Text bgstyle_zindex <input name="line_txtbgzi" id="line_txtbgzi" type="Text" size="25" value="A Number" />

Polygon Tools


Polygon


Name <input name="poly_name" id="poly_name" type="text" size="25" value="Some Value" />

Type<select name="poly_type" id="poly_type"><option>Polygon</option><option>Circle</option></select>

Points Data <textarea name="poly_data" id="poly_data" cols="30" rows="2">An Array</textarea>

Center <input name="poly_center" id="poly_center" type="Text" size="25" value="A Lat/Lon Array" />

Radius <input name="poly_radius" id="poly_radius" type="Text" size="25" value="A Number" />

Border Style<select name="poly_borderstyle" id="poly_borderstyle"><option>Custom 1</option><option>Custom 2</option></select>

(this is a polyline style)

Style<select name="poly_style" id="poly_style"><option>Custom 1</option><option>Custom 2</option></select>

(this is a polygon style)

Border Text <input name="poly_bordertext" id="poly_bordertext" type="text" size="25" value="Some Value" />

zIndex <input name="poly_zi" id="poly_zi" type="text" size="25" value="A Number" />

Polygon Style


Name <input name="poly_styname" id="poly_styname" type="text" size="25" value="Some Value" />

Color <input name="poly_color" id="poly_color" type="text" size="25" value="A Number" />

Weight <input name="poly_weight" id="poly_weight" type="text" size="25" value="A Number" />

Opacity <input name="poly_op" id="poly_op" type="text" size="25" value="A Number" />
<input type="submit" name="polysubmit" value="Submit" /></form>


 

Summary

This package makes including and using Google Maps on your bitweaver site a snap! You can create maps, markers, polylines, and other information with just a little pointing and clicking - no Google Maps API knowledge required! It also provides a service to other packages, to make it easy to add location data to other content. The Gmap Package also provides a universal map for viewing any of such geo-located bitweaver content on your site, so if you tag a page or article with a location you can search for that content by location and view it on a map.

Core Features:

Gmap Map Builder

Creating Custom Google Maps with Custom Markers, Polylines, Polygons, and other features

Gmap Mapping Service

Lets other packages integrate Google Maps into their features without having to do any map development. One example use that is already integrated is Google Maps can be used for easily attaching geo location data to any bitweaver cms content. Admins can select which content types can be mapped. A Small Map and Permalinks to the Gmap Content Browser can also be included on content pages for easy viewing of where a content item is on a map.

Gmap Content Browser

A universal map interface for searching for bitweaver geo located content (like pages, articles, users) and viewing it on the map.

Install Instructions

Dependencies

The R2 version of the GmapPackage is dependent on the GeoPackage. All location date, lat/lng pairs, are being managed by the GeoPackage service. You MUST also install the GeoPackage if you want to use GmapPackage.

For strict security enforcement in Gmap package you should also install LibertySecurePackage. Gmap has options for making maps and map components private. To strictly enforce those settings in all access points, particularly lists, then you will need LibertySecure. You can run Gmap without LibertySecure, but "private" content will be displayed in lists.

Configuration

You must obtain a Google Map API Key for your site.
To use the package you need a key from Google. You can sign up for a key here - it is quick and painless and best of all, Free. After you install the package and have your key, you can plugin your key value for your site in the Gmap admin preferences, which you can get to by going to http://yourbitweaversite/kernel/admin/. Or if you just point your browser to the gmap/ directory, while logged in as admin, you will get prompts how to do this.

For non-required additional configuration tips see: GmapPackage Configuration Tips

Get The Code

You can get the latest version of the package by getting module _bit_gmap from bitweaver CVS.

Development Roadmap

Bugs

  • Content Browser Map - Category options list has duplicates. (NEED HELP)
  • Content Browser Map - Content in nested categories is not found when only ancestor is selected (NEED HELP)
  • Maptype/Tilelayer/Copyright updating after edit does not work - this is really a TODO — you can store maptypes - just refresh the map to see the results. Basically the ajax callback does not work at the moment.

Next Steps

  • backside functionality to browse Marker, polyline, and polygon styles exists, need ui to display info to user while editing overlays.
  • cache page requests - including all related data
  • stuff javascript
  • Polygon drawing assistant basically works - could be nicer
  • Create custom display of polys on Gmap Content Browser page
  • Create content page versions for Polylines, Polygons, that do not require loading the whole map.
  • Clean Up gmap css
  • Integrate GxMarker and PdMarker.

  • Infinity and Beyond: see history below

Custom History

History features would be for recording changes to gmap package specific data as well as displaying liberty history data.
  • Wire in access to Liberty History records
  • Map History
  • Marker History
  • Poly History

Final Beta Prep

  • Test in various browsers

Extended Features Description

Many basic Google Map features are now fully supported and editable via a AJAX UI. Also 600+ free custom icon images, as originally listed here are also included with the package. Additionally, Marker infoWindow text can utilizes whatever text syntaxes your site supports. With all these features you can create great looking maps without writing a single line of javascript. And with its "Sets Model", the Gmap Package makes it easy to re-use map components, like marker styles, custom icons, polylines, etc, over and over on multiple maps, i.e. create once, use infinitely. More about the "Sets Model" is below.

The features of the package are supplemented by a bleeding edge AJAX editing interface. Almost all features of the map can be updated live, without a browser refresh.

About the AJAX Editing UI

The Gmap Package has a very robust AJAX based editing interface for live updating of map features. The editing UI and related AJAX transaction methods use the Mochkit library.

Sets Model Framework

The GmapPackage uses a sets model for associating markers, markericons, maptypes, polylines, polygons, and their styles with maps.

Through the use of various keychains, each object may be associated with many maps, many sets of obejcts, and many styles. Each map has a key chain which associates it with sets of markers, maptypes, polylines, and polygons. Marker Sets, Polyline Sets, and Polygon Sets in turn each have individual objects as well as styles with which they are associated. The reason for this is multifold.

One advantage of this sets model is it makes it easier to share individual markers, polyline, and polygons with various maps and sets of each object. For example a marker can be in any number of sets, and those sets can be on any number of maps. This makes it much easier to share content across multiple maps. This could be especially value where say you might want to mash up particular information like restaurants, or art events with something universal like subway stops. Once you create a set of subway stops, then you could reuse that on multple maps mixing it with other data.

The other advantage is that styles can be divorced from content. This is both valuable for customizing the look and feel of the same map data on a map by map basis, as well as optimizing the database and lightening page weight. Each set contains a reference to a style. If a new look and feel is desired for a set of markers, that set only need be duplicated and a new style assigned. However none of the actual marker or polyline or polygon data is duplicated, only the reference to that data. This thus reduces redundancy while following in the W3C ideal of seperating data from style.

This use of sets also makes for lighter db queries and page weight. For each style used that style is only delivered to the client once, each object in a set then references that one style. This is faster and more efficient than packaging style information with each object...especially as one starts to use tens to hundreds of like styled objects on one map.

References


Page History
Date/CommentUserIPVersion
25 Nov 2008 (20:19 UTC)
bug fix updates
Will69.203.72.161167
Current • Source
Will69.203.72.161166
View • Compare • Difference • Source
Will69.203.72.161165
View • Compare • Difference • Source
Will69.203.72.161164
View • Compare • Difference • Source
Will69.203.72.161163
View • Compare • Difference • Source
Will69.203.72.161162
View • Compare • Difference • Source
Will69.203.72.161161
View • Compare • Difference • Source
Will69.203.72.161160
View • Compare • Difference • Source
Will69.203.72.161159
View • Compare • Difference • Source
Will69.203.72.161158
View • Compare • Difference • Source
Will69.203.72.161157
View • Compare • Difference • Source
Will69.203.72.161156
View • Compare • Difference • Source
Will69.203.72.161155
View • Compare • Difference • Source
Will69.203.72.161154
View • Compare • Difference • Source
Will69.203.72.161153
View • Compare • Difference • Source
Will69.203.72.161152
View • Compare • Difference • Source
Will69.203.72.161151
View • Compare • Difference • Source
Will69.203.72.161150
View • Compare • Difference • Source
Will69.203.72.161149
View • Compare • Difference • Source
Will69.203.72.161148
View • Compare • Difference • Source
Will206.83.76.15147
View • Compare • Difference • Source
Will66.251.17.162146
View • Compare • Difference • Source
Will206.83.76.15145
View • Compare • Difference • Source
Will66.251.17.162144
View • Compare • Difference • Source
Will66.251.17.162143
View • Compare • Difference • Source
Will206.83.76.15142
View • Compare • Difference • Source