2D Canvas Localizing the Map and DrawingManager

View this example full screen.

CoString of 2D Canvas Localizing the Map and DrawingManager

View this example in sandbox :
o,109.72328593151204,214.0909703111111&z,12&i,109.72328593151204,214.0909703111111,0,0,1,12,Hello%20World!

JavaScript of 2D Canvas Localizing the Map and DrawingManager

/* Languages mapping:  ( CoString Language : GMap language )
** cht : zh-TW
** chs : zh-CN
** en  : en
*/
function initialize()
{
    var oPos = new zhupiter.CoStr.Point2D(214.0909703111111, 109.72328593151204);

    //@ Map/Canvas
    var oMapOptions = {
        coStrType: zhupiter.CoStr.CoStrType.CANVAS2D,
        coStrLang: 'chs',
        center: oPos,
        zoom: 12
    };
    var oCoStrMap = new zhupiter.CoStr.Map(document.getElementById('map_canvas'), oMapOptions);

    //@ DrawingManager
    var oDmOptions = {
        coStrDmDiv: document.getElementById('drawing_manager'),
        //@ The Map coStrLang setting will be used if the coStrLang property is not given here.
        //coStrLang: 'chs',
        coStrMap: oCoStrMap
    };
    var oCoStrDm = new zhupiter.CoStr.drawing.DrawingManager(oDmOptions);

    var oInfoWindow = new zhupiter.CoStr.InfoWindow({
        //@ The Map coStrLang setting will be used if the coStrLang property is not given here.
        //coStrLang: 'chs',
        coStrMap: oCoStrMap,
        position: oPos,
        content: 'Hello World!'
    });
}

zhupiter.CoStr.event.addDomListener(window, 'load', initialize);

JavaScript + HTML of 2D Canvas Localizing the Map and DrawingManager

<!DOCTYPE html>
<html>
    <head>
        <meta name='viewport' content='initial-scale=1.0, user-scalable=no'>
        <meta charset='utf-8'>
        <title>2D Canvas Localizing the Map and DrawingManager</title>
        <style>
        html, body, #map_canvas {
        height: 100%;
        margin: 0px;
        padding: 0px
        }
        </style>
        <script src='//costr.zhupiter.com/js/?libraries=drawing'></script>
        <script>
/* Languages mapping:  ( CoString Language : GMap language )
** cht : zh-TW
** chs : zh-CN
** en  : en
*/
function initialize()
{
    var oPos = new zhupiter.CoStr.Point2D(214.0909703111111, 109.72328593151204);

    //@ Map/Canvas
    var oMapOptions = {
        coStrType: zhupiter.CoStr.CoStrType.CANVAS2D,
        coStrLang: 'chs',
        center: oPos,
        zoom: 12
    };
    var oCoStrMap = new zhupiter.CoStr.Map(document.getElementById('map_canvas'), oMapOptions);

    //@ DrawingManager
    var oDmOptions = {
        coStrDmDiv: document.getElementById('drawing_manager'),
        //@ The Map coStrLang setting will be used if the coStrLang property is not given here.
        //coStrLang: 'chs',
        coStrMap: oCoStrMap
    };
    var oCoStrDm = new zhupiter.CoStr.drawing.DrawingManager(oDmOptions);

    var oInfoWindow = new zhupiter.CoStr.InfoWindow({
        //@ The Map coStrLang setting will be used if the coStrLang property is not given here.
        //coStrLang: 'chs',
        coStrMap: oCoStrMap,
        position: oPos,
        content: 'Hello World!'
    });
}

zhupiter.CoStr.event.addDomListener(window, 'load', initialize);
        </script>
    </head>
    <body>
        <div id='drawing_manager'></div>
        <div id='map_canvas'></div>
    </body>
</html>