chartJSでアニメーション円グラフをダイアログ表示 v2.scptd

Posted on 6月 30, 2020 by Takaaki Naganoya

アラートダイアログ上にWkWebViewを作成し、その上でChart.jsによる円グラフを表示するAppleScriptです。

▲実行するとテーマ選択ののちにグラフ表示を行います

–> Download chartJSPieChartDemo.scptd(Script Bundle with Lirbrary and HTML)

Chart.jsは、ダイアグラムやフローチャートなどを描画するJavaScriptのライブラリです。割とデータのカスタマイズがしやすい感じです。

AppleScript名：chartJSでアニメーション円グラフをダイアログ表示 v2.scptd

—
–　　Created by: Takaaki Naganoya
–　　Created on: 2020/06/26
—
–　　Copyright © 2020 Piyomaru Software, All Rights Reserved
—
use AppleScript version "2.4" — Yosemite (10.10) or later
use framework "Foundation"
use scripting additions
use webD : script "webDialogLib"

set aRes to first item of (choose from list {"light1", "light2", "dark1", "dark2"} with prompt "Choose theme")

set aList to {{y:45.43, label:"Chrome"}, {y:32.4, label:"Safari"}, {y:6.67, label:"Firefox"}, {y:5.41, label:"Microsoft Edge"}, {y:5.26, label:"Internet Explorer"}, {y:1.19, label:"Samsung Internet"}}
set myTitle to "Desktop Browser Market Share in Japan May 2020"

–https://canvasjs.com/javascript-charts/pie-chart-legends/
set mePath to path to me
set resPath to (mePath as string) & "Contents:Resources:index.html"
set myStr to (read (resPath as alias) as «class utf8») as string

set aJsonStr to array2DToJSONArray(aList) of me
set aString to current application’s NSString’s stringWithFormat_(myStr, aRes as string, myTitle, aJsonStr) as string

set paramObj to {myMessage:"Animation Pie Chart", mySubMessage:"This is a canvasJS test", htmlStr:aString, jsDelimiters:{"<script>", "</script>"}, viewSize:{900, 620}}

webD’s displayWebDialog(paramObj)

on array2DToJSONArray(aList)
　　set anArray to current application’s NSMutableArray’s arrayWithArray:aList
　　set jsonData to current application’s NSJSONSerialization’s dataWithJSONObject:anArray options:(0 as integer) |error|:(missing value)
　　set resString to current application’s NSString’s alloc()’s initWithData:jsonData encoding:(current application’s NSUTF8StringEncoding)
　　return resString
end array2DToJSONArray

★Click Here to Open This Script　

Mermaid.jsでPie Chartをダイアログ表示

Posted on 6月 28, 2020 by Takaaki Naganoya

アラートダイアログ上にWkWebViewを作成し、その上でMermaid.jsによる円グラフを表示するAppleScriptです。

–> Download mermaidPieChart.scptd(Script Bundle with Script Library)

Mermaid.jsは、ダイアグラムやフローチャートなどを描画するJavaScriptのライブラリです。Markdownのような簡略式のテキストを記述するだけで各種のグラフを描画できることを特徴としています。

AppleScriptのワークフローにおいて、このようなグラフ表示をAppleScript単体で（アプリケーションを介さないで）行う意義については、処理結果の報告などが考えられます。そうした用途においては表示の派手さではなくAS側から意図したデータを表示させやすいかどうかということは重要です。その意味で本ライブラリは用途に叶うものといえます。

反面、派手なアニメーションなどは行いません。何か、他のライブラリと組み合わせるとアニメーションを実現できるのかもしれませんが……。

AppleScript名：Mermaid.jsでPie Chartをダイアログ表示.scptd

set aList to {{label:"すごくいい", value:300}, {label:"まあまあ", value:200}, {label:"なんとなく", value:100}}
set myTitle to "集計結果"

set dataStr to ""
repeat with i in aList
　　set aLabel to label of i
　　set aVal to value of i
　　set dataStr to dataStr & "＼"" & aLabel & "＼"" & " : " & (aVal as string) & return
end repeat

–http://mermaid-js.github.io/mermaid/#/pie
set mePath to path to me
set resPath to (mePath as string) & "Contents:Resources:index.html"
set myStr to "<!DOCTYPE html>
<html lang=＼"en＼">
<head>
<meta charset=＼"utf-8＼">
</head>
<body>
<div class=＼"mermaid＼">
pie title %@
%@
</div>
<script src=＼"https://cdnjs.cloudflare.com/ajax/libs/mermaid/8.5.2/mermaid.min.js＼"></script>
<script>mermaid.initialize({startOnLoad:true});</script>
</body>
</html>"

set aString to current application’s NSString’s stringWithFormat_(myStr, myTitle, dataStr) as string

set paramObj to {myMessage:"Pie Chart", mySubMessage:"This is a mermaid test", htmlStr:aString, jsDelimiters:{"<script>", "</script>"}, viewSize:{800, 480}}

webD’s displayWebDialog(paramObj)

★Click Here to Open This Script　

AMChartsでワードクラウドをダイアログ上に表示 v2

Posted on 6月 27, 2020 by Takaaki Naganoya

アラートダイアログ上にWkWebViewを作成し、その上でAMChartsによるWord Cloudを表示するAppleScriptです。

–> Download am_wordcloud.zip(AppleScript Bundle with Library and HTML)

AMChartsのワードクラウドの表示ロジックがちょっと「？」な仕様でした。英文のテキスト（単語がスペースで区切られている）をそのまま渡すとJavaScript側でParseして度数集計を行なって表示するようになっています。

集計済みのデータを渡して表示させる仕様ではなかったので、集計したデータをわざとテキストに展開して渡しています。非効率的な仕組みですが、スピードは遅くないので使っています。

ただし、その仕様の影響で「Script Editor」といった半角スペースを含む単語についてはスペースをハイフンに置換して「Script-Editor」のようにして処理しています。
→ と、自分で書いておいて「そんなバカな」と感じたので、再度AMChartsのドキュメントを読んでみたら、ちゃんとstructured dataを使うという項目があり、集計済みデータを処理できるとのこと。

AppleScript名：AMChartsでワードクラウドをダイアログ上に表示 v2.scptd

—
–　　Created by: Takaaki Naganoya
–　　Created on: 2020/06/23
—
–　　Copyright © 2020 Piyomaru Software, All Rights Reserved
—
use AppleScript version "2.4" — Yosemite (10.10) or later
use framework "Foundation"
use scripting additions
use webD : script "webDialogLib"

script tagStorage
　　property aList : {}
end script

set aRecArray to {{|word|:"NSString", |count|:97}, {|word|:"NSURL", |count|:78}, {|word|:"Keynote", |count|:52}, {|word|:"NSMutableArray", |count|:51}, {|word|:"NSAlert", |count|:50}, {|word|:"NSRunningApplication", |count|:49}, {|word|:"NSArray", |count|:48}, {|word|:"CotEditor", |count|:44}, {|word|:"NSColor", |count|:44}, {|word|:"Finder", |count|:41}, {|word|:"NSImage", |count|:39}, {|word|:"Numbers", |count|:38}, {|word|:"NSPredicate", |count|:34}, {|word|:"NSView", |count|:32}, {|word|:"NSButton", |count|:28}, {|word|:"Safari", |count|:28}, {|word|:"NSScreen", |count|:27}, {|word|:"iTunes", |count|:25}, {|word|:"NSUTF8StringEncoding", |count|:24}, {|word|:"NSDictionary", |count|:22}, {|word|:"NSScrollView", |count|:21}, {|word|:"NSBitmapImageRep", |count|:20}, {|word|:"NSFileManager", |count|:20}, {|word|:"NSMutableDictionary", |count|:19}, {|word|:"NSURLRequest", |count|:18}, {|word|:"NSUUID", |count|:18}, {|word|:"NSWindow", |count|:17}, {|word|:"NSBezierPath", |count|:16}, {|word|:"NSFont", |count|:16}, {|word|:"WKWebView", |count|:16}, {|word|:"WKWebViewConfiguration", |count|:16}, {|word|:"NSWorkspace", |count|:15}, {|word|:"Pages", |count|:15}, {|word|:"Script Editor", |count|:15}, {|word|:"System Events", |count|:15}, {|word|:"WKUserContentController", |count|:15}, {|word|:"WKUserScript", |count|:15}, {|word|:"NSAlertSecondButtonReturn", |count|:14}, {|word|:"NSJSONSerialization", |count|:14}, {|word|:"NSSortDescriptor", |count|:14}}

set (aList of tagStorage) to {}

repeat with i in aRecArray
　　set aW to |word| of i
　　set aCount to |count| of i
　　
　　set bW to repChar(aW, " ", "-") of me
　　
　　repeat aCount times
　　　　set the end of (aList of tagStorage) to bW
　　end repeat
end repeat

set tRes to retDelimedText((aList of tagStorage), " ") of me

–https://www.amcharts.com/demos/word-cloud/
set mePath to path to me
set resPath to (mePath as string) & "Contents:Resources:index.html"
set myStr to read (resPath as alias) as «class utf8»

set aString to current application’s NSString’s stringWithFormat_(myStr, tRes) as string

set paramObj to {myMessage:"Word Cloud", mySubMessage:"This is a AMCharts test", htmlStr:aString, jsDelimiters:{"<script>", "</script>"}, viewSize:{800, 520}}

webD’s displayWebDialog(paramObj)

on retDelimedText(aList, aDelim)
　　set aText to ""
　　set curDelim to AppleScript’s text item delimiters
　　set AppleScript’s text item delimiters to aDelim
　　set aText to aList as text
　　set AppleScript’s text item delimiters to curDelim
　　return aText
end retDelimedText

–文字置換
on repChar(origText as string, targChar as string, repChar as string)
　　set curDelim to AppleScript’s text item delimiters
　　set AppleScript’s text item delimiters to targChar
　　set tmpList to text items of origText
　　set AppleScript’s text item delimiters to repChar
　　set retText to tmpList as string
　　set AppleScript’s text item delimiters to curDelim
　　return retText
end repChar

★Click Here to Open This Script　

AMChartsで円グラフをダイアログ上に表示 v3

Posted on 6月 27, 2020 by Takaaki Naganoya

アラートダイアログ上にWkWebViewを作成し、その上でAMChartsによる円グラフを表示するAppleScriptです。

ダイアログでテーマ選択したのちに、グラフ表示を行います。

—> Download ampiechartSample(AppleScript bundle with Script Library and HTMLs)

AppleScript名：AMChartsで円グラフをダイアログ上に表示 v3.scptd

—
–　　Created by: Takaaki Naganoya
–　　Created on: 2020/06/25
—
–　　Copyright © 2020 Piyomaru Software, All Rights Reserved
—
use AppleScript version "2.4" — Yosemite (10.10) or later
use framework "Foundation"
use scripting additions
use webD : script "webDialogLib"

set themeList to {"dark", "dataviz", "material", "kelly", "frozen", "moonrisekingdom", "spiritedaway"}

set aSel to (choose from list themeList with prompt "Select Theme")
if aSel = false then
　　set aTheme to false
　　set aHTML to "index_notheme.html"
else
　　set aTheme to contents of first item of aSel
　　if aTheme = "dark" then
　　　　set aTheme to false
　　　　set aHTML to "index_dark.html"
　　else
　　　　set aHTML to "index.html"
　　end if
end if

set aList to {{label:"ひよこ王国", value:403}, {label:"ぴよぴよ連邦", value:301}, {label:"ぴよランド", value:101}, {label:"ぴよー", value:65}}
set bList to sortRecListByLabel(aList, {"value"}, {false}) of me –降順ソート

–https://www.amcharts.com/demos/pie-chart/
set mePath to path to me
set resPath to (mePath as string) & "Contents:Resources:" & aHTML
set myStr to (read (resPath as alias) as «class utf8») as string

set jsonStr to array2DToJSONArray(bList) of me as string

if aTheme = false then
　　set aString to current application’s NSString’s stringWithFormat_(myStr, jsonStr) as string
else
　　set aString to current application’s NSString’s stringWithFormat_(myStr, aTheme, aTheme, jsonStr) as string
end if

set paramObj to {myMessage:"Simple Pie Chart", mySubMessage:"This is a AMCharts test", htmlStr:aString, jsDelimiters:{"<script>", "</script>"}, viewSize:{1000, 550}}

webD’s displayWebDialog(paramObj)

–リストに入れたレコードを、指定の属性ラベルの値でソート
on sortRecListByLabel(aRecList as list, aLabelStr as list, ascendF as list)
　　set aArray to current application’s NSArray’s arrayWithArray:aRecList
　　
　　set aCount to length of aLabelStr
　　set sortDescArray to current application’s NSMutableArray’s new()
　　repeat with i from 1 to aCount
　　　　set aLabel to (item i of aLabelStr)
　　　　set aKey to (item i of ascendF)
　　　　set sortDesc to (current application’s NSSortDescriptor’s alloc()’s initWithKey:aLabel ascending:aKey)
　　　　(sortDescArray’s addObject:sortDesc)
　　end repeat
　　
　　return (aArray’s sortedArrayUsingDescriptors:sortDescArray) as list
end sortRecListByLabel

★Click Here to Open This Script　

AMChartsでバブルチャート＋世界地図をダイアログ上に表示 v2

Posted on 6月 26, 2020 by Takaaki Naganoya

アラートダイアログ上にWkWebViewを作成し、その上でAMChartsによるバブルチャートつき世界地図を表示するAppleScriptです。

–> Download amBubbleMap.zip(Script Bundle with AppleScript Library and HTML)

表示用のデータをAppleScriptのRecord（をListに入れたもの）に変換して、外部から供給するようにして、表示するさいにJSONに変換してHTMLに差し込んで表示しています。

正直、record形式にすると編集が大変なような気がするので、プログラムリスト中から外部に追い出して、plistとかJSONとかいろいろ他の形式で保持しておくといいと思います。もちろん、AppleScriptらしくNumbersの表データ中にデータを展開してもよいのですが、「ならNumbersでグラフ表示させたほうがよいのでは？」というところなので、あえて触れませんでした。

AMChart掲載のグラフはデータを差し込みやすくていいですね。

AppleScript名：AMChartsでバブルチャート＋世界地図をダイアログ上に表示 v2.scptd

set aList to retData() of me
set jStr to array2DToJSONArray(aList) of me as string

–https://www.zingchart.com/
set mePath to path to me
set resPath to (mePath as string) & "Contents:Resources:index.html"
set myStr to read (resPath as alias) as «class utf8»

set aString to current application’s NSString’s stringWithFormat_(myStr, jStr) as string

set paramObj to {myMessage:"Map with Bubbles", mySubMessage:"This is a AMCharts test", htmlStr:aString, jsDelimiters:{"<script>", "</script>"}, viewSize:{1000, 620}}

webD’s displayWebDialog(paramObj)

on retData()
　　return {{|id|:"AF", |name|:"Afghanistan", value:32358260, |color|:"#ff0000"}, {|id|:"AL", |name|:"Albania", value:3215988, |color|:"#00ff00"}, {|id|:"DZ", |name|:"Algeria", value:35980193, |color|:"#0000ff"}, {|id|:"AO", |name|:"Angola", value:19618432, |color|:"#0000ff"}, {|id|:"AR", |name|:"Argentina", value:40764561, |color|:"#ffff00"}, {|id|:"AM", |name|:"Armenia", value:3100236, |color|:"#00ff00"}, {|id|:"AU", |name|:"Australia", value:22605732, |color|:"#8aabb0"}, {|id|:"AT", |name|:"Austria", value:8413429, |color|:"#00ff00"}, {|id|:"AZ", |name|:"Azerbaijan", value:9306023, |color|:"#00ff00"}, {|id|:"BH", |name|:"Bahrain", value:1323535, |color|:"#ff0000"}, {|id|:"BD", |name|:"Bangladesh", value:150493658, |color|:"#ff0000"}, {|id|:"BY", |name|:"Belarus", value:9559441, |color|:"#00ff00"}, {|id|:"BE", |name|:"Belgium", value:10754056, |color|:"#00ff00"}, {|id|:"BJ", |name|:"Benin", value:9099922, |color|:"#0000ff"}, {|id|:"BT", |name|:"Bhutan", value:738267, |color|:"#ff0000"}, {|id|:"BO", |name|:"Bolivia", value:10088108, |color|:"#ffff00"}, {|id|:"BA", |name|:"Bosnia and Herzegovina", value:3752228, |color|:"#00ff00"}, {|id|:"BW", |name|:"Botswana", value:2030738, |color|:"#0000ff"}, {|id|:"BR", |name|:"Brazil", value:196655014, |color|:"#ffff00"}, {|id|:"BN", |name|:"Brunei", value:405938, |color|:"#ff0000"}, {|id|:"BG", |name|:"Bulgaria", value:7446135, |color|:"#00ff00"}, {|id|:"BF", |name|:"Burkina Faso", value:16967845, |color|:"#0000ff"}, {|id|:"BI", |name|:"Burundi", value:8575172, |color|:"#0000ff"}, {|id|:"KH", |name|:"Cambodia", value:14305183, |color|:"#ff0000"}, {|id|:"CM", |name|:"Cameroon", value:20030362, |color|:"#0000ff"}, {|id|:"CA", |name|:"Canada", value:34349561, |color|:"#888822"}, {|id|:"CV", |name|:"Cape Verde", value:500585, |color|:"#0000ff"}, {|id|:"CF", |name|:"Central African Rep.", value:4486837, |color|:"#0000ff"}, {|id|:"TD", |name|:"Chad", value:11525496, |color|:"#0000ff"}, {|id|:"CL", |name|:"Chile", value:17269525, |color|:"#ffff00"}, {|id|:"CN", |name|:"China", value:1.347565324E+9, |color|:"#ff0000"}, {|id|:"CO", |name|:"Colombia", value:46927125, |color|:"#ffff00"}, {|id|:"KM", |name|:"Comoros", value:753943, |color|:"#0000ff"}, {|id|:"CD", |name|:"Congo, Dem. Rep.", value:67757577, |color|:"#0000ff"}, {|id|:"CG", |name|:"Congo, Rep.", value:4139748, |color|:"#0000ff"}, {|id|:"CR", |name|:"Costa Rica", value:4726575, |color|:"#888822"}, {|id|:"CI", |name|:"Cote d’Ivoire", value:20152894, |color|:"#0000ff"}, {|id|:"HR", |name|:"Croatia", value:4395560, |color|:"#00ff00"}, {|id|:"CU", |name|:"Cuba", value:11253665, |color|:"#888822"}, {|id|:"CY", |name|:"Cyprus", value:1116564, |color|:"#00ff00"}, {|id|:"CZ", |name|:"Czech Rep.", value:10534293, |color|:"#00ff00"}, {|id|:"DK", |name|:"Denmark", value:5572594, |color|:"#00ff00"}, {|id|:"DJ", |name|:"Djibouti", value:905564, |color|:"#0000ff"}, {|id|:"DO", |name|:"Dominican Rep.", value:10056181, |color|:"#888822"}, {|id|:"EC", |name|:"Ecuador", value:14666055, |color|:"#ffff00"}, {|id|:"EG", |name|:"Egypt", value:82536770, |color|:"#0000ff"}, {|id|:"SV", |name|:"El Salvador", value:6227491, |color|:"#888822"}, {|id|:"GQ", |name|:"Equatorial Guinea", value:720213, |color|:"#0000ff"}, {|id|:"ER", |name|:"Eritrea", value:5415280, |color|:"#0000ff"}, {|id|:"EE", |name|:"Estonia", value:1340537, |color|:"#00ff00"}, {|id|:"ET", |name|:"Ethiopia", value:84734262, |color|:"#0000ff"}, {|id|:"FJ", |name|:"Fiji", value:868406, |color|:"#8aabb0"}, {|id|:"FI", |name|:"Finland", value:5384770, |color|:"#00ff00"}, {|id|:"FR", |name|:"France", value:63125894, |color|:"#00ff00"}, {|id|:"GA", |name|:"Gabon", value:1534262, |color|:"#0000ff"}, {|id|:"GM", |name|:"Gambia", value:1776103, |color|:"#0000ff"}, {|id|:"GE", |name|:"Georgia", value:4329026, |color|:"#00ff00"}, {|id|:"DE", |name|:"Germany", value:82162512, |color|:"#00ff00"}, {|id|:"GH", |name|:"Ghana", value:24965816, |color|:"#0000ff"}, {|id|:"GR", |name|:"Greece", value:11390031, |color|:"#00ff00"}, {|id|:"GT", |name|:"Guatemala", value:14757316, |color|:"#888822"}, {|id|:"GN", |name|:"Guinea", value:10221808, |color|:"#0000ff"}, {|id|:"GW", |name|:"Guinea-Bissau", value:1547061, |color|:"#0000ff"}, {|id|:"GY", |name|:"Guyana", value:756040, |color|:"#ffff00"}, {|id|:"HT", |name|:"Haiti", value:10123787, |color|:"#888822"}, {|id|:"HN", |name|:"Honduras", value:7754687, |color|:"#888822"}, {|id|:"HK", |name|:"Hong Kong, China", value:7122187, |color|:"#ff0000"}, {|id|:"HU", |name|:"Hungary", value:9966116, |color|:"#00ff00"}, {|id|:"IS", |name|:"Iceland", value:324366, |color|:"#00ff00"}, {|id|:"IN", |name|:"India", value:1.24149196E+9, |color|:"#ff0000"}, {|id|:"ID", |name|:"Indonesia", value:242325638, |color|:"#ff0000"}, {|id|:"IR", |name|:"Iran", value:74798599, |color|:"#ff0000"}, {|id|:"IQ", |name|:"Iraq", value:32664942, |color|:"#ff0000"}, {|id|:"IE", |name|:"Ireland", value:4525802, |color|:"#00ff00"}, {|id|:"IL", |name|:"Israel", value:7562194, |color|:"#ff0000"}, {|id|:"IT", |name|:"Italy", value:60788694, |color|:"#00ff00"}, {|id|:"JM", |name|:"Jamaica", value:2751273, |color|:"#888822"}, {|id|:"JP", |name|:"Japan", value:126497241, |color|:"#ff0000"}, {|id|:"JO", |name|:"Jordan", value:6330169, |color|:"#ff0000"}, {|id|:"KZ", |name|:"Kazakhstan", value:16206750, |color|:"#ff0000"}, {|id|:"KE", |name|:"Kenya", value:41609728, |color|:"#0000ff"}, {|id|:"KP", |name|:"Korea, Dem. Rep.", value:24451285, |color|:"#ff0000"}, {|id|:"KR", |name|:"Korea, Rep.", value:48391343, |color|:"#ff0000"}, {|id|:"KW", |name|:"Kuwait", value:2818042, |color|:"#ff0000"}, {|id|:"KG", |name|:"Kyrgyzstan", value:5392580, |color|:"#ff0000"}, {|id|:"LA", |name|:"Laos", value:6288037, |color|:"#ff0000"}, {|id|:"LV", |name|:"Latvia", value:2243142, |color|:"#00ff00"}, {|id|:"LB", |name|:"Lebanon", value:4259405, |color|:"#ff0000"}, {|id|:"LS", |name|:"Lesotho", value:2193843, |color|:"#0000ff"}, {|id|:"LR", |name|:"Liberia", value:4128572, |color|:"#0000ff"}, {|id|:"LY", |name|:"Libya", value:6422772, |color|:"#0000ff"}, {|id|:"LT", |name|:"Lithuania", value:3307481, |color|:"#00ff00"}, {|id|:"LU", |name|:"Luxembourg", value:515941, |color|:"#00ff00"}, {|id|:"MK", |name|:"Macedonia, FYR", value:2063893, |color|:"#00ff00"}, {|id|:"MG", |name|:"Madagascar", value:21315135, |color|:"#0000ff"}, {|id|:"MW", |name|:"Malawi", value:15380888, |color|:"#0000ff"}, {|id|:"MY", |name|:"Malaysia", value:28859154, |color|:"#ff0000"}, {|id|:"ML", |name|:"Mali", value:15839538, |color|:"#0000ff"}, {|id|:"MR", |name|:"Mauritania", value:3541540, |color|:"#0000ff"}, {|id|:"MU", |name|:"Mauritius", value:1306593, |color|:"#0000ff"}, {|id|:"MX", |name|:"Mexico", value:114793341, |color|:"#888822"}, {|id|:"MD", |name|:"Moldova", value:3544864, |color|:"#00ff00"}, {|id|:"MN", |name|:"Mongolia", value:2800114, |color|:"#ff0000"}, {|id|:"ME", |name|:"Montenegro", value:632261, |color|:"#00ff00"}, {|id|:"MA", |name|:"Morocco", value:32272974, |color|:"#0000ff"}, {|id|:"MZ", |name|:"Mozambique", value:23929708, |color|:"#0000ff"}, {|id|:"MM", |name|:"Myanmar", value:48336763, |color|:"#ff0000"}, {|id|:"NA", |name|:"Namibia", value:2324004, |color|:"#0000ff"}, {|id|:"NP", |name|:"Nepal", value:30485798, |color|:"#ff0000"}, {|id|:"NL", |name|:"Netherlands", value:16664746, |color|:"#00ff00"}, {|id|:"NZ", |name|:"New Zealand", value:4414509, |color|:"#8aabb0"}, {|id|:"NI", |name|:"Nicaragua", value:5869859, |color|:"#888822"}, {|id|:"NE", |name|:"Niger", value:16068994, |color|:"#0000ff"}, {|id|:"NG", |name|:"Nigeria", value:162470737, |color|:"#0000ff"}, {|id|:"NO", |name|:"Norway", value:4924848, |color|:"#00ff00"}, {|id|:"OM", |name|:"Oman", value:2846145, |color|:"#ff0000"}, {|id|:"PK", |name|:"Pakistan", value:176745364, |color|:"#ff0000"}, {|id|:"PA", |name|:"Panama", value:3571185, |color|:"#888822"}, {|id|:"PG", |name|:"Papua New Guinea", value:7013829, |color|:"#8aabb0"}, {|id|:"PY", |name|:"Paraguay", value:6568290, |color|:"#ffff00"}, {|id|:"PE", |name|:"Peru", value:29399817, |color|:"#ffff00"}, {|id|:"PH", |name|:"Philippines", value:94852030, |color|:"#ff0000"}, {|id|:"PL", |name|:"Poland", value:38298949, |color|:"#00ff00"}, {|id|:"PT", |name|:"Portugal", value:10689663, |color|:"#00ff00"}, {|id|:"PR", |name|:"Puerto Rico", value:3745526, |color|:"#888822"}, {|id|:"QA", |name|:"Qatar", value:1870041, |color|:"#ff0000"}, {|id|:"RO", |name|:"Romania", value:21436495, |color|:"#00ff00"}, {|id|:"RU", |name|:"Russia", value:142835555, |color|:"#00ff00"}, {|id|:"RW", |name|:"Rwanda", value:10942950, |color|:"#0000ff"}, {|id|:"SA", |name|:"Saudi Arabia", value:28082541, |color|:"#ff0000"}, {|id|:"SN", |name|:"Senegal", value:12767556, |color|:"#0000ff"}, {|id|:"RS", |name|:"Serbia", value:9853969, |color|:"#00ff00"}, {|id|:"SL", |name|:"Sierra Leone", value:5997486, |color|:"#0000ff"}, {|id|:"SG", |name|:"Singapore", value:5187933, |color|:"#ff0000"}, {|id|:"SK", |name|:"Slovak Republic", value:5471502, |color|:"#00ff00"}, {|id|:"SI", |name|:"Slovenia", value:2035012, |color|:"#00ff00"}, {|id|:"SB", |name|:"Solomon Islands", value:552267, |color|:"#8aabb0"}, {|id|:"SO", |name|:"Somalia", value:9556873, |color|:"#0000ff"}, {|id|:"ZA", |name|:"South Africa", value:50459978, |color|:"#0000ff"}, {|id|:"ES", |name|:"Spain", value:46454895, |color|:"#00ff00"}, {|id|:"LK", |name|:"Sri Lanka", value:21045394, |color|:"#ff0000"}, {|id|:"SD", |name|:"Sudan", value:34735288, |color|:"#0000ff"}, {|id|:"SR", |name|:"Suriname", value:529419, |color|:"#ffff00"}, {|id|:"SZ", |name|:"Swaziland", value:1203330, |color|:"#0000ff"}, {|id|:"SE", |name|:"Sweden", value:9440747, |color|:"#00ff00"}, {|id|:"CH", |name|:"Switzerland", value:7701690, |color|:"#00ff00"}, {|id|:"SY", |name|:"Syria", value:20766037, |color|:"#ff0000"}, {|id|:"TW", |name|:"Taiwan", value:23072000, |color|:"#ff0000"}, {|id|:"TJ", |name|:"Tajikistan", value:6976958, |color|:"#ff0000"}, {|id|:"TZ", |name|:"Tanzania", value:46218486, |color|:"#0000ff"}, {|id|:"TH", |name|:"Thailand", value:69518555, |color|:"#ff0000"}, {|id|:"TG", |name|:"Togo", value:6154813, |color|:"#0000ff"}, {|id|:"TT", |name|:"Trinidad and Tobago", value:1346350, |color|:"#888822"}, {|id|:"TN", |name|:"Tunisia", value:10594057, |color|:"#0000ff"}, {|id|:"TR", |name|:"Turkey", value:73639596, |color|:"#00ff00"}, {|id|:"TM", |name|:"Turkmenistan", value:5105301, |color|:"#ff0000"}, {|id|:"UG", |name|:"Uganda", value:34509205, |color|:"#0000ff"}, {|id|:"UA", |name|:"Ukraine", value:45190180, |color|:"#00ff00"}, {|id|:"AE", |name|:"United Arab Emirates", value:7890924, |color|:"#ff0000"}, {|id|:"GB", |name|:"United Kingdom", value:62417431, |color|:"#00ff00"}, {|id|:"US", |name|:"United States", value:313085380, |color|:"#888822"}, {|id|:"UY", |name|:"Uruguay", value:3380008, |color|:"#ffff00"}, {|id|:"UZ", |name|:"Uzbekistan", value:27760267, |color|:"#ff0000"}, {|id|:"VE", |name|:"Venezuela", value:29436891, |color|:"#ffff00"}, {|id|:"PS", |name|:"West Bank and Gaza", value:4152369, |color|:"#ff0000"}, {|id|:"VN", |name|:"Vietnam", value:88791996, |color|:"#ff0000"}, {|id|:"YE", |name|:"Yemen, Rep.", value:24799880, |color|:"#ff0000"}, {|id|:"ZM", |name|:"Zambia", value:13474959, |color|:"#0000ff"}, {|id|:"ZW", |name|:"Zimbabwe", value:12754378, |color|:"#0000ff"}}
end retData

★Click Here to Open This Script　

AMChartsで点滅ポイントつき世界地図をダイアログ上に表示 v2

Posted on 6月 25, 2020 by Takaaki Naganoya

アラートダイアログ上にWkWebViewを作成し、その上でAMChartsによる点滅ポイントつき世界地図を表示するAppleScriptです。

このアラートダイアログによる「箱庭UI」シリーズも、なかなか実用性のあるソリューションにつながる例が少なくて、インパクトとかウケ狙いのものが多いですが、これにはけっこうな実用性を感じました。

世界地図上にプロットする必要のあるデータというのはなかなかありませんが、必要がある場合にはこのように部品として使えるところまで飼い慣らしてあるので、有用性は高いと思われます。

–> Download displayAMChart (Script Bundle with Library and HTML）

▲macOS 11.0Betaでも動きます

AppleScript名：AMChartsで点滅ポイントつき世界地図をダイアログ上に表示 v2.scptd

set zoomScale to 4 –Flash Radius

–Not actual location
set aList to {{title:"Shane Stanley", latitude:-33.5206, longitude:151.1231, |color|:"#0000ff", |url|:"https://latenightsw.com"}, {title:"Takaaki Naganoya (me)", latitude:35.6785, longitude:139.6823, |color|:"#ff0000", |url|:"http://piyocast.com"}, {title:"Jean-Christophe Helary", latitude:34.349399, longitude:134.025012, |color|:"#0000ff", |url|:"http://mac4translators.blogspot.com"}, {title:"Yvan KOENIG", latitude:43.57803, longitude:7.05451, |color|:"#0000ff"}, {title:"Ed Stockly", latitude:34.052235, longitude:-118.243683, |color|:"#0000ff", |url|:"https://www.latimes.com"}, {title:"Mark Alldritt", latitude:45.2512, longitude:-75.42, |color|:"#0000ff", |url|:"https://latenightsw.com"}}

–https://www.amcharts.com/demos/zooming-to-countries-map/
set mePath to path to me
set resPath to (mePath as string) & "Contents:Resources:index.html"
set myStr to read (resPath as alias) as «class utf8»

set jStr to array2DToJSONArray(aList) of me
set aString to current application’s NSString’s stringWithFormat_(myStr, zoomScale as string, jStr) as string

set paramObj to {myMessage:"AppleScripters I know the location", mySubMessage:"This is a AMCharts test", htmlStr:aString, jsDelimiters:{"<script>", "</script>"}, viewSize:{1000, 520}}

webD’s displayWebDialog(paramObj)

★Click Here to Open This Script　

ZingChart.jsでヒートマップをダイアログ上に表示

Posted on 6月 24, 2020 by Takaaki Naganoya

アラートダイアログ上にWkWebViewを貼り付けて、その上でZingChartによるヒートマップを表示するAppleScriptです。

–> Download zingchartDisp (Script Bundle with AppleScript library and html)

さすがにHTMLのコードが長々と掲載されるのはいかがなものかと考え、htmlを外部ファイルに追い出してみました。

ZingChartは商用のJavaScriptライブラリですが、フリーでも利用できます。フリーで利用する場合にはチャート中に「Powered by ZingChart」の表示が入るようです。

index.html中からデータを外部に追い出せていませんが、データを外部から供給するようにすれば、AppleScriptで処理した結果を表示する部品として活用できることでしょう。

▲ほかにもいろいろありますが、ZingChartはセンスがいい上にサンプルにフルHTMLが掲載されていて分かりやすいですね。ただ、自分が表示させたいデータを突っ込んで表示を試みるとうまく行かないケースが多い

AppleScript名：ZingChart.jsでヒートマップをダイアログ上に表示.scptd

—
–　　Created by: Takaaki Naganoya
–　　Created on: 2020/06/23
—
–　　Copyright © 2020 Piyomaru Software, All Rights Reserved
—
use AppleScript version "2.4" — Yosemite (10.10) or later
use scripting additions
use webD : script "webDialogLib"

–https://www.zingchart.com/gallery/grouped-heatmap-of-united-states
set mePath to path to me
set resPath to (mePath as string) & "Contents:Resources:index.html"
set myStr to read (resPath as alias) as «class utf8»

set paramObj to {myMessage:"Grouped Heatmap Map of the US", mySubMessage:"This is a zingchart test", htmlStr:myStr, jsDelimiters:{"<script>", "</script>"}, viewSize:{900, 600}}

webD’s displayWebDialog(paramObj)

★Click Here to Open This Script　

Vis.jsでGraphvizをダイアログ上に表示 v2

Posted on 6月 23, 2020 by Takaaki Naganoya

アラートダイアログ上にWkWebViewを配置し、その上にvis.jsによるDOT言語をGraphViz同様に表示するAppleScriptです。

▲本Scriptの実行画面。改行が効いていませんね

GraphVizは、知る人ぞ知るフロー図やマインドマップ風の図を比較的わかりやすい記述言語（DOT）で行ったものをレンダリング表示するフリーのソフトウェアです。もともと、IC上の部品配置を最適化するためのアルゴリズムが活用されているのだとか。

ノード間を線でつないだ図（マインドマップみたいなもの）を、ノードの関連情報を記述するだけでレンダリングできるため、いろいろ便利に使ってきました。MindjetMindManagerなどのアプリケーションをAppleScriptからコントロールして表示してきたものを、GraphVizに置き換えています（MindjetMindManagerが高価な割に不甲斐ないので）。AppleScript書類内のルーチンの呼び出し関係をマインドマップで表示するAppleScriptなども使っており、こちらはまだGraphViz版を作っていませんが、いろいろ便利に使えるだろうかといったところです。

▲同じデータをGraphVizでレンダリング＆表示させた実行画面

–> Download gviz_data(Script bundle with AppleScript Libraries & DOT Data)

DOTファイルをレンダリングして表示するのに、GraphvizのObjective-C版をひろってきて、その内容を適宜呼び出すようなことも検討していたのですが、これでいいじゃないですか。

GraphvizのObjective-C版をAppleScriptObjC版のアプリケーションに組み込むのが大変（プログラムがFrameworkになっているとか、表示用のビューをWindowに乗せればそれでおしまい、という風にはなっていない）。

WkWebViewを１枚ウィンドウ上に貼り付けて、JavaScriptを実行。PDFに書き出すことさえ考えなければ、これで問題ないでしょう。そう、PDF出力することを考えなければ…………。あとは、Mac App Storeに出すときにこうした構造のアプリケーションで大丈夫なのかが疑問です。ただ、iOSでこうしたWebView＋JavaScriptの「ガワアプリ」と言われるものが多数存在するという状況を鑑みますと、そんなにうるさいことを言われないのでは？　という気もします。

本Scriptについては、あとはマウスのスクロールで拡大縮小するように改良できるとよいでしょう。

AppleScript名：DOT.jsでGraphvizをダイアログ上に表示 v2.scptd

—
–　　Created by: Takaaki Naganoya
–　　Created on: 2020/06/20
—
–　　Copyright © 2020 Piyomaru Software, All Rights Reserved
—
use AppleScript version "2.4" — Yosemite (10.10) or later
use framework "Foundation"
use scripting additions
use webD : script "webDialogLib"

property NSString : a reference to current application’s NSString

set aDot to choose file of type {"com.omnigroup.foreign-types.graphviz-dot"}
set aData to read aDot as «class utf8»

–https://visjs.github.io/vis-graph3d/docs/graph3d/index.html
set myStr to "<!DOCTYPE html>
<html lang=＼"ja＼">
<head>
<meta charset=＼"utf-8＼">
<title>Vue.js-Viz.js</title>
<script src=＼"https://cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.js＼"></script>
<script type=＼"text/javascript＼" src=＼"https://unpkg.com/viz.js@1.8.0＼"></script>
<style>
</style>
</head>
<body>
<div class=＼"container＼">
<div id=＼"graph＼">
<div class=＼"write＼">
</div>
<div class=＼"out＼">
<div class=＼"graph＼" v-html=＼"svg＼"></div>
</div>
</div>
</div>
</body>
<script>
new Vue({
el: ’#graph’,
data: {
input: `%@`,
},
computed: {
svg: function() {
return Viz(this.input, {
format: ’svg’
});
},
},
});
</script>
</html>"

set aString to current application’s NSString’s stringWithFormat_(myStr, aData) as string
set paramObj to {myMessage:"viz.js Test", mySubMessage:"This is a viz.js test", htmlStr:aString, jsDelimiters:{"<script>", "</script>"}, viewSize:{1700, 400}}

webD’s displayWebDialog(paramObj)

★Click Here to Open This Script　

アラートダイアログ上にWebViewでvis.jsを用いて3Dグラフを表示

Posted on 6月 22, 2020 by Takaaki Naganoya

アラートダイアログ上に作成したWkWebViewでvis.jsのGraph3dを用いて3Dグラフを表示するAppleScriptです。

本Scriptは単に三角関数の計算値をプロットするものなので、そのまま実用レベルというわけではありませんが、vis.jsがこのように利用できることを示す実証コードにはなっていると思います。

実行すると、グラフの表示タイプを聞いてくるので、

選択すると、グラフを表示します。ドラッグで回転、マウスのスクロールホイールでズーム制御を行います。

まいどまいど、代わり映えしないWkWebViewの表示コードを掲載するのもどうかと思い、その部分はライブラリとしてまとめておきました。きちんとAppleScript側のオブジェクトでパラメータを指定できるレベルまで落とし込めば、JavaScript部分もライブラリに押し込んで「display chart」のようなsdefつきライブラリに仕立ててもいいのかもしれません。

–> Download 3dGraphDialog.zip (Script Bundle with AppleScript Libraries)

AppleScript名：アラートダイアログ上にWebViewでvis.jsを用いて3Dグラフを表示.scptd

property NSString : a reference to current application’s NSString

set aSel to choose from list {"bar", "bar-color", "bar-size", "dot", "dot-line", "dot-color", "dot-size", "grid", "line", "surface"}
if aSel = false then return

set aaSel to contents of first item of aSel

–https://visjs.github.io/vis-graph3d/docs/graph3d/index.html
set myStr to "<!DOCTYPE HTML>
<html>
<head>
<title>Graph 3D demo</title>

<style>
body {font: 16pt arial;}
</style>

<script type=＼"text/javascript＼" src=＼"https://cdnjs.cloudflare.com/ajax/libs/vis/4.21.0/vis.js＼"></script>

<script type=＼"text/javascript＼">
var data = null;
var graph = null;

function custom(x, y) {
return (Math.sin(x/50) * Math.cos(y/50) * 50 + 50);
}

// Called when the Visualization API is loaded.
function drawVisualization() {

// Create and populate a data table.
var data = new vis.DataSet();
　　
// create some nice looking data with sin/cos
var steps = 30; // number of datapoints will be steps*steps
var axisMax = 314;
var axisStep = axisMax / steps;
for (var x = 0; x < axisMax; x+=axisStep) {
for (var y = 0; y < axisMax; y+=axisStep) {
var value = custom(x, y);
data.add({
x: x,
y: y,
z: value,
style: value
});
}
}

// specify options
var options = {
width: ’900px’,
height: ’600px’,
style: ’%@’,
showPerspective: true,
showGrid: true,
showShadow: false,
keepAspectRatio: true,
verticalRatio: 0.6
};

// create a graph3d
var container = document.getElementById(’mygraph’);
graph3d = new vis.Graph3d(container, data, options);
}
</script>
</head>

<body onload=＼"drawVisualization();＼">
<div id=＼"mygraph＼"></div>
</body>
</html>"

set aString to NSString’s stringWithFormat_(myStr, aaSel) as string

set paramObj to {myMessage:"Vis.js Test", mySubMessage:"This is a Vis.js test", htmlStr:aString, jsDelimiters:{"<script type=", "</script>"}, viewSize:{920, 620}}

webD’s displayWebDialog(paramObj)

★Click Here to Open This Script　

アラートダイアログ上にWebViewでCesiumを用いて地球儀上に地図を表示

Posted on 6月 21, 2020 by Takaaki Naganoya

アラートダイアログ上にWkWebViewを敷いて、Cesiumを呼び出して地球儀上に地図を表示するAppleScriptです。

もともとのコードは国土地理院のサイトで見つけたものなのですが、地球儀上の地図表示が行えるようです。地球儀以外にも、メルカトル図法などの地図っぽい表示も可能。

右上のメニューから、地図の種類を選択して指定できます。マウスホイールでズームします。

白黒で表示された地図がなかなか面白いところです。

AppleScript名：アラートダイアログ上にWebViewでCesiumを用いて地球儀上に地図を表示.scptd

—
–　　Created by: Takaaki Naganoya
–　　Created on: 2020/06/20
—
–　　Copyright © 2020 Piyomaru Software, All Rights Reserved
—
use AppleScript version "2.4" — Yosemite (10.10) or later
use framework "Foundation"
use framework "AppKit"
use framework "WebKit"
use scripting additions

property |NSURL| : a reference to current application’s |NSURL|
property NSAlert : a reference to current application’s NSAlert
property NSString : a reference to current application’s NSString
property NSButton : a reference to current application’s NSButton
property WKWebView : a reference to current application’s WKWebView
property WKUserScript : a reference to current application’s WKUserScript
property NSURLRequest : a reference to current application’s NSURLRequest
property NSRunningApplication : a reference to current application’s NSRunningApplication
property NSUTF8StringEncoding : a reference to current application’s NSUTF8StringEncoding
property WKUserContentController : a reference to current application’s WKUserContentController
property WKWebViewConfiguration : a reference to current application’s WKWebViewConfiguration
property WKUserScriptInjectionTimeAtDocumentEnd : a reference to current application’s WKUserScriptInjectionTimeAtDocumentEnd

property returnCode : 0

–set aRecArray to {{5, 20}, {25, 67}, {85, 21}, {100, 33}, {220, 88}, {250, 50}, {330, 95}, {410, 12}, {475, 44}, {480, 90}}
–set jsonStr to array2DToJSONArray(aRecArray) of me

–https://github.com/gsi-cyberjapan/gsitiles-cesium/blob/gh-pages/index.html
set myStr to "<!DOCTYPE html>
<html>
<head>
<meta charset=＼"UTF-8＼">
<title>GSI Tiles on Cesium</title>
<script src=＼"https://cesium.com/downloads/cesiumjs/releases/1.63.1/Build/Cesium/Cesium.js＼"></script>
<link href=＼"https://cesium.com/downloads/cesiumjs/releases/1.63.1/Build/Cesium/Widgets/widgets.css＼" rel=＼"stylesheet＼">
<style>
#cesiumContainer {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
margin: 0;
overflow: hidden;
padding: 0;
font-family: sans-serif;
}
html {
height: 100%;
}
body {
padding: 0;
margin: 0;
overflow: hidden;
height: 100%;
}
</style>
</head>

<body>
<div id=＼"cesiumContainer＼"></div>
<script>
var viewer = new Cesium.Viewer(’cesiumContainer’, {
imageryProvider: new Cesium.createOpenStreetMapImageryProvider({
url: ’https://cyberjapandata.gsi.go.jp/xyz/std/’,
credit: new Cesium.Credit(’地理院タイル’, ’’, ’https://maps.gsi.go.jp/development/ichiran.html’)
}),
baseLayerPicker: true,
geocoder: false,
homeButton: false
});

viewer.camera.setView({
destination : Cesium.Cartesian3.fromDegrees(140.00, 36.14, 20000000.0)
});
</script>
</body>
</html>"

–set aString to current application’s NSString’s stringWithFormat_(myStr, jsonStr) as string

set paramObj to {myMessage:"Cesium Test", mySubMessage:"This is a Cesium test", htmlStr:myStr}
–my browseStrWebContents:paramObj–for debug
my performSelectorOnMainThread:"browseStrWebContents:" withObject:(paramObj) waitUntilDone:true

on browseStrWebContents:paramObj
　　set aMainMes to myMessage of paramObj
　　set aSubMes to mySubMessage of paramObj
　　set htmlString to (htmlStr of paramObj)
　　
　　set aWidth to 1220
　　set aHeight to 720
　　
　　–WebViewをつくる
　　set aConf to WKWebViewConfiguration’s alloc()’s init()
　　
　　–指定HTML内のJavaScriptをFetch
　　set jsSource to pickUpFromToStr(htmlString, "<script>", "</script>") of me
　　
　　set userScript to WKUserScript’s alloc()’s initWithSource:jsSource injectionTime:(WKUserScriptInjectionTimeAtDocumentEnd) forMainFrameOnly:true
　　set userContentController to WKUserContentController’s alloc()’s init()
　　userContentController’s addUserScript:(userScript)
　　aConf’s setUserContentController:userContentController
　　
　　set aWebView to WKWebView’s alloc()’s initWithFrame:(current application’s NSMakeRect(0, 0, aWidth, aHeight)) configuration:aConf
　　aWebView’s setNavigationDelegate:me
　　aWebView’s setUIDelegate:me
　　aWebView’s setTranslatesAutoresizingMaskIntoConstraints:true
　　using terms from scripting additions
　　　　set bURL to |NSURL|’s fileURLWithPath:(POSIX path of (path to me))
　　end using terms from
　　aWebView’s loadHTMLString:htmlString baseURL:(bURL)
　　
　　— set up alert　　
　　set theAlert to NSAlert’s alloc()’s init()
　　tell theAlert
　　　　its setMessageText:aMainMes
　　　　its setInformativeText:aSubMes
　　　　its addButtonWithTitle:"OK"
　　　　–its addButtonWithTitle:"Cancel"
　　　　its setAccessoryView:aWebView
　　　　
　　　　set myWindow to its |window|
　　end tell
　　
　　— show alert in modal loop
　　NSRunningApplication’s currentApplication()’s activateWithOptions:0
　　my performSelectorOnMainThread:"doModal:" withObject:(theAlert) waitUntilDone:true
　　
　　–Stop Web View Action
　　set bURL to |NSURL|’s URLWithString:"about:blank"
　　set bReq to NSURLRequest’s requestWithURL:bURL
　　aWebView’s loadRequest:bReq
　　
　　if (my returnCode as number) = 1001 then error number -128
end browseStrWebContents:

on doModal:aParam
　　set (my returnCode) to (aParam’s runModal()) as number
end doModal:

on viewDidLoad:aNotification
　　return true
end viewDidLoad:

on fetchJSSourceString(aURL)
　　set jsURL to |NSURL|’s URLWithString:aURL
　　set jsSourceString to NSString’s stringWithContentsOfURL:jsURL encoding:(NSUTF8StringEncoding) |error|:(missing value)
　　return jsSourceString
end fetchJSSourceString

on pickUpFromToStr(aStr as string, s1Str as string, s2Str as string)
　　set a1Offset to offset of s1Str in aStr
　　if a1Offset = 0 then return false
　　set bStr to text (a1Offset + (length of s1Str)) thru -1 of aStr
　　set a2Offset to offset of s2Str in bStr
　　if a2Offset = 0 then return false
　　set cStr to text 1 thru (a2Offset – (length of s2Str)) of bStr
　　return cStr as string
end pickUpFromToStr

–リストを任意のデリミタ付きでテキストに
on retArrowText(aList, aDelim)
　　set aText to ""
　　set curDelim to AppleScript’s text item delimiters
　　set AppleScript’s text item delimiters to aDelim
　　set aText to aList as text
　　set AppleScript’s text item delimiters to curDelim
　　return aText
end retArrowText

on array2DToJSONArray(aList)
　　set anArray to current application’s NSMutableArray’s arrayWithArray:aList
　　set jsonData to current application’s NSJSONSerialization’s dataWithJSONObject:anArray options:(0 as integer) |error|:(missing value) –0 is
　　set resString to current application’s NSString’s alloc()’s initWithData:jsonData encoding:(current application’s NSUTF8StringEncoding)
　　return resString
end array2DToJSONArray

on parseByDelim(aData, aDelim)
　　set curDelim to AppleScript’s text item delimiters
　　set AppleScript’s text item delimiters to aDelim
　　set dList to text items of aData
　　set AppleScript’s text item delimiters to curDelim
　　return dList
end parseByDelim

★Click Here to Open This Script　

アラートダイアログ上のWebViewでGio.jsを用いて地球儀＋データアニメーション表示 v2a

Posted on 6月 20, 2020 by Takaaki Naganoya

アラートダイアログ上にWkWebViewを配置し、その上にGio.jsによる地球儀＋グラフデータ（アニメーション）を表示するAppleScriptです。

Gio.jsは国際間の貿易収支、Webトラフィックなどの可視化を行うさいに利用するライブラリのようです。さまざまな可視化サンプルをかき集めて、実際にWkWebViewで表示できたもののうち、再利用しやすく利用価値の高そうなものということで、このGio.jsを選んでみました。

派手なビジュアライズの部品はいろいろ見て回りましたが、割とすぐ慣れるというか、飽きるというべきなのか、派手に見せたところで実用性はさほど高まらないといった悟りを得るに至った次第です。

本ScriptはAppleScript側のオブジェクトで与えたデータをもとに表示内容を変更するところまでは作り込んでいませんが、一応、Gio.jsをCDN上のものを呼び出すように書き換えておきました。

AppleScript名：アラートダイアログ上にWebViewでGio.jsを用いて地球儀上にデータアニメーションを表示 v2a.scptd

—
–　　Created by: Takaaki Naganoya
–　　Created on: 2020/06/20
—
–　　Copyright © 2020 Piyomaru Software, All Rights Reserved
—
use AppleScript version "2.4" — Yosemite (10.10) or later
use framework "Foundation"
use framework "AppKit"
use framework "WebKit"
use scripting additions

property returnCode : 0

–set aRecArray to {{5, 20}, {25, 67}, {85, 21}, {100, 33}, {220, 88}, {250, 50}, {330, 95}, {410, 12}, {475, 44}, {480, 90}}
–set jsonStr to array2DToJSONArray(aRecArray) of me

–https://github.com/webhacck/gio-js-sample/blob/master/sample2.html
set myStr to "<!DOCTYPE html>
<html>
<head>
<title>Gio.js sample</title>
<meta charset=＼"utf-8＼">
<meta name=＼"viewport＼" content=＼"width=device-width, initial-scale=1＼">
</head>
<body>

<div id=＼"globalArea＼" style=＼"width:1000px;height:700px＼"></div>

var container = document.getElementById( ＼"globalArea＼" );

//config用のオプション設定
var config = {
＼"control＼": {
＼"stats＼": false,
＼"disableUnmentioned＼": false,
＼"lightenMentioned＼": true,
＼"inOnly＼": false,
＼"outOnly＼": false,
＼"initCountry＼": ＼"JP＼",
＼"halo＼": true
},
＼"color＼": {
＼"surface＼": 1744048,
＼"selected＼": 2141154,
＼"in＼": 16765762,
＼"out＼": 5366382,
＼"halo＼": 2141154,
＼"background＼": 0
},
＼"brightness＼": {
＼"ocean＼": 0.95,
＼"mentioned＼": 0.28,
＼"related＼": 0.74
}
};

//dataset
var data= [
{ e: ＼"JP＼", i: ＼"CN＼", v: 8000000 },
{ e: ＼"JP＼", i: ＼"TH＼", v: 3000000 },
{ e: ＼"JP＼", i: ＼"ID＼", v: 1000000 },
{ e: ＼"US＼", i: ＼"JP＼", v: 8000000 },
{ e: ＼"RU＼", i: ＼"JP＼", v: 3000000 },
{ e: ＼"IN＼", i: ＼"JP＼", v: 1000000 }]

//第２引数にconfigを設定する
var controller = new GIO.Controller( container, config );

controller.addData( data );
controller.init();

</script>

</body>
</html>"

–set aString to current application’s NSString’s stringWithFormat_(myStr, jsonStr) as string

set paramObj to {myMessage:"Gio.js Test", mySubMessage:"This is a Gio.js test", htmlStr:myStr}
–my browseStrWebContents:paramObj–for debug
my performSelectorOnMainThread:"browseStrWebContents:" withObject:(paramObj) waitUntilDone:true

on browseStrWebContents:paramObj
　　set aMainMes to myMessage of paramObj
　　set aSubMes to mySubMessage of paramObj
　　set htmlString to (htmlStr of paramObj)
　　
　　set aWidth to 1020
　　set aHeight to 720
　　
　　–WebViewをつくる
　　set aConf to WKWebViewConfiguration’s alloc()’s init()
　　
　　–指定HTML内のJavaScriptをFetch
　　set jsSource to pickUpFromToStr(htmlString, "<script>", "</script>") of me
　　
　　set userScript to WKUserScript’s alloc()’s initWithSource:jsSource injectionTime:(WKUserScriptInjectionTimeAtDocumentEnd) forMainFrameOnly:true
　　set userContentController to WKUserContentController’s alloc()’s init()
　　userContentController’s addUserScript:(userScript)
　　aConf’s setUserContentController:userContentController
　　
　　set aWebView to WKWebView’s alloc()’s initWithFrame:(current application’s NSMakeRect(0, 0, aWidth, aHeight)) configuration:aConf
　　aWebView’s setNavigationDelegate:me
　　aWebView’s setUIDelegate:me
　　aWebView’s setTranslatesAutoresizingMaskIntoConstraints:true
　　using terms from scripting additions
　　　　set bURL to |NSURL|’s fileURLWithPath:(POSIX path of (path to me))
　　end using terms from
　　aWebView’s loadHTMLString:htmlString baseURL:(bURL)
　　
　　— set up alert　　
　　set theAlert to NSAlert’s alloc()’s init()
　　tell theAlert
　　　　its setMessageText:aMainMes
　　　　its setInformativeText:aSubMes
　　　　its addButtonWithTitle:"OK"
　　　　–its addButtonWithTitle:"Cancel"
　　　　its setAccessoryView:aWebView
　　　　
　　　　set myWindow to its |window|
　　end tell
　　
　　— show alert in modal loop
　　NSRunningApplication’s currentApplication()’s activateWithOptions:0
　　my performSelectorOnMainThread:"doModal:" withObject:(theAlert) waitUntilDone:true
　　
　　–Stop Web View Action
　　set bURL to |NSURL|’s URLWithString:"about:blank"
　　set bReq to NSURLRequest’s requestWithURL:bURL
　　aWebView’s loadRequest:bReq
　　
　　if (my returnCode as number) = 1001 then error number -128
end browseStrWebContents:

on doModal:aParam
　　set (my returnCode) to (aParam’s runModal()) as number
end doModal:

on viewDidLoad:aNotification
　　return true
end viewDidLoad:

on array2DToJSONArray(aList)
　　set anArray to current application’s NSMutableArray’s arrayWithArray:aList
　　set jsonData to current application’s NSJSONSerialization’s dataWithJSONObject:anArray options:(0 as integer) |error|:(missing value) –0 is
　　set resString to current application’s NSString’s alloc()’s initWithData:jsonData encoding:(current application’s NSUTF8StringEncoding)
　　return resString
end array2DToJSONArray

★Click Here to Open This Script　

アラートダイアログ上にWebViewでChart.jsを表示（Pie Chart） v2

Posted on 6月 15, 2020 by Takaaki Naganoya

Chart.jsを用いてアラートダイアログ上に円グラフを表示するAppleScriptです。

サンプルの円グラフの色使いがいまひとつだったので、Keynoteのグラフの色設定を読み取って利用しています。

ネットワーク接続チェックなど、必要な処理はひととおり行なっている、実戦レベルに近いものです。

さまざまなJavaScript系のグラフ表示のプログラムを試してみましたが、Chart.jsはとてもいい感じです。

AppleScript名：アラートダイアログ上にWebViewでChart.jsを表示（Pie Chart） v2.scptd

set aList to {"field1", "field2", "field3", "field4", "field5"}
set cList to {38, 31, 21, 10, 1}
set dMes1 to "Pie chart Test"
set dMes2 to "This is a simple Donut chart using charts.js"

displayPieChart(aList, cList, dMes1, dMes2) of pieChartLib

script pieChartLib
　　—
　　–　　Created by: Takaaki Naganoya
　　–　　Created on: 2020/06/12
　　—
　　–　　Copyright © 2020 Piyomaru Software, All Rights Reserved
　　—
　　use AppleScript version "2.4" — Yosemite (10.10) or later
　　use framework "Foundation"
　　use framework "AppKit"
　　use framework "WebKit"
　　use scripting additions
　　
　　property |NSURL| : a reference to current application’s |NSURL|
　　property NSAlert : a reference to current application’s NSAlert
　　property NSString : a reference to current application’s NSString
　　property NSButton : a reference to current application’s NSButton
　　property WKWebView : a reference to current application’s WKWebView
　　property WKUserScript : a reference to current application’s WKUserScript
　　property NSURLRequest : a reference to current application’s NSURLRequest
　　property NSMutableArray : a reference to current application’s NSMutableArray
　　property NSJSONSerialization : a reference to current application’s NSJSONSerialization
　　property NSRunningApplication : a reference to current application’s NSRunningApplication
　　property NSUTF8StringEncoding : a reference to current application’s NSUTF8StringEncoding
　　property WKUserContentController : a reference to current application’s WKUserContentController
　　property WKWebViewConfiguration : a reference to current application’s WKWebViewConfiguration
　　property WKUserScriptInjectionTimeAtDocumentEnd : a reference to current application’s WKUserScriptInjectionTimeAtDocumentEnd
　　
　　property returnCode : 0
　　property parent : AppleScript
　　
　　
　　on displayPieChart(aList, cList, dMes1, dMes2)
　　　　–Error Check
　　　　if length of aList is not equal to length of cList then error "Wrong Parameter items"
　　　　if length of aList > 18 then error "Too much items"
　　　　
　　　　set aRes to hasInternetConnection("https://cdnjs.cloudflare.com") of me
　　　　if aRes = false then error "Internet connection lost"
　　　　
　　　　–Data convert to JSON strings
　　　　set aJsonStr to array2DToJSONArray(aList) of me
　　　　set cJsonStr to array2DToJSONArray(cList) of me
　　　　
　　　　–Pie Chart Template HTML
　　　　set myStr to "<!DOCTYPE html>
<html lang=＼"ja＼">
<head>
<meta charset=＼"utf-8＼">
　<title>Graph</title>
</head>
<body>
<canvas id=＼"myPieChart＼"></canvas>
<script src=＼"https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.bundle.js＼"></script>

<script>
var ctx = document.getElementById(＼"myPieChart＼");
var myPieChart = new Chart(ctx, {
type: ’pie’,
data: {
labels: %@,
datasets: [{
backgroundColor: %@,
data: %@
}]
},
options: {
title: {
display: false,
text: ＼"＼"
}
}
});
</script>
</body>
</html>"
　　　　–Color Table From Apple Keynote
　　　　set bList to {"#118EFE", "#53D529", "#F5AD10", "#FC0007", "#8B2659", "#2A2A2A", "#118EFE", "#53D529", "#F5AD10", "#FC0007", "#8B2659", "#2A2A2A", "#118EFE", "#53D529", "#F5AD10", "#FC0007", "#8B2659", "#2A2A2A"}
　　　　set bJsonStr to array2DToJSONArray(bList) of me
　　　　
　　　　set aString to NSString’s stringWithFormat_(myStr, aJsonStr, bJsonStr, cJsonStr) as string
　　　　
　　　　set paramObj to {myMessage:dMes1, mySubMessage:dMes2, htmlStr:aString}
　　　　–my browseStrWebContents:paramObj–for debug
　　　　my performSelectorOnMainThread:"browseStrWebContents:" withObject:(paramObj) waitUntilDone:true
　　end displayPieChart
　　
　　on browseStrWebContents:paramObj
　　　　set aMainMes to myMessage of paramObj
　　　　set aSubMes to mySubMessage of paramObj
　　　　set htmlString to (htmlStr of paramObj)
　　　　
　　　　set aWidth to 920
　　　　set aHeight to 500
　　　　
　　　　–WebViewをつくる
　　　　set aConf to WKWebViewConfiguration’s alloc()’s init()
　　　　
　　　　–指定HTML内のJavaScriptをFetch
　　　　set jsSource to pickUpFromToStr(htmlString, "<script>", "</script>") of me
　　　　
　　　　set userScript to WKUserScript’s alloc()’s initWithSource:jsSource injectionTime:(WKUserScriptInjectionTimeAtDocumentEnd) forMainFrameOnly:true
　　　　set userContentController to WKUserContentController’s alloc()’s init()
　　　　userContentController’s addUserScript:(userScript)
　　　　aConf’s setUserContentController:userContentController
　　　　
　　　　set aWebView to WKWebView’s alloc()’s initWithFrame:(current application’s NSMakeRect(0, 0, aWidth, aHeight)) configuration:aConf
　　　　aWebView’s setNavigationDelegate:me
　　　　aWebView’s setUIDelegate:me
　　　　aWebView’s setTranslatesAutoresizingMaskIntoConstraints:true
　　　　using terms from scripting additions
　　　　　　set bURL to |NSURL|’s fileURLWithPath:(POSIX path of (path to me))
　　　　end using terms from
　　　　aWebView’s loadHTMLString:htmlString baseURL:(bURL)
　　　　
　　　　— set up alert　　
　　　　set theAlert to NSAlert’s alloc()’s init()
　　　　tell theAlert
　　　　　　its setMessageText:aMainMes
　　　　　　its setInformativeText:aSubMes
　　　　　　its addButtonWithTitle:"OK"
　　　　　　–its addButtonWithTitle:"Cancel"
　　　　　　its setAccessoryView:aWebView
　　　　　　
　　　　　　set myWindow to its |window|
　　　　end tell
　　　　
　　　　— show alert in modal loop
　　　　NSRunningApplication’s currentApplication()’s activateWithOptions:0
　　　　my performSelectorOnMainThread:"doModal:" withObject:(theAlert) waitUntilDone:true
　　　　
　　　　–Stop Web View Action
　　　　set bURL to |NSURL|’s URLWithString:"about:blank"
　　　　set bReq to NSURLRequest’s requestWithURL:bURL
　　　　aWebView’s loadRequest:bReq
　　　　
　　　　if (my returnCode as number) = 1001 then error number -128
　　end browseStrWebContents:
　　
　　
　　on doModal:aParam
　　　　set (my returnCode) to (aParam’s runModal()) as number
　　end doModal:
　　
　　
　　on viewDidLoad:aNotification
　　　　return true
　　end viewDidLoad:
　　
　　
　　on fetchJSSourceString(aURL)
　　　　set jsURL to |NSURL|’s URLWithString:aURL
　　　　set jsSourceString to NSString’s stringWithContentsOfURL:jsURL encoding:(NSUTF8StringEncoding) |error|:(missing value)
　　　　return jsSourceString
　　end fetchJSSourceString
　　
　　
　　on pickUpFromToStr(aStr as string, s1Str as string, s2Str as string)
　　　　set a1Offset to offset of s1Str in aStr
　　　　if a1Offset = 0 then return false
　　　　set bStr to text (a1Offset + (length of s1Str)) thru -1 of aStr
　　　　set a2Offset to offset of s2Str in bStr
　　　　if a2Offset = 0 then return false
　　　　set cStr to text 1 thru (a2Offset – (length of s2Str)) of bStr
　　　　return cStr as string
　　end pickUpFromToStr
　　
　　
　　on array2DToJSONArray(aList)
　　　　set anArray to NSMutableArray’s arrayWithArray:aList
　　　　set jsonData to NSJSONSerialization’s dataWithJSONObject:anArray options:(0 as integer) |error|:(missing value) –0 is
　　　　set resString to NSString’s alloc()’s initWithData:jsonData encoding:(NSUTF8StringEncoding)
　　　　return resString
　　end array2DToJSONArray
　　
　　
　　on parseByDelim(aData, aDelim)
　　　　set curDelim to AppleScript’s text item delimiters
　　　　set AppleScript’s text item delimiters to aDelim
　　　　set dList to text items of aData
　　　　set AppleScript’s text item delimiters to curDelim
　　　　return dList
　　end parseByDelim
　　
　　on hasInternetConnection(aURL)
　　　　set aURL to current application’s |NSURL|’s alloc()’s initWithString:aURL
　　　　set aReq to current application’s NSURLRequest’s alloc()’s initWithURL:aURL cachePolicy:(current application’s NSURLRequestReloadIgnoringLocalCacheData) timeoutInterval:5.0
　　　　set urlRes to (current application’s NSURLConnection’s sendSynchronousRequest:aReq returningResponse:(missing value) |error|:(missing value))
　　　　if urlRes = missing value then
　　　　　　return false
　　　　else
　　　　　　return true
　　　　end if
　　end hasInternetConnection
end script

★Click Here to Open This Script　

アラートダイアログ上にd3-cloudを用いてワードクラウドを表示

Posted on 6月 14, 2020 by Takaaki Naganoya

d3-cloudを用いてワードクラウドを表示するAppleScriptです。

本AppleScriptでは、

 {|word|:"NSString", |count|:97}

のように、登場単語、登場回数のように集計ずみのデータをJSONに変換してワードクラウド表示させています。この（AppleScriptの予約語にかぶりまくりな）属性ラベルはd3-cloud側の仕様です。

以前に作った「Tag CloudっぽいRTFの作成」のデータを用いて（属性ラベルを置換して）表示させたものがこちら（↑）。

Tag/Word Cloud関連のJavaScriptについては前から気になって調べてはいたのですが、「ローカルにデータを持つスクリプトが多い」「d3-cloud自体をローカルにインストールさせる例が多い」（実行速度などの問題で？）という状況で、ありもののスクリプトをこのアラートダイアログ上にはりつけたWkWebViewの「箱庭環境」で追加スクリプトのインストールなしで動くように書き換えるのに少々手間取りました。

CDNにホスティングされているd3-cloudを呼び出すことで、ローカルにd3-cloudをインストールせずに実行していますが、将来的にこれが変更・廃止された場合には別のWeb上のどこかにホスティングされているd3-cloudを呼び出すことになります。

ローカルにあるテキストコンテンツ（CotEditorで編集中の文章とか、Pagesで作成中のワープロ文章とか、Keynoteで作成中のプレゼン資料の内容とか）を分析して頻出単語を取り出し、タグクラウドといいますかワードクラウドで表示して全体の見通しをつけるというScriptは作りたいと思っていました。

AppleScript名：アラートダイアログ上にd3-cloudを用いてワードクラウドを表示.scptd

—
–　　Created by: Takaaki Naganoya
–　　Created on: 2020/06/13
—
–　　Copyright © 2020 Piyomaru Software, All Rights Reserved
—
use AppleScript version "2.4" — Yosemite (10.10) or later
use framework "Foundation"
use framework "AppKit"
use framework "WebKit"
use scripting additions

property |NSURL| : a reference to current application’s |NSURL|
property NSAlert : a reference to current application’s NSAlert
property NSString : a reference to current application’s NSString
property NSButton : a reference to current application’s NSButton
property WKWebView : a reference to current application’s WKWebView
property WKUserScript : a reference to current application’s WKUserScript
property NSURLRequest : a reference to current application’s NSURLRequest
property NSMutableArray : a reference to current application’s NSMutableArray
property NSJSONSerialization : a reference to current application’s NSJSONSerialization
property NSRunningApplication : a reference to current application’s NSRunningApplication
property NSUTF8StringEncoding : a reference to current application’s NSUTF8StringEncoding
property WKUserContentController : a reference to current application’s WKUserContentController
property WKWebViewConfiguration : a reference to current application’s WKWebViewConfiguration
property WKUserScriptInjectionTimeAtDocumentEnd : a reference to current application’s WKUserScriptInjectionTimeAtDocumentEnd

property returnCode : 0

–https://qiita.com/january108/items/5388799531c1ace8324e
set myStr to "<!DOCTYPE HTML>
<html lang=＼"en＼">
<head>
<meta charset=＼"UTF-8＼">
<title>D3 Word Clouds</title>
<meta name=＼"author＼" content=＼"d4i＼"/>
</head>
<body>
<script src=＼"http://d3js.org/d3.v3.min.js＼" charset=＼"utf-8＼"></script>
<script src=＼"https://cdnjs.cloudflare.com/ajax/libs/d3-cloud/1.2.5/d3.layout.cloud.min.js＼"></script>

<script>
　　var data = %@;
var width = 600,
height = 400,
fill = d3.scale.category20(),
maxcount = d3.max(data, function(d){ return d.count; } ),
wordcount = data.map(function(d) { return {text: d.word, size: d.count / maxcount * 100}; });

d3.layout.cloud().size([width, height])
.words(wordcount)
.padding(5)
.rotate(function() { return ~~(Math.random() * 2) * 90; })
.font(＼"Impact＼")
.fontSize(function(d) { return d.size; })
.on(＼"end＼", draw)
.start();

function draw(words) {
d3.select(＼"body＼").append(＼"svg＼")
.attr({
＼"width＼": width,
＼"height＼": height
})
.append(＼"g＼")
.attr(＼"transform＼", ＼"translate(＼" + [ width >> 1, height >> 1 ] + ＼")＼")
.selectAll(＼"text＼")
.data(words)
.enter()
.append(＼"text＼")
.style({
＼"font-size＼": function(d) { return d.size + ＼"px＼"; },
＼"font-family＼": ＼"Impact＼",
＼"fill＼": function(d, i) { return fill(i); }
})
.attr({
＼"text-anchor＼": ＼"middle＼",
＼"transform＼": function(d) { return ＼"translate(＼" + [d.x, d.y] + ＼")rotate(＼" + d.rotate + ＼")＼"; }
})
.text(function(d) { return d.text; });
}
</script>
</body>
</html>"

set aString to current application’s NSString’s stringWithFormat_(myStr, jsonStr) as string

set paramObj to {myMessage:"D3 Test", mySubMessage:"This is a d3-cloud word cloud test", htmlStr:aString}
–my browseStrWebContents:paramObj–for debug
my performSelectorOnMainThread:"browseStrWebContents:" withObject:(paramObj) waitUntilDone:true

on browseStrWebContents:paramObj
　　set aMainMes to myMessage of paramObj
　　set aSubMes to mySubMessage of paramObj
　　set htmlString to (htmlStr of paramObj)
　　
　　set aWidth to 620
　　set aHeight to 420
　　
　　–WebViewをつくる
　　set aConf to WKWebViewConfiguration’s alloc()’s init()
　　
　　–指定HTML内のJavaScriptをFetch
　　set jsSource to pickUpFromToStr(htmlString, "<script>", "</script>") of me
　　
　　set userScript to WKUserScript’s alloc()’s initWithSource:jsSource injectionTime:(WKUserScriptInjectionTimeAtDocumentEnd) forMainFrameOnly:true
　　set userContentController to WKUserContentController’s alloc()’s init()
　　userContentController’s addUserScript:(userScript)
　　aConf’s setUserContentController:userContentController
　　
　　set aWebView to WKWebView’s alloc()’s initWithFrame:(current application’s NSMakeRect(0, 0, aWidth, aHeight)) configuration:aConf
　　aWebView’s setNavigationDelegate:me
　　aWebView’s setUIDelegate:me
　　aWebView’s setTranslatesAutoresizingMaskIntoConstraints:true
　　using terms from scripting additions
　　　　set bURL to |NSURL|’s fileURLWithPath:(POSIX path of (path to me))
　　end using terms from
　　aWebView’s loadHTMLString:htmlString baseURL:(bURL)
　　
　　— set up alert　　
　　set theAlert to NSAlert’s alloc()’s init()
　　tell theAlert
　　　　its setMessageText:aMainMes
　　　　its setInformativeText:aSubMes
　　　　its addButtonWithTitle:"OK"
　　　　–its addButtonWithTitle:"Cancel"
　　　　its setAccessoryView:aWebView
　　　　
　　　　set myWindow to its |window|
　　end tell
　　
　　— show alert in modal loop
　　NSRunningApplication’s currentApplication()’s activateWithOptions:0
　　my performSelectorOnMainThread:"doModal:" withObject:(theAlert) waitUntilDone:true
　　
　　–Stop Web View Action
　　set bURL to |NSURL|’s URLWithString:"about:blank"
　　set bReq to NSURLRequest’s requestWithURL:bURL
　　aWebView’s loadRequest:bReq
　　
　　if (my returnCode as number) = 1001 then error number -128
end browseStrWebContents:

on doModal:aParam
　　set (my returnCode) to (aParam’s runModal()) as number
end doModal:

on viewDidLoad:aNotification
　　return true
end viewDidLoad:

on array2DToJSONArray(aList)
　　set anArray to NSMutableArray’s arrayWithArray:aList
　　set jsonData to NSJSONSerialization’s dataWithJSONObject:anArray options:(0 as integer) |error|:(missing value) –0 is
　　set resString to current application’s NSString’s alloc()’s initWithData:jsonData encoding:(current application’s NSUTF8StringEncoding)
　　return resString
end array2DToJSONArray

★Click Here to Open This Script　

アラートダイアログ上にWebViewで3Dコンテンツを表示（WebGL＋three.js）

Posted on 6月 13, 2020 by Takaaki Naganoya

アラートダイアログ上にさまざまなGUI部品を配置してUIを作成する「箱庭UI」シリーズ、WkWebViewを配置してWeb GL＋three.jsによる3Dアニメーションコンテンツを表示するAppleScriptです。

# macOS 10.14.6上のWkWebViewで途中のアップデートから、mouse dragのイベントが取れなくなっています。macOS 10.15および11.0では問題なくmouse dragのイベントを取得できているのですが、、、、。ちなみに、Safariで表示させた場合には問題ありません。同様にWkWebViewを使っているとおぼしきFileMaker Pro v19のWebViewerも同様にドラッグ操作が抜けるので、自分が間抜けなせいではないと思いま

# macOS 13.3beta上では、SafariでもWkWebViewでもWebGL＋three.jsで作られているこの内容を表示できません。全世界のデベロッパーがWkWebView上でWebGL＋three.jsのコンテンツが動かない（表示できない）ことを確認しています。
→ 最新のmacOSで動くバージョンを掲載アラートダイアログ上にWebViewで3Dコンテンツを表示（WebGL＋three.js）v3

多項目選択メニュー部品のようであり、画面下部にあるTABLE（少しデータをいじくってPIYOMARU表示）、SPHERE、HELIX、GRIDのボタンから表示メニュー形態を選択可能になっています。操作は、マウスのドラッグとマウスのスクロール（トラックパッドでもスクロール操作を）です。

▲TABLE 表示

▲SPHERE 表示

▲HELIX 表示

▲GRID 表示

ひととおり、最初のTABLE表示部分の部品表示座標データをいじくって、表示色をいろいろ変更してみて、表示データをAppleScript側のリスト変数で与えるところまでやりかけて、リストからJSON文字列に問題なく変換できているものの、実際にHTMLコンテンツに合成して再生まで行くと何も表示されないという状況です。何も考えずに横長のデータを生成したので、そのあたり横幅に制限があったりするのかもしれません。

球体にDOM要素をテクスチャマッピングするSPHERE表示では、データ数が想定どおりの個数ないと球体の表示が成立しないため、そのあたりにデモプログラムっぽさが垣間見えます。

現状、ただ表示するだけで項目選択などは行えない状況ですが、これを強化して項目選択UIとして育てていくのか、Xcode上のアプリケーションに統合する方向でブラッシュアップするのか、いろいろ協議した結果、現状で既存の選択UIより高い実用性を確保できない、という結論に至ったため「AppleScriptでここまでやってみた」という技術的なデモンストレーションとしてBlog上で公開しておくぐらいのものだろうという話に。

その後、FileMaker ProのWebViewer上で内容可変＋クリック受信機能つきの3D Rotationメニューを実装できるところまで内容の解析ができました。

AppleScript名：アラートダイアログ上にWebViewで3Dコンテンツを表示（WebGL＋three.js）.scptd

property returnCode : 0

–https://www.cresco.co.jp/blog/entry/7427/
— By sgi-chang @ UX Design Center
set myStr to "<!DOCTYPE html>
<html>

<head>
<title>three.js css3d – cresco xmas inspired by periodic table</title>
<meta charset=＼"utf-8＼">
<meta name=＼"viewport＼" content=＼"width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0＼">
<link type=＼"text/css＼" rel=＼"stylesheet＼" href=＼"https://threejs.org/examples/main.css＼">
<style>
a {
color: #8ff;
}

#menu {
position: absolute;
bottom: 20px;
width: 100%;
text-align: center;
}

.element {
width: 120px;
height: 160px;
box-shadow: 0px 0px 12px rgba(0, 255, 255, 0.5);
border: 1px solid rgba(127, 255, 255, 0.25);
font-family: Helvetica, sans-serif;
text-align: center;
line-height: normal;
cursor: default;
}

.element:hover {
box-shadow: 0px 0px 12px rgba(0, 255, 255, 0.75);
border: 1px solid rgba(127, 255, 255, 0.75);
}

.element .number {
position: absolute;
top: 20px;
right: 20px;
font-size: 12px;
color: rgba(127, 255, 255, 0.75);
}

.element .symbol {
position: absolute;
top: 40px;
left: 0px;
right: 0px;
font-size: 60px;
font-weight: bold;
color: rgba(255, 255, 255, 0.75);
text-shadow: 0 0 10px rgba(0, 255, 255, 0.95);
}

.element .details {
position: absolute;
bottom: 15px;
left: 0px;
right: 0px;
font-size: 12px;
color: rgba(127, 255, 255, 0.75);
}

button {
color: rgba(127, 255, 255, 0.75);
background: transparent;
outline: 1px solid rgba(127, 255, 255, 0.75);
border: 0px;
padding: 5px 10px;
cursor: pointer;
}

button:hover {
background-color: rgba(0, 255, 255, 0.5);
}

button:active {
color: #000000;
background-color: rgba(0, 255, 255, 0.75);
}
</style>
</head>

<body>
<script src=＼"https://threejs.org/examples/jsm/libs/tween.module.min.js＼"></script>
<script src=＼"https://threejs.org/examples/jsm/controls/TrackballControls.js＼"></script>
<script src=＼"https://threejs.org/examples/jsm/renderers/CSS3DRenderer.js＼"></script>

<div id=＼"info＼"><a href=＼"http://piyocast.com/as＼" target=＼"_blank＼">AppleScript 3D UI Demonstration</a> By Piyomaru Software</div>
<div id=＼"container＼"></div>
<div id=＼"menu＼">
<button id=＼"table＼">TABLE</button>
<button id=＼"sphere＼">SPHERE</button>
<button id=＼"helix＼">HELIX</button>
<button id=＼"grid＼">GRID</button>
</div>

<!– <script> –>
<script type=＼"module＼">
import * as THREE from ’https://threejs.org/build/three.module.js’;
import { TWEEN } from ’https://threejs.org/examples/jsm/libs/tween.module.min.js’;
import { TrackballControls } from ’https://threejs.org/examples/jsm/controls/TrackballControls.js’;
import { CSS3DRenderer, CSS3DObject } from ’https://threejs.org/examples/jsm/renderers/CSS3DRenderer.js’;
　　　　
var table = [
＼"P＼", ＼"Hydrogen＼", ＼"1.00794＼", 1, 1,
＼"P＼", ＼"Helium＼", ＼"4.002602＼", 1, 2,
＼"P＼", ＼"Lithium＼", ＼"6.941＼", 1, 3,
＼"P＼", ＼"Beryllium＼", ＼"9.012182＼", 1, 4,
＼"P＼", ＼"Boron＼", ＼"10.811＼", 1, 5,
＼"P＼", ＼"Carbon＼", ＼"12.0107＼", 2, 1,
＼"P＼", ＼"Nitrogen＼", ＼"14.0067＼", 2, 3,
＼"P＼", ＼"Oxygen＼", ＼"15.9994＼", 3, 1,
＼"P＼", ＼"Fluorine＼", ＼"18.9984032＼", 3, 3,
＼"P＼", ＼"Flerovium＼", ＼"(289)＼", 4, 2,
＼"I＼", ＼"Moscovium＼", ＼"(290)＼", 6, 1,
＼"I＼", ＼"Livermorium＼", ＼"(293)＼", 6, 2,
＼"I＼", ＼"Tennessine＼", ＼"(294)＼", 6, 3,
＼"I＼", ＼"Titanium＼", ＼"47.867＼", 6, 4,
＼"I＼", ＼"Vanadium＼", ＼"50.9415＼", 6, 5,
＼"Y＼", ＼"Chromium＼", ＼"51.9961＼", 8, 1,
＼"Y＼", ＼"Manganese＼", ＼"54.938045＼", 9, 2,
＼"Y＼", ＼"Iron＼", ＼"55.845＼", 10, 3,
＼"Y＼", ＼"Cobalt＼", ＼"58.933195＼", 10, 4,
＼"Y＼", ＼"Nickel＼", ＼"58.6934＼", 10, 5,
＼"Y＼", ＼"Copper＼", ＼"63.546＼", 11, 2,
＼"Y＼", ＼"Zinc＼", ＼"65.38＼", 12, 1,
＼"O＼", ＼"Gallium＼", ＼"69.723＼", 14, 1,
＼"O＼", ＼"Copernicium＼", ＼"(285)＼", 14, 2,
＼"O＼", ＼"Nihonium＼", ＼"(286)＼", 14, 3,
＼"O＼", ＼"Oganesson＼", ＼"(294)＼", 14, 4,
＼"O＼", ＼"Neon＼", ＼"20.1797＼", 14, 5,
＼"O＼", ＼"Sodium＼", ＼"22.98976…＼", 15, 1,
＼"O＼", ＼"Magnesium＼", ＼"24.305＼", 15, 5,
＼"O＼", ＼"Aluminium＼", ＼"26.9815386＼", 16, 1,
＼"O＼", ＼"Silicon＼", ＼"28.0855＼", 16, 5,
＼"O＼", ＼"Phosphorus＼", ＼"30.973762＼", 17, 1,
＼"O＼", ＼"Sulfur＼", ＼"32.065＼", 17, 2,
＼"O＼", ＼"Chlorine＼", ＼"35.453＼", 17, 3,
＼"O＼", ＼"Argon＼", ＼"39.948＼", 17, 4,
＼"O＼", ＼"Potassium＼", ＼"39.948＼", 17, 5,
＼"M＼", ＼"Calcium＼", ＼"40.078＼", 1, 7,
＼"M＼", ＼"Scandium＼", ＼"44.955912＼", 1, 8,
＼"M＼", ＼"Roentgenium＼", ＼"(280)＼", 1, 9,
＼"M＼", ＼"Germanium＼", ＼"72.63＼", 1, 10,
＼"M＼", ＼"Lead＼", ＼"207.2＼", 1, 11,　　　　　　
＼"M＼", ＼"Arsenic＼", ＼"74.9216＼", 2, 8,
＼"M＼", ＼"Selenium＼", ＼"78.96＼", 3, 9,
＼"M＼", ＼"Bromine＼", ＼"79.904＼", 3, 10,
＼"M＼", ＼"Krypton＼", ＼"83.798＼", 4, 8,
＼"M＼", ＼"Rubidium＼", ＼"85.4678＼", 5, 7,
＼"M＼", ＼"Strontium＼", ＼"87.62＼", 5, 8,
＼"M＼", ＼"Yttrium＼", ＼"88.90585＼", 5, 9,
＼"M＼", ＼"Zirconium＼", ＼"91.224＼", 5, 10,
＼"M＼", ＼"Niobium＼", ＼"92.90628＼", 5, 11,
＼"A＼", ＼"Molybdenum＼", ＼"95.96＼", 7,8,
＼"A＼", ＼"Technetium＼", ＼"(98)＼", 7, 9,
＼"A＼", ＼"Ruthenium＼", ＼"101.07＼", 7, 10,
＼"A＼", ＼"Rhodium＼", ＼"102.9055＼",7, 11,
＼"A＼", ＼"Palladium＼", ＼"106.42＼", 8, 7,
＼"A＼", ＼"Silver＼", ＼"107.8682＼", 8,9,
＼"A＼", ＼"Cadmium＼", ＼"112.411＼", 9, 7,
＼"A＼", ＼"Indium＼", ＼"114.818＼", 9, 9,
＼"A＼", ＼"Tin＼", ＼"118.71＼", 10, 8,
＼"A＼", ＼"Antimony＼", ＼"121.76＼", 10, 9,
＼"A＼", ＼"Gadolinium＼", ＼"157.25＼", 10, 10,
＼"A＼", ＼"Terbium＼", ＼"158.92535＼", 10, 11,
＼"R＼", ＼"Dysprosium＼", ＼"162.5＼", 12, 7,
＼"R＼", ＼"Holmium＼", ＼"164.93032＼", 12, 8,
＼"R＼", ＼"Erbium＼", ＼"167.259＼", 12, 9,
＼"R＼", ＼"Thulium＼", ＼"168.93421＼", 12, 10,
＼"R＼", ＼"Ytterbium＼", ＼"173.054＼", 12, 11,
＼"R＼", ＼"Lutetium＼", ＼"174.9668＼", 13, 7,
＼"R＼", ＼"Hafnium＼", ＼"178.49＼", 13, 9,
＼"R＼", ＼"Samarium＼", ＼"150.36＼", 14, 7,
＼"R＼", ＼"Europium＼", ＼"151.964＼", 14, 9,
＼"R＼", ＼"Tantalum＼", ＼"180.94788＼", 15, 8,
＼"R＼", ＼"Tungsten＼", ＼"183.84＼", 15, 10,
＼"R＼", ＼"Rhenium＼", ＼"186.207＼", 15, 11,
＼"U＼", ＼"Osmium＼", ＼"190.23＼", 17, 7,
＼"U＼", ＼"Iridium＼", ＼"192.217＼", 17,8,
＼"U＼", ＼"Platinum＼", ＼"195.084＼", 17, 9,
＼"U＼", ＼"Gold＼", ＼"196.966569＼", 17, 10,
＼"U＼", ＼"Mercury＼", ＼"200.59＼", 18, 11,
＼"U＼", ＼"Thallium＼", ＼"204.3833＼", 19, 11,
＼"U＼", ＼"Bismuth＼", ＼"208.9804＼", 20, 7,
＼"U＼", ＼"Polonium＼", ＼"(209)＼", 20, 8,
＼"U＼", ＼"Astatine＼", ＼"(210)＼", 20, 9,
＼"U＼", ＼"Francium＼", ＼"(223)＼", 20, 10,
＼"U＼", ＼"Radium＼", ＼"(226)＼", 22, 9,
＼"U＼", ＼"Actinium＼", ＼"(227)＼", 22, 10,
＼"U＼", ＼"Thorium＼", ＼"232.03806＼", 22, 11,
＼"A＼", ＼"Protactinium＼", ＼"231.0588＼", 22, 7,
＼"A＼", ＼"Uranium＼", ＼"238.02891＼", 23, 9,
＼"A＼", ＼"Neptunium＼", ＼"(237)＼", 23, 8,
＼"A＼", ＼"Plutonium＼", ＼"(244)＼", 23, 9,
＼"A＼", ＼"Americium＼", ＼"(243)＼", 23, 10,
＼"A＼", ＼"Curium＼", ＼"(247)＼", 23, 11,
＼"S＼", ＼"Berkelium＼", ＼"(247)＼", 24, 7,
＼"S＼", ＼"Californium＼", ＼"(251)＼", 24, 8,
＼"S＼", ＼"Einstenium＼", ＼"(252)＼", 24, 9,
＼"S＼", ＼"Fermium＼", ＼"(257)＼", 24, 11,
＼"S＼", ＼"Mendelevium＼", ＼"(258)＼", 25, 7,
＼"S＼", ＼"Nobelium＼", ＼"(259)＼", 25, 9,
＼"S＼", ＼"Lawrencium＼", ＼"(262)＼", 25, 11,
＼"S＼", ＼"Rutherfordium＼", ＼"(267)＼", 26, 7,
＼"S＼", ＼"Dubnium＼", ＼"(268)＼", 26, 9,
＼"S＼", ＼"Seaborgium＼", ＼"(271)＼", 26, 10,
＼"S＼", ＼"Bohrium＼", ＼"(272)＼", 26, 11,
＼"A＼", ＼"Hassium＼", ＼"(270)＼", 27, 8,
＼"B＼", ＼"Meitnerium＼", ＼"(276)＼", 27, 9,
＼"C＼", ＼"Darmstadium＼", ＼"(281)＼", 27, 8,
＼"D＼", ＼"Tellurium＼", ＼"127.6＼", 27, 9,
＼"E＼", ＼"Iodine＼", ＼"126.90447＼", 27, 10,
＼"F＼", ＼"Xenon＼", ＼"131.293＼", 28, 9,
＼"G＼", ＼"Caesium＼", ＼"132.9054＼", 28, 10,
＼"H＼", ＼"Barium＼", ＼"132.9054＼", 28, 11,
＼"I＼", ＼"Lanthanum＼", ＼"138.90547＼", 29, 8,
＼"J＼", ＼"Cerium＼", ＼"140.116＼", 29, 9,
＼"K＼", ＼"Praseodymium＼", ＼"140.90765＼", 29, 10,
＼"L＼", ＼"Neodymium＼", ＼"144.242＼", 29, 8,
＼"M＼", ＼"Promethium＼", ＼"(145)＼", 29, 9,
　　＼"PS＼", ＼"Piyomaru Software＼", ＼"(PiyoPiyo)＼", 29, 10,　　
　　＼"AS＼", ＼"AppleScript＼", ＼"(osalang)＼", 29, 11,　　
];

var camera, scene, renderer;
var controls;
var objects = [];
var targets = { table: [], sphere: [], helix: [], grid: [] };
init();
animate();
　　　　
function init() {
camera = new THREE.PerspectiveCamera(40, window.innerWidth / window.innerHeight, 1, 10000);
camera.position.z = 3000;
scene = new THREE.Scene();
　　　　　　
// table
for (var i = 0; i < table.length; i += 5) {
　　　　　　
var element = document.createElement(’div’);
element.className = ’element’;

　　　　 //element.style.backgroundColor = ’rgba(128,0,64,’ + ( Math.random() * 0.5 + 0.25 ) + ’)’;
　　　　//element.style.backgroundColor = ’rgba(64,0,128,’ + ( Math.random() * 0.5 + 0.25 ) + ’)’;
//element.style.backgroundColor = ’rgba(0,0,0,’ + ( Math.random() * 0.5 + 0.25 ) + ’)’;
element.style.backgroundColor = ’rgba(0,127,127,’ + ( Math.random() * 0.5 + 0.25 ) + ’)’;
//element.style.backgroundColor = ’rgba(18,77,174,’ + (Math.random() * 0.5 + 0.25) + ’)’;

var number = document.createElement(’div’);
number.className = ’number’;
number.textContent = (i / 5) + 1;
element.appendChild(number);
var symbol = document.createElement(’div’);
symbol.className = ’symbol’;
symbol.textContent = table[i];
element.appendChild(symbol);
var details = document.createElement(’div’);
details.className = ’details’;
details.innerHTML = table[i + 1] + ’<br>’ + table[i + 2];
element.appendChild(details);
var object = new CSS3DObject(element);
object.position.x = Math.random() * 4000 – 2000;
object.position.y = Math.random() * 4000 – 2000;
object.position.z = Math.random() * 4000 – 2000;
scene.add(object);
objects.push(object);
//
var object = new THREE.Object3D();
object.position.x = (table[i + 3] * 140) – 1330;
object.position.y = – (table[i + 4] * 180) + 990;
targets.table.push(object);
}
　　　　　　
// sphere
var vector = new THREE.Vector3();
for (var i = 0, l = objects.length; i < l; i++) {
var phi = Math.acos(- 1 + (2 * i) / l);
var theta = Math.sqrt(l * Math.PI) * phi;
var object = new THREE.Object3D();
object.position.setFromSphericalCoords(800, phi, theta);
vector.copy(object.position).multiplyScalar(2);
object.lookAt(vector);
targets.sphere.push(object);
}
　　　　　　
// helix
var vector = new THREE.Vector3();
for (var i = 0, l = objects.length; i < l; i++) {
var theta = i * 0.175 + Math.PI;
var y = – (i * 8) + 450;
var object = new THREE.Object3D();
object.position.setFromCylindricalCoords(900, theta, y);
vector.x = object.position.x * 2;
vector.y = object.position.y;
vector.z = object.position.z * 2;
object.lookAt(vector);
targets.helix.push(object);
}
　　　　　　
// grid
for (var i = 0; i < objects.length; i++) {
var object = new THREE.Object3D();
object.position.x = ((i % 5) * 400) – 800;
object.position.y = (- (Math.floor(i / 5) % 5) * 400) + 800;
object.position.z = (Math.floor(i / 25)) * 1000 – 2000;
targets.grid.push(object);
}
　　　　　　
//
renderer = new CSS3DRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.getElementById(’container’).appendChild(renderer.domElement);
　　　　　　
//
controls = new TrackballControls(camera, renderer.domElement);
controls.minDistance = 500;
controls.maxDistance = 6000;
controls.addEventListener(’change’, render);
　　　　　　
var button = document.getElementById(’table’);
button.addEventListener(’click’, function () {
transform(targets.table, 2000);
}, false);
　　　　　　
var button = document.getElementById(’sphere’);
button.addEventListener(’click’, function () {
transform(targets.sphere, 2000);
}, false);
　　　　　　
var button = document.getElementById(’helix’);
button.addEventListener(’click’, function () {
transform(targets.helix, 2000);
}, false);
　　　　　　
var button = document.getElementById(’grid’);
button.addEventListener(’click’, function () {
transform(targets.grid, 2000);
}, false);
　　　　　　
transform(targets.table, 2000);
//
window.addEventListener(’resize’, onWindowResize, false);
}
　　　　
function transform(targets, duration) {
TWEEN.removeAll();
for (var i = 0; i < objects.length; i++) {
var object = objects[i];
var target = targets[i];
new TWEEN.Tween(object.position)
.to({ x: target.position.x, y: target.position.y, z: target.position.z }, Math.random() * duration + duration)
.easing(TWEEN.Easing.Exponential.InOut)
.start();
new TWEEN.Tween(object.rotation)
.to({ x: target.rotation.x, y: target.rotation.y, z: target.rotation.z }, Math.random() * duration + duration)
.easing(TWEEN.Easing.Exponential.InOut)
.start();
}
new TWEEN.Tween(this)
.to({}, duration * 2)
.onUpdate(render)
.start();
}
　　　　
function onWindowResize() {
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
renderer.setSize(window.innerWidth, window.innerHeight);
render();
}
　　　　
function animate() {
requestAnimationFrame(animate);
TWEEN.update();
controls.update();
}
　　　　
function render() {
renderer.render(scene, camera);
}
</script>
</body>

</html>"

set paramObj to {myMessage:"WebGL & three.js Test", mySubMessage:"This is a WebGL UI using charts.js", htmlStr:myStr}
–my browseStrWebContents:paramObj–for debug
my performSelectorOnMainThread:"browseStrWebContents:" withObject:(paramObj) waitUntilDone:true

on browseStrWebContents:paramObj
　　set aMainMes to myMessage of paramObj
　　set aSubMes to mySubMessage of paramObj
　　set htmlString to (htmlStr of paramObj)
　　
　　set aWidth to 1600
　　set aHeight to 950
　　
　　–WebViewをつくる
　　set aConf to WKWebViewConfiguration’s alloc()’s init()
　　
　　–指定HTML内のJavaScriptをFetch
　　set jsSource to pickUpFromToStr(htmlString, "<script src", "</script>") of me
　　
　　set userScript to WKUserScript’s alloc()’s initWithSource:jsSource injectionTime:(WKUserScriptInjectionTimeAtDocumentEnd) forMainFrameOnly:true
　　set userContentController to WKUserContentController’s alloc()’s init()
　　userContentController’s addUserScript:(userScript)
　　aConf’s setUserContentController:userContentController
　　
　　set aWebView to WKWebView’s alloc()’s initWithFrame:(current application’s NSMakeRect(0, 0, aWidth, aHeight)) configuration:aConf
　　aWebView’s setNavigationDelegate:me
　　aWebView’s setUIDelegate:me
　　aWebView’s setTranslatesAutoresizingMaskIntoConstraints:true
　　using terms from scripting additions
　　　　set bURL to |NSURL|’s fileURLWithPath:(POSIX path of (path to me))
　　end using terms from
　　aWebView’s loadHTMLString:htmlString baseURL:(bURL)
　　
　　— set up alert　　
　　set theAlert to NSAlert’s alloc()’s init()
　　tell theAlert
　　　　its setMessageText:aMainMes
　　　　its setInformativeText:aSubMes
　　　　its addButtonWithTitle:"OK"
　　　　–its addButtonWithTitle:"Cancel"
　　　　its setAccessoryView:aWebView
　　　　
　　　　set myWindow to its |window|
　　end tell
　　
　　— show alert in modal loop
　　NSRunningApplication’s currentApplication()’s activateWithOptions:0
　　my performSelectorOnMainThread:"doModal:" withObject:(theAlert) waitUntilDone:true
　　
　　–Stop Web View Action
　　set bURL to |NSURL|’s URLWithString:"about:blank"
　　set bReq to NSURLRequest’s requestWithURL:bURL
　　aWebView’s loadRequest:bReq
　　
　　if (my returnCode as number) = 1001 then error number -128
end browseStrWebContents:

on doModal:aParam
　　set (my returnCode) to (aParam’s runModal()) as number
end doModal:

on viewDidLoad:aNotification
　　return true
end viewDidLoad:

on array2DToJSONArray(aList)
　　set anArray to current application’s NSMutableArray’s arrayWithArray:aList
　　set jsonData to current application’s NSJSONSerialization’s dataWithJSONObject:anArray options:(0 as integer) |error|:(missing value) –0 is
　　set resString to current application’s NSString’s alloc()’s initWithData:jsonData encoding:(current application’s NSUTF8StringEncoding)
　　return resString
end array2DToJSONArray

★Click Here to Open This Script　

PDFにウォーターマーク画像を重ね合わせる2

Posted on 6月 4, 2020 by Takaaki Naganoya

指定のPDFにウォーターマークのPDFを重ね合わせるAppleScriptです。

これまでにもいろいろ試してきたのですが、不可能ではないものの、再配布が難しかったりアプリケーションに依存していたりで、決定版とはなっていませんでした。

macscripter.netにpeavine氏が投稿したScriptが元になっています。同氏のScriptではcpdfというコマンドラインツールが用いられており、これがなかなかいい感じです。実行時には、cpdfが/usr/local/binに入っている必要があります。Script Bundleの中に入れて呼び出してもよさそうです。

いい感じではあるものの、商用利用は許可されていないとのこと（要、購入）なので、商用利用時にはライセンスを購入すべきでしょう。再配布もできない雰囲気なので、自分のアプリケーション内に入れて呼び出すとかいうのは無理です。

ファイルの複数選択に、自分で作った「choosePathLib」を用いています。NSPathControlにドラッグ＆ドロップできるファイル種別を限定できるように作っておけばよかった、と反省しまくりました。

Watermark画像をPDFに重ね合わせる処理については、こういう外部ツールを併用しないでAppleScriptだけで済めばベストですが、、、、

▲オリジナルPDF

▲WatermarkのPDF。背景色に透明を指定している

▲処理対象ファイル選択

▲処理後のPDF。Watermarkが各ページに重ね合わされていることがわかる

▲処理後のPDFにはPDF Creator情報にcpdfのCopyrightが記入される

AppleScript名：PDFにウォーターマーク画像を重ね合わせる2

—
–　　Created by: peavine @macscripter.net
–　　Created on: 2020/06/04
–　　Modified by: Takaaki Naganoya @ Piyomaru Software
–　　cpdf
–　　https://community.coherentpdf.com

use AppleScript version "2.4" — Yosemite (10.10) or later
use framework "Foundation"
use scripting additions
use pLib : script "choosePathLib" –http://piyocast.com/as/asinyaye

set mesList to {"Logo PDF", "Source PDF"}
set defaultLocList to {"~/Movies", "~/Desktop"}

set cRes to choose multiple path main message "Drag & Drop to set target" sub message "" with titles mesList with default locations defaultLocList dialog width 800

set outFile to POSIX path of (choose file name with prompt "Select Output PDF File name")

copy cRes to {logoFile, sourceFile}

set logoFile to POSIX path of logoFile
set sourceFile to POSIX path of sourceFile

–check file extension = file type
if logoFile does not end with ".pdf" then error "Logo path is not pdf"
if sourceFile does not end with ".pdf" then error "Source file is not pdf"
if outFile does not end with ".pdf" then error "output path is not pdf"

try
　　do shell script "/usr/local/bin/cpdf -stamp-on " & quoted form of logoFile & " -center " & quoted form of sourceFile & " -o " & quoted form of outFile
end try

★Click Here to Open This Script　

アラートダイアログ上にWebViewでGoogle Chartを表示（Column Chart）

Posted on 6月 3, 2020 by Takaaki Naganoya

アラートダイアログ上にWkWebViewを配置し、Google Chartsを用いてカラムチャート（縦棒グラフ）を表示するAppleScriptです。

大枠はAppleScriptで、Cocoaの機能を活用してWkWebViewを動的に生成し、その中にJavaScript入りのHTMLを文字列で作って表示させ、WkWebView上でマウスカーソルの挙動に合わせて表示させる（このあたりはGoogle Chartsの機能）という、３階建ぐらいの構造のScriptです。

AppleScriptの配列変数（リスト型変数）をJavaScriptで扱えるJSON形式に変換して、HTML＋JavaScriptのテンプレートにはめこんで、WkWebViewに表示させてグラフ描画実行を行なっています。表示データをAppleScriptのデータ（リスト型変数）で与えられる点がチャームポイントです。

AppleScript名：アラートダイアログ上にWebViewでGoogle Chartを表示（Column Chart）.scptd

—
–　　Created by: Takaaki Naganoya
–　　Created on: 2020/05/30
—
–　　Copyright © 2020 Piyomaru Software, All Rights Reserved
—
use AppleScript version "2.4" — Yosemite (10.10) or later
use framework "Foundation"
use framework "AppKit"
use framework "WebKit"
use scripting additions

property returnCode : 0

set aList to {{"Year", "Sales", "Expenses", "Profit"}, ¬
　　{"2014", 1000, 400, 200}, ¬
　　{"2015", 1170, 460, 250}, ¬
　　{"2016", 660, 1120, 300}, ¬
　　{"2017", 1030, 540, 350}}

set aJsonArrayStr to array2DToJSONArray(aList) of me

–Pie Chart Template HTML
set myStr to "<!DOCTYPE html>
<html lang=＼"UTF-8＼">
<head>
<script type=＼"text/javascript＼" src=＼"https://www.gstatic.com/charts/loader.js＼"></script>

// Draw the chart and set the chart values
function drawChart() {
var data =google.visualization.arrayToDataTable(%@);

// Optional; add a title and set the width and height of the chart
var options = {
chart: {
title: ’Company Performance’,
subtitle: ’Sales, Expenses, and Profit: 2014-2017’,
}
};

// Display the chart inside the <div> element with id=＼"columnchart_values＼"
var chart = new google.charts.Bar(document.getElementById(＼"columnchart_material＼"));
chart.draw(data, google.charts.Bar.convertOptions(options));
}
</script>
<body>
<div id=＼"columnchart_material＼" style=＼"width: 800px; height: 200;＼"></div>
</body>
</html>"

set aString to current application’s NSString’s stringWithFormat_(myStr, aJsonArrayStr) as string

set paramObj to {myMessage:"Column Chart Test", mySubMessage:"This is a simple Column chart using google charts", htmlStr:aString}
–my browseStrWebContents:paramObj–for debug
my performSelectorOnMainThread:"browseStrWebContents:" withObject:(paramObj) waitUntilDone:true

on browseStrWebContents:paramObj
　　set aMainMes to myMessage of paramObj
　　set aSubMes to mySubMessage of paramObj
　　set htmlString to (htmlStr of paramObj)
　　
　　set aWidth to 820
　　set aHeight to 220
　　
　　–WebViewをつくる
　　set aConf to WKWebViewConfiguration’s alloc()’s init()
　　
　　–指定HTML内のJavaScriptをFetch
　　set jsSource to pickUpFromToStr(htmlString, "<script type=＼"text/javascript＼">", "</script>") of me
　　
　　set userScript to WKUserScript’s alloc()’s initWithSource:jsSource injectionTime:(WKUserScriptInjectionTimeAtDocumentEnd) forMainFrameOnly:true
　　set userContentController to WKUserContentController’s alloc()’s init()
　　userContentController’s addUserScript:(userScript)
　　aConf’s setUserContentController:userContentController
　　
　　set aWebView to WKWebView’s alloc()’s initWithFrame:(current application’s NSMakeRect(0, 0, aWidth, aHeight)) configuration:aConf
　　aWebView’s setNavigationDelegate:me
　　aWebView’s setUIDelegate:me
　　aWebView’s setTranslatesAutoresizingMaskIntoConstraints:true
　　using terms from scripting additions
　　　　set bURL to |NSURL|’s fileURLWithPath:(POSIX path of (path to me))
　　end using terms from
　　aWebView’s loadHTMLString:htmlString baseURL:(bURL)
　　
　　— set up alert　　
　　set theAlert to NSAlert’s alloc()’s init()
　　tell theAlert
　　　　its setMessageText:aMainMes
　　　　its setInformativeText:aSubMes
　　　　its addButtonWithTitle:"OK"
　　　　–its addButtonWithTitle:"Cancel"
　　　　its setAccessoryView:aWebView
　　　　
　　　　set myWindow to its |window|
　　end tell
　　
　　— show alert in modal loop
　　NSRunningApplication’s currentApplication()’s activateWithOptions:0
　　my performSelectorOnMainThread:"doModal:" withObject:(theAlert) waitUntilDone:true
　　
　　–Stop Web View Action
　　set bURL to |NSURL|’s URLWithString:"about:blank"
　　set bReq to NSURLRequest’s requestWithURL:bURL
　　aWebView’s loadRequest:bReq
　　
　　if (my returnCode as number) = 1001 then error number -128
end browseStrWebContents:

on doModal:aParam
　　set (my returnCode) to (aParam’s runModal()) as number
end doModal:

on viewDidLoad:aNotification
　　return true
end viewDidLoad:

on array2DToJSONArray(aList)
　　set anArray to current application’s NSMutableArray’s arrayWithArray:aList
　　set jsonData to current application’s NSJSONSerialization’s dataWithJSONObject:anArray options:(0 as integer) |error|:(missing value) –0 is
　　set resString to current application’s NSString’s alloc()’s initWithData:jsonData encoding:(current application’s NSUTF8StringEncoding)
　　return resString
end array2DToJSONArray

★Click Here to Open This Script　

アラートダイアログ上にWebViewでGoogle Chartを表示（Bubble Chart）

Posted on 6月 1, 2020 by Takaaki Naganoya

アラートダイアログ上にWkWebViewを配置し、Google Chartsを用いてバブルチャートを表示するAppleScriptです。

バブルチャートというのは、３軸の数値の組みわせデータをX軸とY軸に加え、バブル（円）のサイズでもう１軸表現したもののようです。

サンプルでは、X軸に平均寿命、Y軸に出生率、Z軸に人口をとっています。データ件数がそんなに多くなくて、データが散らばっている場合にはその傾向がよく把握できそうです（本グラフのように）。

自動処理のワークフローにおいて本Scriptがどの程度役立つかについては、いろいろ考えてみたものの「多分、Blogに掲載するぐらいしか使い道がないよね！」というところでしょうか。やはり、オーソドックスな円グラフや棒グラフのほうが使い手がよさそうです。あとは、デモンストレーションぐらいでしょうか。Google Chartsを用いたダイアログ部品自体が、デモ向けのそれほど意味のなさそうな内容であります。

AppleScript名：アラートダイアログ上にWebViewでGoogle Chartを表示（Bubble Chart）.scptd

property returnCode : 0

set aList to {{"ID", "平均寿命", "出生率", "地域", "人口"}, ¬
　　{"CAN", 80.66, 1.67, "北米", 33739900}, ¬
　　{"DEU", 79.84, 1.36, "欧州", 81902307}, ¬
　　{"DNK", 78.6, 1.84, "欧州", 5523095}, ¬
　　{"EGY", 72.73, 2.78, "中東", 79716203}, ¬
　　{"GBR", 80.05, 2, "欧州", 61801570}, ¬
　　{"IRN", 72.49, 1.7, "中東", 73137148}, ¬
　　{"IRQ", 68.09, 4.77, "中東", 31090763}, ¬
　　{"ISR", 81.55, 2.96, "中東", 7485600}, ¬
　　{"RUS", 68.6, 1.54, "欧州", 141850000}, ¬
　　{"USA", 78.09, 2.05, "北米", 307007000}}

set aJsonArrayStr to array2DToJSONArray(aList) of me

–Pie Chart Template HTML
set myStr to "<!DOCTYPE html>
<html lang=＼"UTF-8＼">
<head>
<script type=＼"text/javascript＼" src=＼"https://www.gstatic.com/charts/loader.js＼"></script>
<script type=＼"text/javascript＼">
// Load google charts
google.charts.load(’current’, {’packages’:[’corechart’]});
google.charts.setOnLoadCallback(drawSeriesChart);

// Draw the chart and set the chart values
function drawSeriesChart() {
var data =google.visualization.arrayToDataTable(%@);

// Optional; add a title and set the width and height of the chart
var options = {
title: ’Correlation between life expectancy, fertility rate ’ + ’and population of some world countries (2010)’,
hAxis: {title: ’平均寿命’},
vAxis: {title: ’出生率’},
bubble: {textStyle: {fontSize: 11}} };

// Display the chart inside the <div> element with id=＼"barchart＼"
var chart = new google.visualization.BubbleChart(document.getElementById(’series_chart_div’));
chart.draw(data, options);
}
</script>
<body>
<div id=＼"series_chart_div＼" style=＼"width: 800px; height: 200;＼"></div>
</body>
</html>"

set aString to current application’s NSString’s stringWithFormat_(myStr, aJsonArrayStr) as string

set paramObj to {myMessage:"Bubble Chart Test", mySubMessage:"This is a simple Bubble Chart using google charts", htmlStr:aString}
–my browseStrWebContents:paramObj–for debug
my performSelectorOnMainThread:"browseStrWebContents:" withObject:(paramObj) waitUntilDone:true

on doModal:aParam
　　set (my returnCode) to (aParam’s runModal()) as number
end doModal:

on viewDidLoad:aNotification
　　return true
end viewDidLoad:

on array2DToJSONArray(aList)
　　set anArray to current application’s NSMutableArray’s arrayWithArray:aList
　　set jsonData to current application’s NSJSONSerialization’s dataWithJSONObject:anArray options:(0 as integer) |error|:(missing value) –0 is
　　set resString to current application’s NSString’s alloc()’s initWithData:jsonData encoding:(current application’s NSUTF8StringEncoding)
　　return resString
end array2DToJSONArray

★Click Here to Open This Script　

アラートダイアログ上にWebViewでGoogle Chartを表示（Gantt Chart）

Posted on 6月 1, 2020 by Takaaki Naganoya

アラートダイアログ上にWkWebViewを配置し、Google Chartsを用いてガントチャートを表示するAppleScriptです。

ガントチャートの表示が行えるのは、なかなか便利そうです。ガントチャート系でAppleScriptから操作が行えるのは、Omni Planぐらいなので、ガントチャート表示用部品が増えるのはいいことです。

＃　ただ、ガントチャートのデータをもとに自動処理したことはありません。人間との間で行う対話処理が重要なので、自動処理で「あとはよろしくぅ！」というワークフローがそんなに思いつきません（予定が変わった担当者に自動で連絡しておくぐらい？）

何らかのデータ処理を行なった末にガントチャートで結果を表示する……という流れになるとは思うのですが、結果に納得できない場合にデータ修正できるようになっていないと、「なんですかそれは？」という話になりかねません。

なので、表UIでデータを入力し、その内容を反映させたガントチャートを表示。表UIとガントチャートの間で自由に行き来できる必要があります。Google Chartsではこのように複数のグラフUIを組み合わせる（並べて表示、再描画を連動）こともできるため、そういう組み合わせで利用するための「下調べ」といったところでしょう。

AppleScript名：アラートダイアログ上にWebViewでGoogle Chartを表示（Gantt Chart）.scptd

—
–　　Created by: Takaaki Naganoya
–　　Created on: 2020/05/27
—
–　　Copyright © 2020 Piyomaru Software, All Rights Reserved
—
use AppleScript version "2.4" — Yosemite (10.10) or later
use framework "Foundation"
use framework "AppKit"
use framework "WebKit"
use scripting additions

property |NSURL| : a reference to current application’s |NSURL|
property NSAlert : a reference to current application’s NSAlert
property NSArray : a reference to current application’s NSArray
property NSString : a reference to current application’s NSString
property NSButton : a reference to current application’s NSButton
property NSBundle : a reference to current application’s NSBundle
property WKWebView : a reference to current application’s WKWebView
property WKUserScript : a reference to current application’s WKUserScript
property NSURLRequest : a reference to current application’s NSURLRequest
property NSRunningApplication : a reference to current application’s NSRunningApplication
property NSUTF8StringEncoding : a reference to current application’s NSUTF8StringEncoding
property WKUserContentController : a reference to current application’s WKUserContentController
property WKWebViewConfiguration : a reference to current application’s WKWebViewConfiguration
property WKUserScriptInjectionTimeAtDocumentEnd : a reference to current application’s WKUserScriptInjectionTimeAtDocumentEnd

property returnCode : 0
property aBrowserAgentRes : ""

–Sample Data
–set aJsonArrayStr to array2DToJSONArray(aList) of me

–Map Template HTML
set myStr to "<!DOCTYPE html>
<html lang=＼"UTF-8＼">
<head>
<script type=＼"text/javascript＼" src=＼"https://www.gstatic.com/charts/loader.js＼"></script>

–set aString to NSString’s stringWithFormat_(myStr, aJsonArrayStr) as string

set paramObj to {myMessage:"Google Gantt Chart Test", mySubMessage:"This is a simple Gantt Chart using google charts", htmlStr:myStr}
–my browseStrWebContents:paramObj –for debug
my performSelectorOnMainThread:"browseStrWebContents:" withObject:(paramObj) waitUntilDone:true

on browseStrWebContents:paramObj
　　set aMainMes to myMessage of paramObj
　　set aSubMes to mySubMessage of paramObj
　　set htmlString to (htmlStr of paramObj)
　　
　　set aWidth to 1000
　　set aHeight to 300
　　
　　–WebViewをつくる
　　set aConf to WKWebViewConfiguration’s alloc()’s init()
　　
　　–指定HTML内のJavaScriptをFetch
　　set jsSource to pickUpFromToStr(htmlString, "<script type=＼"text/javascript＼">", "</script>") of me
　　
　　set userScript to WKUserScript’s alloc()’s initWithSource:jsSource injectionTime:(WKUserScriptInjectionTimeAtDocumentEnd) forMainFrameOnly:true
　　set userContentController to WKUserContentController’s alloc()’s init()
　　userContentController’s addUserScript:(userScript)
　　aConf’s setUserContentController:userContentController
　　
　　set aWebView to WKWebView’s alloc()’s initWithFrame:(current application’s NSMakeRect(0, 0, aWidth, aHeight)) configuration:aConf
　　aWebView’s setNavigationDelegate:me
　　aWebView’s setUIDelegate:me
　　aWebView’s setTranslatesAutoresizingMaskIntoConstraints:true
　　
　　set bURL to |NSURL|’s fileURLWithPath:(POSIX path of (path to me))
　　aWebView’s loadHTMLString:htmlString baseURL:(bURL)
　　
　　— set up alert　　
　　set theAlert to NSAlert’s alloc()’s init()
　　tell theAlert
　　　　its setMessageText:aMainMes
　　　　its setInformativeText:aSubMes
　　　　its addButtonWithTitle:"OK"
　　　　–its addButtonWithTitle:"Cancel"
　　　　its setAccessoryView:aWebView
　　　　
　　　　set myWindow to its |window|
　　end tell
　　
　　— show alert in modal loop
　　NSRunningApplication’s currentApplication()’s activateWithOptions:0
　　my performSelectorOnMainThread:"doModal:" withObject:(theAlert) waitUntilDone:true
　　
　　–Stop Web View Action
　　set bURL to |NSURL|’s URLWithString:"about:blank"
　　set bReq to NSURLRequest’s requestWithURL:bURL
　　aWebView’s loadRequest:bReq
　　
　　if (my returnCode as number) = 1001 then error number -128
end browseStrWebContents:

on doModal:aParam
　　set (my returnCode) to (aParam’s runModal()) as number
end doModal:

on viewDidLoad:aNotification
　　return true
end viewDidLoad:

on array2DToJSONArray(aList)
　　set anArray to current application’s NSMutableArray’s arrayWithArray:aList
　　set jsonData to current application’s NSJSONSerialization’s dataWithJSONObject:anArray options:(0 as integer) |error|:(missing value) –0 is
　　set resString to NSString’s alloc()’s initWithData:jsonData encoding:(NSUTF8StringEncoding)
　　return resString
end array2DToJSONArray

★Click Here to Open This Script　

アラートダイアログ上にWebViewでGoogle Chartを表示（Bar Chart）

Posted on 5月 30, 2020 by Takaaki Naganoya

アラートダイアログ上にWkWebViewを配置し、Google Chartsを用いてbarChartを表示するAppleScriptです。

Googleのオンラインドキュメント品質が一定になっておらず、一番簡単なはずの棒グラフを書かせるのに手間取ってしまいました。

Cocoa Scriptingを始めた当初は、このJavaScriptを含んだHTMLコンテンツをダイアログ上に表示してインタラクティブな表示を行わせるなど、夢のまた夢という感じでしたが、いまでは見慣れた光景になってしまいました。

箱庭ダイアログ系AppleScriptも、YouTubeの動画表示ができるようになった頃から、進化にはずみがついた気がします。

ひととおりGoogle Chartsを表示できるようになったので、チャート表示のScript Libraryにまとめ、sdef（AppleScript用語辞書）をかぶせてカプセル化するといい感じでしょうか。Google Charts Scripting Libとかいって、display google chartコマンドを実行するのでしょうか。そこまで作り込むと、無料公開は勘弁して欲しいところですけれども。

AppleScript名：アラートダイアログ上にWebViewでGoogle Chartを表示（Bar Chart）v2.scptd

—
–　　Created by: Takaaki Naganoya
–　　Created on: 2019/03/02
—
–　　Copyright © 2019 Piyomaru Software, All Rights Reserved
—
use AppleScript version "2.4" — Yosemite (10.10) or later
use framework "Foundation"
use framework "AppKit"
use framework "WebKit"
use scripting additions

property returnCode : 0

set aList to {{"City", "2010 Population", "2000 Population"}, ¬
　　{"New York City, NY", 8175000, 8008000}, ¬
　　{"Los Angeles, CA", 3792000, 3694000}, ¬
　　{"Chicago, IL", 2695000, 2896000}, ¬
　　{"Houston, TX", 2099000, 1953000}, ¬
　　{"Philadelphia, PA", 1526000, 1517000}}

set aJsonArrayStr to array2DToJSONArray(aList) of me

–Pie Chart Template HTML
set myStr to "<!DOCTYPE html>
<html lang=＼"UTF-8＼">
<head>
<script type=＼"text/javascript＼" src=＼"https://www.gstatic.com/charts/loader.js＼"></script>

// Draw the chart and set the chart values
function drawChart() {
var data =google.visualization.arrayToDataTable(%@);

// Optional; add a title and set the width and height of the chart
var options = {
　　title: ’Population’,
　　chartArea: {width: ’400’},
　　isStacked: true,
　　hAxis: {
　　 title: ’Total Population’,
　　 minValue: 0,
　　},
　　vAxis: {
　　 title: ’City’
　　}
};

// Display the chart inside the <div> element with id=＼"barchart＼"
var chart = new google.visualization.BarChart(document.getElementById(＼"barchart_values＼"));
chart.draw(data, options);
}
</script>
<body>
<div id=＼"barchart_values＼" style=＼"width: 800px; height: 200;＼"></div>
</body>
</html>"

set aString to current application’s NSString’s stringWithFormat_(myStr, aJsonArrayStr) as string

set paramObj to {myMessage:"Bar Chart Test", mySubMessage:"This is a simple bar chart using google charts", htmlStr:aString}
–my browseStrWebContents:paramObj–for debug
my performSelectorOnMainThread:"browseStrWebContents:" withObject:(paramObj) waitUntilDone:true

on doModal:aParam
　　set (my returnCode) to (aParam’s runModal()) as number
end doModal:

on viewDidLoad:aNotification
　　return true
end viewDidLoad:

on array2DToJSONArray(aList)
　　set anArray to current application’s NSMutableArray’s arrayWithArray:aList
　　set jsonData to current application’s NSJSONSerialization’s dataWithJSONObject:anArray options:(0 as integer) |error|:(missing value) –0 is
　　set resString to current application’s NSString’s alloc()’s initWithData:jsonData encoding:(current application’s NSUTF8StringEncoding)
　　return resString
end array2DToJSONArray

★Click Here to Open This Script　

アラートダイアログ上にWebViewでGoogle Chartを表示（WordTree）

Posted on 5月 29, 2020 by Takaaki Naganoya

アラートダイアログ上にWkWebViewを配置し、Google Chartsを用いてWordTreeを表示するAppleScriptです。

Mindmap風の図を表示するので、純粋にMindmapの表示部品として使えるとよさそうですが、そういうわけでもないようです。図を表示するだけです。

また、Wordtree中の途中のノードを選択するとツリーが閉じたりしますが、どのノードを選択したかといった情報を（現状では）取得できるわけでもないため、超多項目の選択User Interfaceに使いたい場合に「使えそうで使えない」という浮世離れした部品になっています。

一応、JavaScript内ではノードのクリックイベントを拾うことができましたが、selectionで得られる属性値が「word」「color」「weight」といった、個別にノードを特定できる値ではないものばかりなので（idぐらい取れてもいいんやで）、選択UIとして使うのはつらそうです。さらに、WkWebView内のJavaScriptからその「外側の外側」にいるAppleScriptにイベントや値を渡す方法がさっぱり見つかりません。JavaScript側からローカルのファイル……に書けそうな気配はないので、cookie経由で値を受け渡すぐらいでしょうか。

▲Appleのサンプルコード「TreeView」（Written in Objective-C）。これがもっと使いまわしやすい部品として書きこなれていればいいのですが、、、、

＃　Mindmap風の選択UIは、なかなか手を加えてすぐに使いまわしやすい部品になっていなくて、、

プログラム自体は他のScriptとの共有部品ばかりで、新規に起こしたものはほとんどありません。

▲選択肢をツリーで描画してクリック選択でき、選択した内容をもとに処理できるという意味ではGraphViz＋Dot言語が難易度低くていい感じ？（実際に使っています）

▲これもゆくゆくは多項目表示の部品として利用？　制約条件（不自由さ）を設けることで発想につなげようというコンセプトなので、自由なデータ表現の部品にはならないという見方も

AppleScript名：アラートダイアログ上にWebViewでGoogle Chartを表示（WordTree1）.scptd

property returnCode : 0
property aBrowserAgentRes : ""

–Sample Data
set aList to {{"Phrases"}, ¬
　　{"cats are better than dogs"}, ¬
　　{"cats eat kibble"}, ¬
　　{"cats are better than hamsters"}, ¬
　　{"cats are awesome"}, ¬
　　{"cats are people too"}, ¬
　　{"cats eat mice"}, ¬
　　{"cats meowing"}, ¬
　　{"cats in the cradle"}, ¬
　　{"cats eat mice"}, ¬
　　{"cats in the cradle lyrics"}, ¬
　　{"cats eat kibble"}, ¬
　　{"cats for adoption"}, ¬
　　{"cats are family"}, ¬
　　{"cats eat mice"}, ¬
　　{"cats are better than kittens"}, ¬
　　{"cats are evil"}, ¬
　　{"cats are weir"}, ¬
　　{"cats eat mice"}}

set aJsonArrayStr to array2DToJSONArray(aList) of me

–Map Template HTML
set myStr to "<!DOCTYPE html>
<html lang=＼"UTF-8＼">
<head>
<script type=＼"text/javascript＼" src=＼"https://www.gstatic.com/charts/loader.js＼"></script>

set aString to NSString’s stringWithFormat_(myStr, aJsonArrayStr) as string

set paramObj to {myMessage:"Google Word Tree Test", mySubMessage:"This is a simple Word Tree using google charts", htmlStr:aString}
–my browseStrWebContents:paramObj –for debug
my performSelectorOnMainThread:"browseStrWebContents:" withObject:(paramObj) waitUntilDone:true

on browseStrWebContents:paramObj
　　set aMainMes to myMessage of paramObj
　　set aSubMes to mySubMessage of paramObj
　　set htmlString to (htmlStr of paramObj)
　　
　　set aWidth to 920
　　set aHeight to 540
　　
　　–WebViewをつくる
　　set aConf to WKWebViewConfiguration’s alloc()’s init()
　　
　　–指定HTML内のJavaScriptをFetch
　　set jsSource to pickUpFromToStr(htmlString, "<script type=＼"text/javascript＼">", "</script>") of me
　　
　　set userScript to WKUserScript’s alloc()’s initWithSource:jsSource injectionTime:(WKUserScriptInjectionTimeAtDocumentEnd) forMainFrameOnly:true
　　set userContentController to WKUserContentController’s alloc()’s init()
　　userContentController’s addUserScript:(userScript)
　　aConf’s setUserContentController:userContentController
　　
　　set aWebView to WKWebView’s alloc()’s initWithFrame:(current application’s NSMakeRect(0, 0, aWidth, aHeight)) configuration:aConf
　　aWebView’s setNavigationDelegate:me
　　aWebView’s setUIDelegate:me
　　aWebView’s setTranslatesAutoresizingMaskIntoConstraints:true
　　
　　set bURL to |NSURL|’s fileURLWithPath:(POSIX path of (path to me))
　　aWebView’s loadHTMLString:htmlString baseURL:(bURL)
　　
　　— set up alert　　
　　set theAlert to NSAlert’s alloc()’s init()
　　tell theAlert
　　　　its setMessageText:aMainMes
　　　　its setInformativeText:aSubMes
　　　　its addButtonWithTitle:"OK"
　　　　–its addButtonWithTitle:"Cancel"
　　　　its setAccessoryView:aWebView
　　　　
　　　　set myWindow to its |window|
　　end tell
　　
　　— show alert in modal loop
　　NSRunningApplication’s currentApplication()’s activateWithOptions:0
　　my performSelectorOnMainThread:"doModal:" withObject:(theAlert) waitUntilDone:true
　　
　　–Stop Web View Action
　　set bURL to |NSURL|’s URLWithString:"about:blank"
　　set bReq to NSURLRequest’s requestWithURL:bURL
　　aWebView’s loadRequest:bReq
　　
　　if (my returnCode as number) = 1001 then error number -128
end browseStrWebContents:

on doModal:aParam
　　set (my returnCode) to (aParam’s runModal()) as number
end doModal:

on viewDidLoad:aNotification
　　return true
end viewDidLoad:

on array2DToJSONArray(aList)
　　set anArray to current application’s NSMutableArray’s arrayWithArray:aList
　　set jsonData to current application’s NSJSONSerialization’s dataWithJSONObject:anArray options:(0 as integer) |error|:(missing value) –0 is
　　set resString to NSString’s alloc()’s initWithData:jsonData encoding:(NSUTF8StringEncoding)
　　return resString
end array2DToJSONArray

★Click Here to Open This Script　

AppleScriptの穴

Useful & Practical AppleScript archive. Click '★Click Here to Open This Script' Link to download each AppleScript

カテゴリー: dialog

Mermaid.jsでPie Chartをダイアログ表示

AMChartsでワードクラウドをダイアログ上に表示 v2

AMChartsで点滅ポイントつき世界地図をダイアログ上に表示 v2

ZingChart.jsでヒートマップをダイアログ上に表示

Vis.jsでGraphvizをダイアログ上に表示 v2

アラートダイアログ上にWebViewでvis.jsを用いて3Dグラフを表示

アラートダイアログ上にWebViewでCesiumを用いて地球儀上に地図を表示

アラートダイアログ上のWebViewでGio.jsを用いて地球儀＋データアニメーション表示 v2a

アラートダイアログ上にWebViewでChart.jsを表示（Pie Chart） v2

アラートダイアログ上にd3-cloudを用いてワードクラウドを表示

アラートダイアログ上にWebViewで3Dコンテンツを表示（WebGL＋three.js）

PDFにウォーターマーク画像を重ね合わせる2

アラートダイアログ上にWebViewでGoogle Chartを表示（Column Chart）

アラートダイアログ上にWebViewでGoogle Chartを表示（Bubble Chart）

アラートダイアログ上にWebViewでGoogle Chartを表示（Gantt Chart）

アラートダイアログ上にWebViewでGoogle Chartを表示（Bar Chart）

アラートダイアログ上にWebViewでGoogle Chartを表示（WordTree）