DEPRECATION WARNING

This documentation is not using the current rendering mechanism and is probably outdated. The extension maintainer should switch to the new system. Details on how to use the rendering mechanism can be found here.

EXT: Mappamundi¶

Created:	2013-05-31T08:45:43.710000000
Changed by:	Nils Kreutzer
Changed:	2015-01-26T10:23:21.270000000
Classification:	kk_mappamundi
Description:	The keywords help with categorizing and tagging of the manuals. You can combine two or more keywords and add additional keywords yourself. Please use at least one keyword from both lists. If your manual is NOT in english, see next tab "language" ---- forEditors (use this for editors / german "Redakteure") forAdmins (use this for Administrators) forDevelopers (use this for Developers) forBeginners (manuals covering TYPO3 basics) forIntermediates (manuals going into more depth) forAdvanced (covering the most advanced TYPO3 topics) ----
Keywords:	map, vector, pixel, management, forEditors
Author:	Nils Kreutzer
Email:	nilskreutzer@hotmail.com
Language:	en

EXT: Mappamundi¶

Extension Key: kk_mappamundi

Language: en

Version: 3.0.0

Keywords: map, vector, pixel, management, forEditors

This document is published under the Open Content License

available from http://www.opencontent.org/opl.shtml

The content of this document is related to TYPO3

a GNU/GPL CMS/Framework available from www.typo3.org

Table of Contents

EXT: Mappamundi 1

Introduction 3

What does it do? 3

Screenshots 3

General Configuration 5

configuring skin margins 5

Configuration pixel based map 6

Configuring the content element: 7

Images: 7

Map elements: 7

Responsive: 7

Design: 7

Configuring the map elements: 7

Title: 9

Bubble orientation: 9

Offset x / Offset y: 9

Image: 9

Image offset / Image offset x / Image offset y: 9

Text element: 9

Configuration vector based map 10

Configuring the content element: 10

Map viewport height/width: 10

Zoomfactor: 11

Object groups: 11

Option “Activate zoombuttons”: 11

Option “Activate uid picker”: 11

Configuring the object group: 12

Scope width / Scope height / Scope Offset: 13

Option “Auto-Scope”: 13

Stroke width: 13

RGB fill color if off / on: 13

RGB stroke color if off / on: 13

Stroke line join: 13

Stroke line cap: 13

Stroke miterlimit: 13

Fontsize: 13

Option “Generate permanent titles in svg”: 13

Option “Link permanent titles”: 13

Option “remove title if off”: 13

Vector Objects: 13

Configuring the vector object: 14

Title: 14

Object type: 14

State: 15

Link: 15

Permanent Titles Offset: 15

Option “no permanent titles for this object!”: 15

Coordinates: 15

Tutorial 16

How do I customize the skins for pixelbased maps? 16

Where do I get the vector data for my map? 16

How do I get the vector data into my database? 16

Known Bugs 18

ChangeLog 19

Introduction¶

Manual for typo3 extension kk_mappamundi.

What does it do?¶

Mappamundi creates a manageable map based on pixels (jpg,gif,png) or vectors (svg) on a page. Pixel based maps come with a tooltip based on a content element on mouseover and an optional extra image. Vector based maps consist of vector objects from the database, can be linked to any url and have a simple css mouseover effect. There is also the possibility to define multiple maps in one container to create a zoom effect and to show more details.

Screenshots¶

Here you see what the extension does:

Examples of mappamundi can be viewed online (as of May 31 ^st 2013):

Pixel based version:

http://www.solarworld.de/default-content/karte-epbt/

http://www.solarworld.gr/gr/proionta/perissotera-erga-anaforas/

Vector based version:

http://www.solarlokal.de/home/#c11496

Updating mappamundi from a version prior 3.0.0¶

If you updated mappamundi from a previous version, there are some things you have to consider. There is no dam support in version 3.0.0, as dam was replaced by fal in typo3 6.0. So you probably have to update all image links in mappamundi elements (i.e. background-images and images in map locations). As there was a change in typo3 database functionality, the version 3.0.0 will not function in typo3 version prior to 6.1 (or maybe 6.0, but I haven't tested). There should be no updating problems with vector based maps.

General Configuration¶

defining the storage PID¶

Before doing anything else, create a storage folder and set the Storage PID to its id in the extension configuration. All vector elements will be saved here.

configuring skin margins¶

If you change the skin images in the skin folders (res/skin_0, res/skin_1, res/skin_2), you can adjust the margins for the images here. See tutorial section for a better insight.

Configuration pixel based map¶

A pixel based map consists of a picture and some map points. Create a pixel based map as a content element.

Configuring the content element: ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

Images: """""""

Select an image file with fal.

Select/edit/create map elements for your map.

Check this to make the map responsive.

Change the bubble/anchor design. You can choose from three (slightly) different designs here. Check the tutorial section to learn how to customize the skins.

Configuring the map elements:¶

Title: """"""

The title of the element (will be included in the title tag).

Bubble orientation:¶

Choose the orientation of the popup bubble.

Offset x / Offset y:¶

Defines the position on the map in pixels.

Image:¶

Define an image element using dam. See “known bugs” section.

Image offset / Image offset x / Image offset y:¶

There are 4 default image offset settings you can choose from (“top”, “right”, “bottom” and “left”). The chosen position is then modified with the values from “Image offset x” and “Image offset y” (all units in pixels).

Text element:¶

Define a content element to be displayed in the bubble.

Configuration vector based map¶

A vector based map consists of different object groups that consist of many vector objects. Create a vector based map as a content element.

Configuring the content element: ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

Map viewport height/width: """"""""""""""""""""""""""

Defines height and width of the map displayed on the webpage in pixels.

Possible values are 'no zoom', '2', '3', '4'. Sets the zoomfactor of the map if there is more than one object group defined. The setting 'no zoom' deactivates the zoom entirely.

You can define up to 10 different object groups here. If more than one object group is defined here, you can zoom/switch between the maps in frontend.

If you check this, the zoom by mousewheel is deactivated and two zoombuttons are shown instead.

Option “Activate uid picker”: """""""""""""""""""""""""""""

If you check this, the uid picker is activated in the front end. Note that the “remove title if off” option will interfere with the behavior of this feature (resulting in only activated objects being picked). To use the picker, press shift and move the mouse over the map. The uids of the elements will be displayed in a box, where they can be marked and copied. You can use the uid picker and a database-tool like phpmyadmin to easily create subselections of existing maps.

Configuring the object group:¶

Scope width / Scope height / Scope Offset: """"""""""""""""""""""""""""""""""""""""""

If you use vector data from a svg file, you usually can use the scope values from the file without any offset. If you just use some objects from a svg file, you have to adjust the values for scope width, scope height and offset accordingly to fit the svg to the image.

Option “Auto-Scope”:¶

If this option is checked, the computer tries to determine the correct scope and offset values for the image. As this is a bit complicated (the alpha version still has some problems with paths) the result may vary. If you encounter problems with auto-scope, it is probably a good idea to note the computed values and insert them in the fields above, so you don't have to completely guess the values.

Stroke width:¶

Determines the stroke width (in units used by the svg file).

RGB fill color if off / on:¶

Define the fill (a.k.a. background) color of a vector object for on and off state. Use hexadecimal format.

RGB stroke color if off / on:¶

Define stroke color of a vector object for on and off state. Use hexadecimal format.

Stroke line join:¶

Define stroke line join type for group. Possible values are 'miter','round','bevel'.

Stroke line cap:¶

Define stroke line cap type for group. Possible values are 'butt','round','square'.

Stroke miterlimit:¶

Define miterlimit for group (used only if 'stroke line join' is set to 'miter').

Fontsize:¶

Define the overall font size of text on the map. The unit also has to be defined here (i.e.: “2px”, “1.3em”, “2pt“, etc.).

Option “Generate permanent titles in svg”:¶

If this is checked, a text object with the title of the object is generated for every object. The title is centered over the object for which is was generated (still some problems with paths). The title can than be moved manually via the “Permanent titles offset” value in the vector object properties.

Option “Link permanent titles”:¶

If this (and “Generate permanent titles in svg”) is checked, the titles generated for the vector objects are linked to the link url.

Option “remove title if off”:¶

If this is checked, no titles are generated for all objects with have the state 'off'. This also effects the mouseover info (no mouseover info for objects with the state 'off').

Vector Objects:¶

Define vector objects here.

Configuring the vector object:¶

Title: """"""

The title of the object, used by mouseover info and permanent title property.

Object type:¶

The object type of the vector object. Possible values are “rectangle”, ”circle”, ”ellipse”, ”line”, ”polygon”, ”polyline”, ”path” and “text”. If you change the value here, save/update the form so the correct fields for the type are shown.

State:¶

Define on or off state of vector object.

Link:¶

Link the vector object. Internal links get target “_self”, external links get target “_blank”.

Permanent Titles Offset:¶

Use these fields to give an offset to the permanent titles generated for this object.

Option “no permanent titles for this object!”:¶

Check this to prohibit permanent titles for this object.

Coordinates:¶

Paste the coordinates of the vector object here.

Tutorial¶

How do I customize the skins for pixelbased maps?¶

You will find 9 images in each of the skin folders “res/skin_0”, “res/skin_1”, “res/skin_2”. There is one image for the anchor (point.png) and 8 images for the bubbles (bubble_bottom_left.png, bubble_bottom_right.png, bubble_left_bottom.png, bubble_left_top.png, bubble_right_bottom.png, bubble_right_top.png, bubble_top_left.png, bubble_top_right.png).

Changing the anchor image is simple – just replace the image “point.png” with your customly styled image (you have to use the same file name, of course). All needed calculations are done automatically.

Changing the bubble images is a bit more complicated, as you have to configure two values in the configuration of the extension. In the example image below, the red lines represent the value for “spacer” and the pink line represents the value for “spacer_2”. You have to adjust all 8 images using the same spacing.

Where do I get the vector data for my map? ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

First, you need an svg file of a map. For example you can check Google (i.e.: http://www.google.de/?q=free+svg+maps ) or Wikipedia (i.e.: http://en.wikipedia.org/wiki/Wikipedia:Blank_maps ) for free svg maps.

How do I get the vector data into my database?¶

If you open a svg file with a text editor, you get something that starts like this:

To get the data into your database, you have to do the following:

1. Create a vector map on a page and choose a size for the map (for example: height and width “500”, unit is pixel).

Create an object group in the plugin.

3. Fill in the data from the file (for this example, the correct entries would be: Title: “Bundeslaender Deutschland”, Scope height: “800”, Scope width: “591”, Scope offset x: “0.25”, Scope offset y: “0.25”).

4. Create the vector objects for the group (for this example, you would start like this: Title: “Thueringen”, Object type: “path”, Coordinates: ”M 312.004...”)

Known Bugs¶

3.0.2

Changes

Bugfixes...