<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />下面的 JSL 建立兩個位圖：彩虹色背景和 Mandelbrot 形狀遮罩。兩個點陣圖被添加到圖形中，並且彩虹在蒙版下移動。它非常快，因為點陣圖僅創建一次，並且作業系統提供對遮罩透明孔的支援。
遮罩中的透明孔是使用 alpha 層創建的，與紅色、綠色和藍色層類似。Alpha 是一個介於 0 和 1 之間的數字，用於確定先前繪製的像素之上渲染時像素的透明/不透明程度。在此範例中，alpha 為零（透明）或一（不透明）。您可以將點陣圖與中間值混合。
JSL 的內嵌版本經過調整，用於製作影片的點陣圖。附加檔案在運行時看起來可能會更好一些，因為它使用計時器來確定接下來要顯示的幀。
克雷格·黑爾斯 - YouTube
https://www.youtube.com/watch?v=NA-O0YbehpQ
// 此範例示範了製作帶孔圖像的一種方法。
// 大多數圖像只使用紅色、綠色和藍色（如背景彩虹）
// 下圖）。一些圖像添加 Alpha 作為第四個通道來描述
// 不透明或透明。JMP 使用 1 表示不透明。
//
規模= 35； // 整體尺寸
nr = 20 * 規模； // 縱橫比
nc = 25 * 比例； // 縱橫比
// 像素最初建立在矩陣中，使用 J 函數分配
傳輸 = J( nr, nc, 0 );
// 使用 mandelbrot 函數填滿像素。使用並行分配
// 為了速度而不是巢狀循環。
並行分配(
{nr = N 行( transp ), nr2 = N 行( transp ) / 2,
nc = N 列( transp ), nc3 = N 列( transp ) / 1.3333, limit = 1000},
transp[r, c] = Mandelbrot( limit, 4, // 從 1..limit 回傳整數答案
2 * (c - nc3) / Sqrt( nr * nc ), // 將矩陣行、列縮放到感興趣的空間
2 * (r - nr2) / Sqrt( nr * nc ) ) / limit // 除以極限比例 0..1
）；
// 下一行是重要的一行。該影像是使用 4 個資料通道建立的，
// 紅色、綠色、藍色和 Alpha。因為 r、g、b 使用相同的「transp」值
// 圖像是灰階的，但由於來自 Mandelbrot() 的數據，你不會看到太多
// 蒙版中的灰色...只有黑色。將 2nd transp 改為 1-transp 你會看到
// 綠色蒙版。但重要的參數是 transp<.5，它創造了 alpha
// 頻道。transp 是由 0 到 1 之間的值所組成的矩形矩陣；高價值
// 是曼德布羅集合內的平坦區域，低值在外部。轉運<.5
// 外部為 true，即 1，內部為 false，即 0。這使得一個矩形陣列
// alpha 為 0 或 1：1 是遮罩，0 是透明。（alpha 可以是小數
// 這將混合點陣圖。這裡不使用它。）
transpImage = 新影像( "rgba", {transp, transp, transp, transp < .5} );
// 此範例不使用已儲存的圖像，但您可以像這樣使用 png
// 例如，如果您使用 Gimp 開啟它，則儲存具有透明度。
// 測試: transpimage << saveimage( "\\VBOXSVR\windowsShare\transparent\test.png", "png" );
// 建立一個視窗來儲存動畫和一個圖形框來儲存點陣圖。
// 在 JMP 中顯示透明位圖的最佳選擇是在圖表中
// 因為其他有點陣圖的顯示框並不真正希望彼此重疊。
新視窗(“透明度”,
gb = Graph Box(framesize( nc + 20, nr + 20 ), // 周圍有 10 個像素彩虹邊框
<<背景顏色(“紅色”))); // 在新增第二張圖片之前您可能會看到紅色
// 將第一張影像插入影格並取得影像片段的句柄
gb[framebox( 1 )] << addimage( 映像( transpimage ) );
transpSeg = gb[framebox( 1 )] << childseg;
// 定位它；這個「面具」只被定位一次，就在這裡
transpSeg << 移動( 50, 50 );
//
//
// 製作第二個沒有任何透明度的彩虹圖片
背景 = J( nr * 2, nc * 2, 0 ); // 捲動的額外內容。製作一些彩虹像素...
並行分配(
{nr = N 行（背景），nc = N 列（背景）}，
背景[r, c] = RGB 顏色( (Sin( r / 70 ) + 1) / 2, (Sin( c / 50 ) + 1) / 2, Sin( (r + c) / 60 ) )
）；
// 將像素轉換為點陣圖影像，加入到影格中，取得句柄
背景圖像 = 新圖像（背景）；
gb[framebox( 1 )] << addimage( 映像( 背景圖片 ) );
背景段 = gb[framebox( 1 )] << childseg;
//
wait(.1);// 確保視窗在循環開始之前打開
//
開始=0； // 利用時間創造更流暢的動畫
幀=0；
while( start < 30, // 運行 30 秒
位置=開始； // 用作 sin 和 cos 的弧度參數...
開始=開始+1/30；
x = 50 + 50 * Sin( 位置 * .39 ); // 使用任意縮放
y = 50 + 50 * Cos( 位置 * .27 ); // 藝術許可
// 好吧，這很笨拙；看來移動方法需要幫助評估...
// EvalExpr 檢視其參數並蒐索要計算的 Expr。
// EvalExpr 傳回一個仍需要計算的表達式
Eval( Eval Expr(backgroundseg << move( Expr( x ), Expr( y ) ) ) );
// gb<<無效;等待（0）；動畫因等待而變得不完整（允許互動）
gb << 更新視窗； // 這是非常流暢的動畫，但不是互動的
//製作圖片：gb << savepicture("\\VBOXSVR\windowsShare\transparent\v\v"||right(char(frame++,9),9,"0")||".png", "png" ）；
）；
//
// 更多想法（未經測試，讓我們知道會發生什麼）：
// 設定圖形框的 xscale 和 yscale 以符合幀大小
// 如果你想以精確的像素工作。
// 嘗試使用 0.5 左右的 alpha 值來混合影像。
// 將圖中其他要繪製的線段排列在 mask 線段之前；
// 標記段可以透過遮罩中的孔出現。電影雙筒望遠鏡。
// 移動遮罩而不是資料。
// 具有透明度的多層。使用視差理念的側滾軸。
// 使用 MouseTrap 拖曳遮罩。
// 嘗試旋轉蒙版，也許還可以使用 MouseTrap，這取決於單擊的距離
// 從掩模的中心開始。
