Put the MapMyTri.com Mapping Tool on your Website

There are two parts to setting up your website to use the MapMyTri.com Mapping Tool:

HTML / Javascript Snippet to be included in your web page
JSON Configuration File which is a configuration file

HTML / Javascript Snippet

Please copy / paste the html / javascript code below. You should insert this code in the page in which you would like to insert the MapMyTri.com Mapping Tool.

<script src="http://ws.mapmyfitness.com/route_engine/2/" language="javascript" type="text/javascript"></script> <div id="map_engine" style="width:500px;height:800px;border:1px solid #999;"></div> <script language="javascript" type="text/javascript">mmfInit('map_engine', MMF_COBRAND_PAGE);</script> <noscript> Javascript is required to view the MapMyTri.com Mapping Tool MapMyTri.com provides triathletes easy-to-use tools to get healthy and exercise more effectively! [<a href="http://www.mapmytri.com">map your training route</a>] </noscript>

JSON Configuration File (mmf_settings.json)

The mmf_settings.json configuration file is an extremely important part to setting up your partner iframe importantly. This configuration file is required for your MapMyTri.com Mapping Tool to work.

Here are the contents of a sample mmf_settings.json file:

/* Sample Configuration Settings */ var mmf_style_settings = { /* Master style scheme within the iframe */ css: "http://ws.mapmyfitness.com/route_engine/2/engine/css/green.css", /* css: "http://ws.mapmyfitness.com/route_engine/2/engine/css/blue.css", */ /* Form Target: _parent, _blank */ target: "_blank", url: "http://www.mapmytri.com", /* RouteType: run, walk, ride, hike, tri */ RouteType: "workout", /* Polyline style info */ LineColor: "#3366ff", LineWeight: 3.0, LineOpacity: 0.7, /* Regional settings */ Metric: false, /* Distance display settings */ /* For cycling, markers every 5 miles (or 5km if metric is selected) */ MarkerDistanceImperial: (1609.344 * 1), MarkerDistanceMetric: 1000 /* MarkerDistanceImperial: (1609.344 * 5), MarkerDistanceMetric: 5000 */ };

IMPORTANT! The mmf_settings.json file should reside in the exact same directory as the page that has the html / javascript embed code above.

Examples

For more information about our co-branding tools, or to submit an RFP for a custom integration project, please contact us using our feedback form.