blocklyでobjectを動かす。その18

1928 ワード
leaflet Blockly Plunker leaflet テキストリンク

概要

blocklyでobjectを動かす。
leafletにmarkerを立ててみる。

stageを書く。

function marker(src) {
  var line = src.split(",");
  L.marker([line[0], line[1]], {
    title: line[2]
  }).addTo(map);
}
var map = L.map('map').setView([35.65858404, 139.74543162], 12);
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
    attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);

objectを書く。


Blockly.Blocks.marker = {
    init: function() {
        this.jsonInit({
        message0: "marker %1",
        args0: [{
            type: "input_value",
            name: "TEXT"
        }],
        previousStatement: null,
        nextStatement: null,
        style: "text_blocks",
        tooltip: Blockly.Msg.TEXT_PRINT_TOOLTIP,
        helpUrl: Blockly.Msg.TEXT_PRINT_HELPURL
    })
}};

Blockly.JavaScript.marker = function(a) {
    return "marker(" + (Blockly.JavaScript.valueToCode(a, "TEXT", Blockly.JavaScript.ORDER_NONE) || "''") + ");\n"
};

フローを書く。

写真

成果物

以上。