Difference between revisions of "Dynamic Content Playground"

From Training Technology Lab Wiki
Jump to navigation Jump to search
Line 23: Line 23:
 
       ]
 
       ]
 
     },
 
     },
 +
    {
 +
      "name": "scaledHandlePosition",
 +
      "streams": [
 +
        {
 +
          "type": "mousemove[isDragging]",
 +
          "expr": "eventX()",
 +
          "scale": {"name": "yearsScale","invert": true}
 +
        }
 +
      ]
 +
    },
 +
    {
 +
      "name": "currentYear",
 +
      "init": 2000,
 +
      "expr": "clamp(parseInt(scaledHandlePosition),1960,2013)"
 +
    }
 +
  ],
 +
 +
  "scales": [
 +
    {
 +
      "name": "yearsScale",
 +
      "type": "linear",
 +
      "zero": false,
 +
      "domain": [1960, 2013],
 +
      "range": "width"
 +
    }
 
   ],
 
   ],
  
 
   "marks": [
 
   "marks": [
 +
    {
 +
      // draw the year label in the upper left corner
 +
      "name": "yearLabel",
 +
      "type": "text",
 +
      "properties": {
 +
        "enter": {
 +
          "x": {"value": 0},
 +
          "y": {"value": 25},
 +
          "fontSize": {"value": 32},
 +
          "fontWeight": {"value": "bold"},
 +
          "fill": {"value": "steelblue"}
 +
        },
 +
        "update": {"text": {"signal": "currentYear"} }
 +
      }
 +
    },
 
     {
 
     {
 
       // Draw a horizontal line
 
       // Draw a horizontal line
Line 47: Line 87:
 
       "properties": {
 
       "properties": {
 
         "enter": {
 
         "enter": {
          "x": {"value": 200},
 
 
           "y": {"value": 40},
 
           "y": {"value": 40},
 
           // path syntax is the same as SVG's path tag
 
           // path syntax is the same as SVG's path tag
Line 54: Line 93:
 
           "strokeWidth": {"value": 2.5}
 
           "strokeWidth": {"value": 2.5}
 
         },
 
         },
         "update": {"fill": {"value": "#fff"} },
+
         "update": {
 +
          "x": {"scale": "yearsScale","signal": "currentYear"},
 +
          "fill": {"value": "#fff"}
 +
        },
 
         // Change fill color of the object on mouse hover
 
         // Change fill color of the object on mouse hover
 
         "hover": {"fill": {"value": "#f00"} }
 
         "hover": {"fill": {"value": "#f00"} }
      }
 
    },
 
    {
 
      "name": "debugIsDragging",
 
      "type": "text",
 
      "properties": {
 
        "enter": {
 
          "x": {"value": 250},
 
          "y": {"value": 0},
 
          "fill": {"value": "black"}
 
        },
 
        "update": {"text": {"signal": "isDragging"} }
 
 
       }
 
       }
 
     }
 
     }
 
   ]
 
   ]
}
+
}
 
</graph>
 
</graph>

Revision as of 14:01, 6 March 2020

Playground for creating dynamic content on MediaWiki 1.34+

Module:Playground

Fahrenheit to Celsius
0 °F is -17.8 °C
10 °F is -12.2 °C
20 °F is -6.7 °C
30 °F is -1.1 °C
40 °F is 4.4 °C
50 °F is 10.0 °C
60 °F is 15.6 °C
70 °F is 21.1 °C
80 °F is 26.7 °C
90 °F is 32.2 °C
100 °F is 37.8 °C
Celsius to Fahrenheit
0 °C is 32.0 °F
10 °C is 50.0 °F
20 °C is 68.0 °F
30 °C is 86.0 °F
40 °C is 104.0 °F
50 °C is 122.0 °F
60 °C is 140.0 °F
70 °C is 158.0 °F
80 °C is 176.0 °F
90 °C is 194.0 °F
100 °C is 212.0 °F