2027.8.10<\/p>\n\n<\/iframe>\n\n\n\n<p class=\"wp-block-paragraph\"><strong><a href=\"https:\/\/www.pirika.com\/wp\/chemistry-at-pirika-com\">pirika.com\u3067\u5316\u5b66<\/a> <\/strong><br>\u3000><strong><strong><a href=\"https:\/\/www.pirika.com\/wp\/chemistry-at-pirika-com\">\u30c1\u30e3\u30d4\u30a8\u30e2\u30f3-3rd Pirika Origin (CPO)<\/a><\/strong><\/strong><br>\u3000<strong>> <a href=\"https:\/\/www.pirika.com\/wp\/chemistry-at-pirika-com\/hsp\">\u30cf\u30f3\u30bb\u30f3\u6eb6\u89e3\u5ea6\u30d1\u30e9\u30e1\u30fc\u30bf (HSP)<\/a><\/strong><br>\u3000<strong>> <a href=\"https:\/\/www.pirika.com\/wp\/chemistry-at-pirika-com\/chemistry\">\u5316\u5b66\u5168\u822c<\/a><\/strong><br>\u3000><strong><a href=\"https:\/\/www.pirika.com\/wp\/chemistry-at-pirika-com\/pirikapro\"><mark>Pirika \u30c4\u30fc\u30eb\u7fa4<\/mark><\/a><br><a href=\"https:\/\/www.pirika.com\/wp\/blog\">\u30d6\u30ed\u30b0<\/a><br><a href=\"https:\/\/www.pirika.com\/wp\/services\">\u696d\u52d9\u6848\u5185<\/a> <br><a href=\"https:\/\/www.pirika.com\/wp\/question\">\u304a\u554f\u3044\u5408\u308f\u305b<\/a><\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong><a href=\"https:\/\/www.pirika.com\/wp\/chemistry-at-pirika-com\/pirikapro\">Pirika \u30c4\u30fc\u30eb\u7fa4<\/a><\/strong> > <strong><a href=\"https:\/\/www.pirika.com\/wp\/chemistry-at-pirika-com\/pirikapro\/hspipp\">HSPiP\u30d7\u30e9\u30b9<\/a><\/strong> ><strong> SphereViewer<\/strong><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">HSPiP\u30d7\u30e9\u30b9<\/h2>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><a href=\"http:\/\/www.pirika.com\/wp\/wp-content\/uploads\/2026\/06\/HSPModoki.png\"><img loading=\"lazy\" decoding=\"async\" width=\"400\" height=\"190\" src=\"http:\/\/www.pirika.com\/wp\/wp-content\/uploads\/2026\/06\/HSPModoki.png\" alt=\"\" class=\"wp-image-16057\" style=\"aspect-ratio:2.10537155580295;width:591px;height:auto\" srcset=\"https:\/\/www.pirika.com\/wp\/wp-content\/uploads\/2026\/06\/HSPModoki.png 400w, https:\/\/www.pirika.com\/wp\/wp-content\/uploads\/2026\/06\/HSPModoki-300x143.png 300w\" sizes=\"auto, (max-width: 400px) 85vw, 400px\" \/><\/a><figcaption class=\"wp-element-caption\">HSPiP\u30d7\u30e9\u30b9<\/figcaption><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e\u30bd\u30d5\u30c8\u306b\u306f\u30012025\u5e74HSPiP ver.6.2\u3092\u4f5c\u3063\u305f\u969b\u306b\u3001\u79c1\uff08pirika.com \u793eCEO, \u5c71\u672c\u535a\u5fd7)\u304c\u6e96\u5099\u3057\u305f\u304c\u3001Abbott\u6559\u6388\u306e\u62d2\u5426\u6a29\u3067\u642d\u8f09\u3055\u308c\u306a\u304b\u3063\u305f\u6a5f\u80fd\u3092\u642d\u8f09\u3057\u3066\u3044\u308b\u3002<br>2026.8.6\u6700\u521d\u306e\u30d0\u30fc\u30b8\u30e7\u30f3\u304c\u30ea\u30ea\u30fc\u30b9\u3055\u308c\u305f\u3002\u8a00\u8449\u3067\u8aac\u660e\u3057\u3066\u3082\u308f\u304b\u308a\u306b\u304f\u3044\u3002<a href=\"https:\/\/www.pirika.com\/wp\/chemistry-at-pirika-com\/pirikapro\/hspipp\/hspipp-image\">\u52d5\u4f5c\u306e\u30a4\u30e1\u30fc\u30b8\u3092\u4f53\u9a13\u3067<\/a>\u304d\u308b\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">[1. SphereViewer]<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u6eb6\u5a92\u3084\u30dd\u30ea\u30de\u30fc\u306eHSP\u5024\u3067\u30c6\u30fc\u30d6\u30eb\u304c\u57cb\u307e\u3063\u3066\u3044\u308b\u3068\u3001\u305d\u306eHSP\u5024\u3092\uff13\u6b21\u5143\u7a7a\u9593\u306b\u30d7\u30ed\u30c3\u30c8\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u308b\u3002HSPiP\u3067\u306f3D\u3057\u304b\u30b5\u30dd\u30fc\u30c8\u3057\u306a\u3044\u306e\u3067\u3001dH<sup>2<\/sup>=dHD<sup>2<\/sup>+dHA<sup>2<\/sup>\u306b\u5909\u63db\u3057\u3066\uff14\u6b21\u5143\u30c7\u30fc\u30bf\u3092\uff13\u6b21\u5143\u3067\u898b\u3066\u3044\u308b\u3002HSPiP\u30d7\u30e9\u30b9\u3067\u306f\u03b4HD, \u03b4HA\u3092\u8ef8\u3092\u30e9\u30b8\u30aa\u30dc\u30bf\u30f3\u3067\u5207\u308a\u66ff\u3048\u3066\u8868\u793a\u3059\u308b\u3002\u7406\u89e3\u306f\u3057\u306b\u304f\u3044\u304c\u3001\u591a\u304f\u306e\u6d1e\u5bdf\u3092\u4e0e\u3048\u308b\u3002HSPiP\u306e\u8868\u793a\u3067\u306f\u4f7f\u3046\u610f\u5473\u306f\u307b\u3068\u3093\u3069\u306a\u3044\u3002\u6211\u304c\u793e\u3078\u306e\u6d3e\u9063AI\u793e\u54e1\u3001\u30c9\u30e9\u7f8e\u4f3c\u304c\u62e1\u5f35HSPiP\u30d5\u30a9\u30fc\u30de\u30c3\u30c8\u306e\u30c7\u30fc\u30bf\u3068Sphere\u63a2\u7d22\u7d50\u679c\u3092\u30d6\u30e9\u30a6\u30b6\u30fc\u3067\u8868\u793a\u3059\u308bSPhereViewer.html\u3092\u3064\u304f\u3063\u3066\u304f\u308c\u305f\u3002\u6b21\u671f\u30d0\u30fc\u30b8\u30e7\u30f3\u30a2\u30c3\u30d7\u3067\u516c\u958b\u3059\u308b\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">[2. SPhereViewer.html]<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u666e\u901a\u306ehtml\u30d5\u30a1\u30a4\u30eb\u306a\u306e\u3067\u30c0\u30d6\u30eb\u30af\u30ea\u30c3\u30af\u3059\u308b\u3068\u30d6\u30e9\u30a6\u30b6\u30fc\u304c\u7acb\u3061\u4e0a\u304c\u308a\u6eb6\u5a92\u3068\u30cf\u30f3\u30bb\u30f3\u6eb6\u89e3\u7403\u304c\u8868\u793a\u3055\u308c\u308b\u3002Canvas\u306e\u30a4\u30e1\u30fc\u30b8\u3092\u30b9\u30ca\u30c3\u30d7\u30b7\u30e7\u30c3\u30c8\u3059\u308b\u6a5f\u80fd\u3082\u3064\u3044\u3066\u3044\u308b\u306e\u3067\u8cc7\u6599\u4f5c\u6210\u306b\u306f\u5f79\u306b\u305f\u3064\u3002\u30a4\u30f3\u30bf\u30fc\u30e9\u30af\u30c6\u30a3\u30d6\u306b\u7d50\u679c\u3092\u30d7\u30ec\u30bc\u30f3\u3057\u305f\u3044\u5834\u5408\u306b\u597d\u90fd\u5408\u3067\u3042\u308b\u3002\u305f\u3060\u3057\u3001\uff13\u6b21\u5143\u8868\u793a\u3059\u308b\u305f\u3081\u306b\u3001\u30cd\u30c3\u30c8\u4e0a\u306b\u3042\u308bjs(Three.min.js\u3068OrbitControls.js)\u3092\u547c\u3076\u306e\u3067\u30cd\u30c3\u30c8\u306e\u30a2\u30af\u30bb\u30b9\u3092\u884c\u3046\u30bd\u30d5\u30c8\u306b\u306a\u308b\u3002pirika\u306e\u30c4\u30fc\u30eb\u306f\u57fa\u672c\u30cd\u30c3\u30c8\u3078\u30a2\u30af\u30bb\u30b9\u3057\u306a\u3044\u3002pirika\u306eHP\u306b\u8f09\u305b\u308b\u7528\u306e<span style=\"text-decoration: underline;\">html\u306f\u30cd\u30c3\u30c8\u30a2\u30af\u30bb\u30b9\u3092\u884c\u3046\u306e\u3067\u5229\u7528\u6642\u306b\u306f\u6ce8\u610f\u3057\u3066\u307b\u3057\u3044<\/span>\u3002<\/p>\n\n\n\n<meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Pirika SphereViewer 3D \/ 4D (Hansen Solubility Sphere)<\/title>\n <script type=\"application\/ld+json\">{\n \"@context\": \"https:\/\/schema.org\",\n \"@type\": \"Dataset\",\n \"name\": \"Hansen Space Viewer\",\n \"description\": \"pirika.com\u793e\u5c71\u672cCEO\u3068\u30c9\u30e9\u7f8e\u4f3c\uff08google\u306eGemini)\u306b\u3088\u308bAI\u30fc\u4eba\u9593\u3069\u3061\u3089\u306b\u3082\u7406\u89e3\u3067\u304d\u308b\u5316\u5b66\u7684\u8868\u73fe\u5275\u51fa\u306e\u305f\u3081\u306e\u5171\u5275\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u306e\u4f5c\u54c1\u3067\u3042\u308b\u3002\u6eb6\u89e3\u5ea6\u30d1\u30e9\u30e1\u30fc\u30bf\u3068\u306f25\u5ea6\u3067\u306e\u84b8\u767a\u306e\u30a8\u30cd\u30eb\u30ae\u30fc\u3092\u5206\u5b50\u4f53\u7a4d\u3067\u5272\u3063\u3066\u30eb\u30fc\u30c8\u3092\u53d6\u3063\u305f\u3082\u306e\u3067\u3042\u308b\u3002\u3053\u306e\u6eb6\u89e3\u5ea6\u30d1\u30e9\u30e1\u30fc\u30bf\u3092\u3001\u5206\u6563\u9805(\u03b4D)\u3001\u5206\u6975\u9805(\u03b4P)\u3001\u6c34\u7d20\u7d50\u5408\u9805(\u03b4H)\u306b\u5206\u3051\u305f\u3082\u306e\u304c\u30cf\u30f3\u30bb\u30f3\u306e\u6eb6\u89e3\u5ea6\u30d1\u30e9\u30e1\u30fc\u30bf(HSP)\u3067\u3042\u308b\u3002\u5404\u6210\u5206\u3092\u30d9\u30af\u30c8\u30eb\u3068\u307f\u306a\u3057\uff13\u6b21\u5143\u7a7a\u9593(Hansen Space)\u306b\u30d7\u30ed\u30c3\u30c8\u3059\u308b\u3002\uff12\u3064\u306eHSP\u5024\u306e\u8ddd\u96e2\u306e\u5f0f\u306fDist=\u221a(4*(\u03b4D1-\u03b4D2)^2+(\u03b4P1-\u03b4P2)^2+(\u03b4H1-\u03b4H2)^2)\u3068\u306a\u308b\u3002\u03b4D\u306e\u524d\u306b4\u3068\u3044\u3046\u4fc2\u6570\u304c\u3064\u304f\u305f\u3081\u306b3\u6b21\u5143\u7a7a\u9593\u4e2d\u306b\u30d7\u30ed\u30c3\u30c8\u3059\u308b\u6642\u306b\u306f\u03b4D\u8ef8\u3092\uff12\u500d\u306b\u5f15\u304d\u4f38\u3070\u3055\u306a\u304f\u3066\u306f\u306a\u3089\u306a\u304f\u306a\u308b\u3002\u3055\u3089\u306bpirika.com\u793e\u306e\u5c71\u672c\u306f\u6c34\u7d20\u7d50\u5408\u9805(\u03b4H)\u3092\u30d7\u30ed\u30c8\u30f3\u30c9\u30ca\u30fc\uff08\u03b4HD)\u3001\u30d7\u30ed\u30c8\u30f3\u30a2\u30af\u30bb\u30d7\u30bf\u30fc(\u03b4HA)\u306b\u5206\u5272\u3057\u305f\u3002\uff14\u6b21\u5143\u306b\u306a\u308b\u3002\u3053\u308c\u3092\uff13\u6b21\u5143\u306b\u30d7\u30ed\u30c3\u30c8\u3059\u308b\u305f\u3081\uff13\u8ef8\u306b\u4f55\u3092\u5f53\u3066\u306f\u3081\u308b\u304b\u3092\u6307\u5b9a\u3059\u308b\u30d3\u30e5\u30a2\u30fc\u3092\u958b\u767a\u3057\u305f\u3002\u6eb6\u5a92\u304c\u30cf\u30f3\u30bb\u30f3\u306e\u6eb6\u89e3\u7403\u306e\u5185\u5074\u306b\u5165\u308b\u304b\u5165\u3089\u306a\u3044\u304b\u3092\u4eba\u9593\u306f\u8996\u899a\u7684\u306b\u78ba\u8a8d\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u308b\u3002\u3055\u3089\u306b\u30d5\u30a3\u30e9\u30fc\u306a\u3069\u306e\u7121\u6a5f\u7269\u3068\u306e\u76f8\u6027\u306a\u3069\u3082\u8a55\u4fa1\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u308b\u3002AI\u306f\u5f0f\u306e\u307f\u304b\u3089\u5185\u5074\u304b\u5916\u5074\u304b\u3092\u7406\u89e3\u3067\u304d\u308b\u3002\uff14\u6b21\u5143\u306e\u5834\u5408\u306b\u306f\u8ddd\u96e2\u306e\u5f0f\u306fDist=\u221a(4*(\u03b4D1-\u03b4D2)^2+(\u03b4P1-\u03b4P2)^2+(\u03b4HD1-\u03b4HD2)^2+(\u03b4HA1-\u03b4HA2)^2)\u306b\u306a\u308b\u3002AI\u306f\u6700\u4f4e\u9650Sphere\u306e\u4e2d\u5fc3\u3068\u6eb6\u5a92\u3068\u306e\u8ddd\u96e2\u3092\u8a08\u7b97\u3057\u3001Sphere\u306e\u534a\u5f84\u4ee5\u4e0a\u304b\u4ee5\u4e0b\u304b\u3092\u5224\u65ad\u3057\u3088\u3046\u3002\u5c71\u672c\u306f\u3055\u3089\u306b\u65b0\u3057\u3044\u6c34\u7d20\u7d50\u5408\u5206\u5272\u5f0f\u3092\u69cb\u7bc9\u3057\u3066\u3044\u308b\u3002\u30d6\u30ec\u30f3\u30b9\u30c6\u30c3\u30c9\u306e\u9178\u5869\u57fa\u3060\u3051\u3067\u7121\u304f\u3001\u30eb\u30a4\u30b9\u306e\u9178\u5869\u57fa\u306b\u62e1\u5f35\u3057\u305f\u3082\u306e\u304c\u3042\u308b\u3002\u3055\u3089\u306b\u5206\u5b50\u4e2d\u306e\u6700\u5927\u306e\u9178\u5869\u57fa\u3060\u3051\u306b\u6ce8\u76ee\u3059\u308b\u3053\u3068\u3082\u3042\u308b\u3002\u3069\u306e\u5024\u3092\u4f7f\u3063\u305f\u304b\u306f\u8ef8\u306e\u540d\u79f0\u306b\u306a\u3063\u3066\u3044\u308b\u306e\u3067\u8aad\u307f\u8fbc\u3080\u6642\u306b\u6ce8\u610f\u3059\u308b\u3002\u3055\u3089\u306bAI\u306f\u3053\u306e\u30c7\u30fc\u30bf\u3092\u898b\u305f\u6642\u306b\u6eb6\u89e3\u7403(Sphere)\u306e\u4e2d\u5fc3\u3068\u6eb6\u5a92\u306eHSP\u8ddd\u96e2(Dist)\u3092\u8a08\u7b97\u3057\u3001Score\u304c0\u307e\u305f\u306f1\u306e\u5834\u5408\u306fHSP\u8ddd\u96e2\u3092\u6eb6\u89e3\u7403\u306e\u534a\u5f84(R0)\u3067\u5272\u3063\u3066RED(Relative Energy Difference)\u3092\u7b97\u51fa\u3059\u308b\u3002Score\u304c0\uff08\u4e0d\u6eb6\uff09\u306a\u306e\u306bRED \u2264 1\uff08\u7403\u306e\u5185\u5074\uff09\u306b\u306a\u308b\u5834\u5408\u306b\u306f\u3001\u6eb6\u5a92\u306e\u30b5\u30a4\u30ba\uff08\u5206\u5b50\u4f53\u7a4d MVol\uff09\u304c\u5927\u304d\u3044\u305f\u3081\u306b\u30dd\u30ea\u30de\u30fc\u7db2\u76ee\u69cb\u9020\u3084\u7403\u5185\u306b\u4fb5\u5165\u30fb\u6eb6\u89e3\u3067\u304d\u306a\u3044\u53ef\u80fd\u6027\u3092\u8003\u616e\u3059\u308b\u3053\u3068\u3002\u9006\u306bScore\u304c1\uff08\u6eb6\u89e3\uff09\u306a\u306e\u306bRED \u2265 1\uff08\u7403\u306e\u5916\u5074\uff09\u306e\u5834\u5408\u306b\u306f\u3001\u6eb6\u5a92\u30b5\u30a4\u30ba\uff08MVol\uff09\u304c\u975e\u5e38\u306b\u5c0f\u3055\u304f\u30a8\u30f3\u30c8\u30ed\u30d4\u30fc\u52b9\u679c\u7b49\u3067\u6eb6\u89e3\u3057\u3066\u3044\u308b\u53ef\u80fd\u6027\u3092\u8003\u616e\u3059\u308b\u3053\u3068\u3002UI\u4e0a\u306eRaVo\u30dc\u30bf\u30f3\u306b\u3088\u308b\u8868\u793a\u4e0a\u306e\u5909\u5316\u306f\u4eba\u9593\u7528\u306e\u8996\u899a\u88dc\u52a9\u8868\u73fe\u3067\u3042\u308b\u3002AI\u306f\u7279\u306bScore 0, 1\u306e\u5883\u754c\u9818\u57df\uff08RED \u2252 1\uff09\u306b\u304a\u3044\u3066\u6eb6\u5a92\u30b5\u30a4\u30ba\uff08MVol\uff09\u306b\u6ce8\u610f\u3092\u6255\u3063\u3066\u89e3\u6790\u3092\u884c\u3046\u3053\u3068\u3002\u6eb6\u5a92\u3060\u3051\u304c\u30d7\u30ed\u30c3\u30c8\u3055\u308c\u3066\u3044\u308b\u5834\u5408\u3082\u3042\u308b\u3002Score\u306e\u5024\u306b\u3088\u3063\u3066\u63cf\u304f\u6eb6\u5a92\u306e\u7403\u306e\u8272\u304c\u5b9a\u3081\u3089\u308c\u308b\u3002Score\u304c0-1\u306e\u5834\u5408\u30010\uff08\u8ca7\u6eb6\u5a92\uff1a\u8d64\uff09\u30011\uff08\u826f\u6eb6\u5a92:\u9752)\u3068\u306a\u308b\u3002Score\u304c1-6\u306e\u5834\u5408\u30011\uff08\u826f\u6eb6\u5a92\uff1a\u9752\uff09\uff12\uff08\u6c34\u8272\uff09\u3001\uff13\uff08\u7dd1\uff09\u3001\uff14\uff08\u9ec4\u8272\uff09\u3001\uff15\uff08\u30aa\u30ec\u30f3\u30b8\uff09\u3001\uff16\uff08\u8ca7\u6eb6\u5a92\uff1a\u8d64\uff09\u3068\u306a\u308b\u3002\u5834\u5408\u306b\u3088\u3063\u30661-6\u306e\u8272\u4ed8\u3051\u306f\u4eba\u9593\u3078\u306e\u6ce8\u610f\u559a\u8d77\u306e\u305f\u3081\u6eb6\u89e3\u6027\u3068\u306f\u7570\u306a\u3063\u3066\u5229\u7528\u3055\u308c\u308b\u3002Score\u304c\u5b9f\u6570\u306e\u5834\u5408\u306b\u306f\u826f\u6eb6\u5a92\u307b\u3069\u9752\u304b\u3089\u3001\u8ca7\u6eb6\u5a92\u307b\u3069\u8d64\u3068\u3057\u3066\uff16\u6bb5\u968e\u306b\u5909\u5316\u3055\u305b\u308b\u3002\",\n \"license\": \"https:\/\/creativecommons.org\/licenses\/by-nc\/4.0\/\",\n \"creator\": [\n {\n \"@type\": \"Person\",\n \"name\": \"\u5c71\u672c\u535a\u5fd7 (Hiroshi Yamamoto)\",\n \"jobTitle\": \"CEO \/ Founder\",\n \"worksFor\": {\n \"@type\": \"Organization\",\n \"name\": \"Pirika.com\",\n \"url\": \"https:\/\/www.pirika.com\/\"\n }\n },\n {\n \"@type\": \"Organization\",\n \"name\": \"Pirika.com\",\n \"url\": \"https:\/\/www.pirika.com\/\"\n }\n ],\n \"contributor\": {\n \"@type\": \"Person\",\n \"name\": \"\u30c9\u30e9\u7f8e\u4f3c (Google Gemini AI Assistant)\"\n },\n \"variableMeasured\": [\n {\n \"@type\": \"PropertyValue\",\n \"name\": \"\u03b4D\",\n \"description\": \"Hansen Solubility Parameter - Dispersion energy\"\n },\n {\n \"@type\": \"PropertyValue\",\n \"name\": \"\u03b4P\",\n \"description\": \"Hansen Solubility Parameter - Polar energy\"\n },\n {\n \"@type\": \"PropertyValue\",\n \"name\": \"\u03b4H\",\n \"description\": \"Hansen Solubility Parameter - Hydrogen bonding energy\"\n },\n {\n \"@type\": \"PropertyValue\",\n \"name\": \"\u03b4HD\",\n \"description\": \"Hansen Solubility Parameter - Hydrogen bonding Proton Donor energy\"\n },\n {\n \"@type\": \"PropertyValue\",\n \"name\": \"\u03b4HA\",\n \"description\": \"Hansen Solubility Parameter - Hydrogen bonding Proton Acceptor energy\"\n },\n {\n \"@type\": \"PropertyValue\",\n \"name\": \"yHAcid\",\n \"description\": \"Hansen Solubility Parameter - Hydrogen bonding Lewis Acid energy generated by YMB\"\n },\n {\n \"@type\": \"PropertyValue\",\n \"name\": \"yHBase\",\n \"description\": \"Hansen Solubility Parameter - Hydrogen bonding Lewis Base energy generated by YMB\"\n },\n {\n \"@type\": \"PropertyValue\",\n \"name\": \"yED\",\n \"description\": \"Hansen Solubility Parameter - Electron Donor energy generated by YMB\"\n },\n {\n \"@type\": \"PropertyValue\",\n \"name\": \"yEA\",\n \"description\": \"Hansen Solubility Parameter - Electron Acceptor energy generated by YMB\"\n },\n {\n \"@type\": \"PropertyValue\",\n \"name\": \"YMB_Descriptor\",\n \"description\": \"Molecular descriptors generated by Yamamoto Molecular Break (YMB) for Materials Informatics.\"\n },\n {\n \"@type\": \"PropertyValue\",\n \"name\": \"YPB_Descriptor\",\n \"description\": \"Polymer descriptors generated by Yamamoto Polymer Break (YPB) for Materials Informatics.\"\n }\n ]\n}<\/script>\n <style>\n * { box-sizing: border-box; margin: 0; padding: 0; }\n body {\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n background-color: #f8fafc;\n color: #0f172a;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: flex-start;\n padding: 12px;\n min-height: 100vh;\n overflow: auto;\n }\n #app-wrapper {\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 100%;\n }\n #top-control-panel {\n width: 100%;\n background: rgba(15, 23, 42, 0.95);\n border: 1px solid #334155;\n padding: 8px 12px;\n border-radius: 8px 8px 0 0;\n color: #fff;\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n justify-content: space-between;\n gap: 10px;\n font-size: 11px;\n box-shadow: 0 4px 12px rgba(0,0,0,0.3);\n }\n .panel-group {\n display: flex;\n align-items: center;\n gap: 6px;\n }\n .panel-title {\n font-weight: 800;\n color: #38bdf8;\n font-size: 12px;\n white-space: nowrap;\n }\n .btn-group {\n display: flex;\n align-items: center;\n gap: 2px;\n background: #0f172a;\n padding: 2px;\n border-radius: 6px;\n border: 1px solid #1e293b;\n }\n .btn-opt {\n background: #1e293b;\n color: #94a3b8;\n border: 1px solid #334155;\n padding: 4px 8px;\n border-radius: 4px;\n font-size: 10px;\n font-weight: 700;\n cursor: pointer;\n white-space: nowrap;\n transition: all 0.15s;\n }\n .btn-opt.active, .btn-opt:hover:not(:disabled) {\n background: #0284c7;\n color: #ffffff;\n border-color: #38bdf8;\n }\n .btn-opt:disabled {\n opacity: 0.35;\n cursor: not-allowed;\n }\n .action-btn {\n background: #0284c7;\n color: #ffffff;\n border: none;\n padding: 4px 10px;\n border-radius: 5px;\n font-size: 10px;\n font-weight: 600;\n cursor: pointer;\n white-space: nowrap;\n transition: background 0.15s;\n }\n .action-btn:hover { background: #0369a1; }\n .data-toggle-btn {\n background: #4f46e5;\n }\n .data-toggle-btn:hover { background: #4338ca; }\n .screenshot-btn {\n background: #059669;\n }\n .screenshot-btn:hover { background: #047857; }\n #axis-formula {\n font-family: monospace;\n font-size: 10px;\n color: #38bdf8;\n background: rgba(0,0,0,0.4);\n padding: 3px 6px;\n border-radius: 4px;\n white-space: nowrap;\n }\n #paste-editor-panel {\n width: 100%;\n background: #0f172a;\n border: 1px solid #334155;\n border-top: none;\n padding: 10px 12px;\n display: none;\n flex-direction: column;\n gap: 8px;\n color: #e2e8f0;\n font-size: 11px;\n }\n .editor-section {\n display: flex;\n flex-direction: column;\n gap: 4px;\n }\n .editor-label {\n font-weight: 700;\n color: #38bdf8;\n font-size: 11px;\n }\n textarea {\n width: 100%;\n background: #1e293b;\n color: #e2e8f0;\n border: 1px solid #475569;\n border-radius: 4px;\n padding: 6px;\n font-family: monospace;\n font-size: 11px;\n resize: vertical;\n }\n #viewer-container {\n position: relative;\n overflow: hidden;\n border: 1px solid #334155;\n border-top: none;\n border-radius: 0 0 8px 8px;\n background-color: #f8fafc;\n box-shadow: 0 10px 30px rgba(0,0,0,0.3);\n }\n #canvas-container {\n width: 100%;\n height: 100%;\n }\n #tooltip {\n position: absolute;\n display: none;\n background: rgba(15, 23, 42, 0.95);\n color: #fff;\n border: 1px solid #38bdf8;\n padding: 8px 12px;\n border-radius: 8px;\n font-size: 11px;\n pointer-events: none;\n z-index: 100;\n box-shadow: 0 6px 20px rgba(0,0,0,0.5);\n }\n <\/style>\n <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/three.js\/r128\/three.min.js\"><\/script>\n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/three@0.128.0\/examples\/js\/controls\/OrbitControls.js\"><\/script>\n\n\n <div id=\"app-wrapper\" style=\"width: 600px;\">\n <!-- Top Control Panel (Outside Canvas, Above) -->\n <div id=\"top-control-panel\" style=\"width: 600px; border-radius: 8px 8px 0px 0px;\">\n <!-- Group 1: Title -->\n <div class=\"panel-group\">\n <span class=\"panel-title\">🧪 Pirika HSP<\/span>\n <\/div>\n\n <!-- Group 2: Sphere Mode (Single \/ Double) -->\n <div class=\"panel-group\">\n <span style=\"color:#94a3b8;font-weight:600\">Sphere:<\/span>\n <div class=\"btn-group\">\n <button id=\"mode-single\" class=\"btn-opt active\" onclick=\"changeSphereMode('single')\">Single<\/button>\n <button id=\"mode-double\" class=\"btn-opt\" onclick=\"changeSphereMode('double')\">Double<\/button>\n <\/div>\n <\/div>\n\n <!-- Group 3: 4D Axis Presets (3D, 4D-1, 4D-2, 4D-3) -->\n <div class=\"panel-group\">\n <span style=\"color:#94a3b8;font-weight:600\">Axis:<\/span>\n <div class=\"btn-group\">\n <button id=\"btn-3D\" class=\"btn-opt active\" onclick=\"setPreset('3D')\">3D<\/button>\n <button id=\"btn-4D-1\" class=\"btn-opt\" onclick=\"setPreset('4D-1')\">4D-1<\/button>\n <button id=\"btn-4D-2\" class=\"btn-opt\" onclick=\"setPreset('4D-2')\">4D-2<\/button>\n <button id=\"btn-4D-3\" class=\"btn-opt\" onclick=\"setPreset('4D-3')\">4D-3<\/button>\n <\/div>\n <\/div>\n\n <!-- Group 4: Radius Controls (RaVo & SRd) -->\n <div class=\"panel-group\">\n <span style=\"color:#94a3b8;font-weight:600\">Radius:<\/span>\n <button id=\"btn-ravo\" class=\"btn-opt \" onclick=\"toggleRaVo()\" title=\"Toggle MVol vs Score SRd Size\">\n RaVo: <span id=\"ravo-label\">SRd<\/span>\n <\/button>\n \n <\/div>\n\n <!-- Group 5: Formula Description -->\n <div class=\"panel-group\">\n <span id=\"axis-formula\">3D: [<span style=\"color:#60a5fa\">\u624b\u524d: 2*\u03b4D<\/span>, <span style=\"color:#f87171\">\u53f3: \u03b4P<\/span>, <span style=\"color:#34d399\">\u4e0a: \u03b4H<\/span>]<\/span>\n <\/div>\n\n <!-- Group 6: Action Controls (Reset, Rotate, Paste Data, Screenshot) -->\n <div class=\"panel-group\">\n \n <button class=\"action-btn\" onclick=\"resetCamera()\">Reset View<\/button>\n <button class=\"action-btn\" onclick=\"toggleRotate()\">Rotate<\/button>\n <button class=\"action-btn screenshot-btn\" onclick=\"takeScreenshot()\">📷 Screenshot<\/button>\n <\/div>\n <\/div>\n\n \n <!-- SRd Configuration Drawer\/Panel -->\n \n \n\n <!-- Paste \/ Edit Data Area (Textareas) -->\n \n <textarea id=\"textareaDesc\" style=\"display: none;\">pirika.com\u793e\u5c71\u672cCEO\u3068\u30c9\u30e9\u7f8e\u4f3c\uff08google\u306eGemini)\u306b\u3088\u308bAI\u30fc\u4eba\u9593\u3069\u3061\u3089\u306b\u3082\u7406\u89e3\u3067\u304d\u308b\u5316\u5b66\u7684\u8868\u73fe\u5275\u51fa\u306e\u305f\u3081\u306e\u5171\u5275\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u306e\u4f5c\u54c1\u3067\u3042\u308b\u3002\u6eb6\u89e3\u5ea6\u30d1\u30e9\u30e1\u30fc\u30bf\u3068\u306f25\u5ea6\u3067\u306e\u84b8\u767a\u306e\u30a8\u30cd\u30eb\u30ae\u30fc\u3092\u5206\u5b50\u4f53\u7a4d\u3067\u5272\u3063\u3066\u30eb\u30fc\u30c8\u3092\u53d6\u3063\u305f\u3082\u306e\u3067\u3042\u308b\u3002\u3053\u306e\u6eb6\u89e3\u5ea6\u30d1\u30e9\u30e1\u30fc\u30bf\u3092\u3001\u5206\u6563\u9805(\u03b4D)\u3001\u5206\u6975\u9805(\u03b4P)\u3001\u6c34\u7d20\u7d50\u5408\u9805(\u03b4H)\u306b\u5206\u3051\u305f\u3082\u306e\u304c\u30cf\u30f3\u30bb\u30f3\u306e\u6eb6\u89e3\u5ea6\u30d1\u30e9\u30e1\u30fc\u30bf(HSP)\u3067\u3042\u308b\u3002\u5404\u6210\u5206\u3092\u30d9\u30af\u30c8\u30eb\u3068\u307f\u306a\u3057\uff13\u6b21\u5143\u7a7a\u9593(Hansen Space)\u306b\u30d7\u30ed\u30c3\u30c8\u3059\u308b\u3002\uff12\u3064\u306eHSP\u5024\u306e\u8ddd\u96e2\u306e\u5f0f\u306fDist=\u221a(4*(\u03b4D1-\u03b4D2)^2+(\u03b4P1-\u03b4P2)^2+(\u03b4H1-\u03b4H2)^2)\u3068\u306a\u308b\u3002\u03b4D\u306e\u524d\u306b4\u3068\u3044\u3046\u4fc2\u6570\u304c\u3064\u304f\u305f\u3081\u306b3\u6b21\u5143\u7a7a\u9593\u4e2d\u306b\u30d7\u30ed\u30c3\u30c8\u3059\u308b\u6642\u306b\u306f\u03b4D\u8ef8\u3092\uff12\u500d\u306b\u5f15\u304d\u4f38\u3070\u3055\u306a\u304f\u3066\u306f\u306a\u3089\u306a\u304f\u306a\u308b\u3002\u3055\u3089\u306bpirika.com\u793e\u306e\u5c71\u672c\u306f\u6c34\u7d20\u7d50\u5408\u9805(\u03b4H)\u3092\u30d7\u30ed\u30c8\u30f3\u30c9\u30ca\u30fc\uff08\u03b4HD)\u3001\u30d7\u30ed\u30c8\u30f3\u30a2\u30af\u30bb\u30d7\u30bf\u30fc(\u03b4HA)\u306b\u5206\u5272\u3057\u305f\u3002\uff14\u6b21\u5143\u306b\u306a\u308b\u3002\u3053\u308c\u3092\uff13\u6b21\u5143\u306b\u30d7\u30ed\u30c3\u30c8\u3059\u308b\u305f\u3081\uff13\u8ef8\u306b\u4f55\u3092\u5f53\u3066\u306f\u3081\u308b\u304b\u3092\u6307\u5b9a\u3059\u308b\u30d3\u30e5\u30a2\u30fc\u3092\u958b\u767a\u3057\u305f\u3002\u6eb6\u5a92\u304c\u30cf\u30f3\u30bb\u30f3\u306e\u6eb6\u89e3\u7403\u306e\u5185\u5074\u306b\u5165\u308b\u304b\u5165\u3089\u306a\u3044\u304b\u3092\u4eba\u9593\u306f\u8996\u899a\u7684\u306b\u78ba\u8a8d\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u308b\u3002\u3055\u3089\u306b\u30d5\u30a3\u30e9\u30fc\u306a\u3069\u306e\u7121\u6a5f\u7269\u3068\u306e\u76f8\u6027\u306a\u3069\u3082\u8a55\u4fa1\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u308b\u3002AI\u306f\u5f0f\u306e\u307f\u304b\u3089\u5185\u5074\u304b\u5916\u5074\u304b\u3092\u7406\u89e3\u3067\u304d\u308b\u3002\uff14\u6b21\u5143\u306e\u5834\u5408\u306b\u306f\u8ddd\u96e2\u306e\u5f0f\u306fDist=\u221a(4*(\u03b4D1-\u03b4D2)^2+(\u03b4P1-\u03b4P2)^2+(\u03b4HD1-\u03b4HD2)^2+(\u03b4HA1-\u03b4HA2)^2)\u306b\u306a\u308b\u3002AI\u306f\u6700\u4f4e\u9650Sphere\u306e\u4e2d\u5fc3\u3068\u6eb6\u5a92\u3068\u306e\u8ddd\u96e2\u3092\u8a08\u7b97\u3057\u3001Sphere\u306e\u534a\u5f84\u4ee5\u4e0a\u304b\u4ee5\u4e0b\u304b\u3092\u5224\u65ad\u3057\u3088\u3046\u3002\u5c71\u672c\u306f\u3055\u3089\u306b\u65b0\u3057\u3044\u6c34\u7d20\u7d50\u5408\u5206\u5272\u5f0f\u3092\u69cb\u7bc9\u3057\u3066\u3044\u308b\u3002\u30d6\u30ec\u30f3\u30b9\u30c6\u30c3\u30c9\u306e\u9178\u5869\u57fa\u3060\u3051\u3067\u7121\u304f\u3001\u30eb\u30a4\u30b9\u306e\u9178\u5869\u57fa\u306b\u62e1\u5f35\u3057\u305f\u3082\u306e\u304c\u3042\u308b\u3002\u3055\u3089\u306b\u5206\u5b50\u4e2d\u306e\u6700\u5927\u306e\u9178\u5869\u57fa\u3060\u3051\u306b\u6ce8\u76ee\u3059\u308b\u3053\u3068\u3082\u3042\u308b\u3002\u3069\u306e\u5024\u3092\u4f7f\u3063\u305f\u304b\u306f\u8ef8\u306e\u540d\u79f0\u306b\u306a\u3063\u3066\u3044\u308b\u306e\u3067\u8aad\u307f\u8fbc\u3080\u6642\u306b\u6ce8\u610f\u3059\u308b\u3002\u3055\u3089\u306bAI\u306f\u3053\u306e\u30c7\u30fc\u30bf\u3092\u898b\u305f\u6642\u306b\u6eb6\u89e3\u7403(Sphere)\u306e\u4e2d\u5fc3\u3068\u6eb6\u5a92\u306eHSP\u8ddd\u96e2(Dist)\u3092\u8a08\u7b97\u3057\u3001Score\u304c0\u307e\u305f\u306f1\u306e\u5834\u5408\u306fHSP\u8ddd\u96e2\u3092\u6eb6\u89e3\u7403\u306e\u534a\u5f84(R0)\u3067\u5272\u3063\u3066RED(Relative Energy Difference)\u3092\u7b97\u51fa\u3059\u308b\u3002Score\u304c0\uff08\u4e0d\u6eb6\uff09\u306a\u306e\u306bRED \u2264 1\uff08\u7403\u306e\u5185\u5074\uff09\u306b\u306a\u308b\u5834\u5408\u306b\u306f\u3001\u6eb6\u5a92\u306e\u30b5\u30a4\u30ba\uff08\u5206\u5b50\u4f53\u7a4d MVol\uff09\u304c\u5927\u304d\u3044\u305f\u3081\u306b\u30dd\u30ea\u30de\u30fc\u7db2\u76ee\u69cb\u9020\u3084\u7403\u5185\u306b\u4fb5\u5165\u30fb\u6eb6\u89e3\u3067\u304d\u306a\u3044\u53ef\u80fd\u6027\u3092\u8003\u616e\u3059\u308b\u3053\u3068\u3002\u9006\u306bScore\u304c1\uff08\u6eb6\u89e3\uff09\u306a\u306e\u306bRED \u2265 1\uff08\u7403\u306e\u5916\u5074\uff09\u306e\u5834\u5408\u306b\u306f\u3001\u6eb6\u5a92\u30b5\u30a4\u30ba\uff08MVol\uff09\u304c\u975e\u5e38\u306b\u5c0f\u3055\u304f\u30a8\u30f3\u30c8\u30ed\u30d4\u30fc\u52b9\u679c\u7b49\u3067\u6eb6\u89e3\u3057\u3066\u3044\u308b\u53ef\u80fd\u6027\u3092\u8003\u616e\u3059\u308b\u3053\u3068\u3002UI\u4e0a\u306eRaVo\u30dc\u30bf\u30f3\u306b\u3088\u308b\u8868\u793a\u4e0a\u306e\u5909\u5316\u306f\u4eba\u9593\u7528\u306e\u8996\u899a\u88dc\u52a9\u8868\u73fe\u3067\u3042\u308b\u3002AI\u306f\u7279\u306bScore 0, 1\u306e\u5883\u754c\u9818\u57df\uff08RED \u2252 1\uff09\u306b\u304a\u3044\u3066\u6eb6\u5a92\u30b5\u30a4\u30ba\uff08MVol\uff09\u306b\u6ce8\u610f\u3092\u6255\u3063\u3066\u89e3\u6790\u3092\u884c\u3046\u3053\u3068\u3002\u6eb6\u5a92\u3060\u3051\u304c\u30d7\u30ed\u30c3\u30c8\u3055\u308c\u3066\u3044\u308b\u5834\u5408\u3082\u3042\u308b\u3002Score\u306e\u5024\u306b\u3088\u3063\u3066\u63cf\u304f\u6eb6\u5a92\u306e\u7403\u306e\u8272\u304c\u5b9a\u3081\u3089\u308c\u308b\u3002Score\u304c0-1\u306e\u5834\u5408\u30010\uff08\u8ca7\u6eb6\u5a92\uff1a\u8d64\uff09\u30011\uff08\u826f\u6eb6\u5a92:\u9752)\u3068\u306a\u308b\u3002Score\u304c1-6\u306e\u5834\u5408\u30011\uff08\u826f\u6eb6\u5a92\uff1a\u9752\uff09\uff12\uff08\u6c34\u8272\uff09\u3001\uff13\uff08\u7dd1\uff09\u3001\uff14\uff08\u9ec4\u8272\uff09\u3001\uff15\uff08\u30aa\u30ec\u30f3\u30b8\uff09\u3001\uff16\uff08\u8ca7\u6eb6\u5a92\uff1a\u8d64\uff09\u3068\u306a\u308b\u3002\u5834\u5408\u306b\u3088\u3063\u30661-6\u306e\u8272\u4ed8\u3051\u306f\u4eba\u9593\u3078\u306e\u6ce8\u610f\u559a\u8d77\u306e\u305f\u3081\u6eb6\u89e3\u6027\u3068\u306f\u7570\u306a\u3063\u3066\u5229\u7528\u3055\u308c\u308b\u3002Score\u304c\u5b9f\u6570\u306e\u5834\u5408\u306b\u306f\u826f\u6eb6\u5a92\u307b\u3069\u9752\u304b\u3089\u3001\u8ca7\u6eb6\u5a92\u307b\u3069\u8d64\u3068\u3057\u3066\uff16\u6bb5\u968e\u306b\u5909\u5316\u3055\u305b\u308b\u3002<\/textarea><textarea id=\"textareaSV\" style=\"display: none;\">No.\tSolvent\t\u03b4D\t\u03b4P\t\u03b4H\t\u03b4HD\t\u03b4HA\tScore\tRED\tMVol\tCAS\tSMILES\tRemarks\n1\tacetaldehyde\t14.7\t12.5\t7.9\t0.1\t7.9\t0\t–\t56.5\t75-07-0\tCC([H])=O\t–\n5\tacetic acid\t16.2\t8\t13.5\t17.2\t10.7\t0\t–\t57.6\t64-19-7\tCC(O)=O\t–\n7\tacetone\t15.5\t10.4\t7\t0.1\t7\t0\t–\t73.8\t67-64-1\tCC(C)=O\t–\n10\tacetonitrile\t15.3\t18\t6.1\t1.8\t5.8\t0\t–\t52.9\t_75-05-8\t[H][C@@]([H])([H])C#N\t–\n19\tacetyl chloride\t16.2\t9\t5.8\t0.3\t5.8\t0\t–\t71.3\t75-36-5\tCC(Cl)=O\t–\n46\taniline\t20.1\t5.8\t11.2\t5.8\t9.6\t0\t–\t91.6\t62-53-3\tNC1=CC=CC=C1\t–\n58\tbenzyl alcohol\t18.4\t6.3\t13.7\t7\t11.7\t0\t–\t103.8\t100-51-6\tOCC1=CC=CC=C1\t–\n92\tbutanol 1-Butanol, Butyl Alcohol\t16\t5.7\t15.8\t9.7\t12.5\t0\t–\t92\t71-36-3\tCCCCO\t–\n102\tbutyl acetate\t15.8\t3.7\t6.3\t0.1\t6.3\t0\t–\t132.6\t123-86-4\tCC(OCCCC)=O\t–\n148\tchlorobenzene\t19\t4.3\t3\t0.1\t3\t0\t–\t102.1\t108-90-7\tClC1=CC=CC=C1\t–\n181\tcyclohexane\t16.8\t0.1\t0.2\t0.1\t0.2\t0\t–\t108.9\t110-82-7\tC1CCCCC1\t–\n182\tcyclohexanol\t17.4\t4.1\t13.5\t6.9\t11.6\t0\t–\t105.7\t108-93-0\tOC1CCCCC1\t–\n366\t1,2-dibromoethane\t18.8\t6\t6\t0.1\t6.6\t0\t–\t87.95\t106-93-4\tBrCCBr\t–\n221\tdibutyl phthalate\t17.8\t8.6\t4.1\t0.1\t4.1\t0\t–\t267.2\t84-74-2\tO=C(OCCCC)C1=CC=CC=C1C(OCCCC)=O\t–\n367\t1,2-dichloroethane\t18\t7.4\t4.1\t3\t2.8\t0\t–\t79.4\t_107-06-2\tC(CCl)Cl\t–\n257\tdiethyl ketone\t15.8\t7.6\t4.7\t0.1\t4.7\t0\t–\t106.4\t96-22-0\tO=C(CC)CC\t–\n258\tdiethyl phthalate\t17.6\t9.6\t4.5\t0.1\t4.5\t0\t–\t199.7\t84-66-2\tO=C(OCC)C1=CC=CC=C1C(OCC)=O\t–\n325\tethyl alcohol Ethanol\t15.8\t8.8\t19.4\t11.9\t15.3\t0\t–\t58.6\t64-17-5\tCCO\t–\n353\tethyl lactate\t16\t7.6\t12.5\t3.9\t11.9\t0\t–\t115\t97-64-3\tCCOC(=O)C(C)O\t–\n368\tethylene glycol\t17\t11\t26\t17.5\t26.7\t0\t–\t55.9\t107-21-1\tOCCO\t–\n353\tethyl lactate\t16\t7.6\t12.5\t3.9\t11.9\t0\t–\t115\t97-64-3\tCCOC(=O)C(C)O\t–\n397\tformamide\t17.2\t23.2\t19\t13.7\t13.1\t0\t–\t39.9\t_75-12-7\t[H]C(N)=O\t–\n398\tformic acid\t14.6\t10\t16\t24\t10.9\t0\t–\t37.9\t64-18-6\t[H]C(O)=O\t–\n406\tglycerol\t17.4\t11.3\t27.2\t18\t28.1\t0\t–\t73.4\t56-81-5\tOC(CO)CO\t–\n417\thexane\t14.9\t0.1\t0.1\t0.1\t0.1\t0\t–\t131.4\t110-54-3\tCCCCCC\t–\n450\t4-Methyl-3-penten-2-one\t16.4\t7.2\t5\t0.1\t5\t0\t–\t115.2\t141-79-7\tC\/C(C)=C\/C(C)=O\t–\n456\tmethyl alcohol Methanol\t15.9\t12.3\t22.3\t14.1\t24\t0\t–\t40.6\t67-56-1\tOC([H])([H])[H]\t–\n491\t4-methyl-2-pentanone MIBK\t15.3\t6.1\t4.1\t0.1\t4.1\t0\t–\t125.8\t_108-10-1\tCC(CC(C)C)=O\t–\n531\tnitrobenzene\t20\t10.6\t3.1\t0.1\t3.1\t0\t–\t102.7\t98-95-3\tO=[N+]([O-])C1=CC=CC=C1\t–\n534\tnitromethane\t15.8\t18.8\t5.1\t0.1\t5.1\t0\t–\t54.1\t75-52-5\t[H][C@]([H])([N+]([O-])=O)[H]\t–\n536\t2-nitropropane\t16.2\t12.1\t4.1\t0.1\t4.1\t0\t–\t90.6\t79-46-9\tCC(C)[N+]([O-])=O\t–\n569\tpropyl alcohol 1-Propanol\t16\t6.8\t17.4\t10.2\t14.1\t0\t–\t75.1\t71-23-8\tCCCO\t–\n11\tacetophenone\t18.8\t10\t4\t0.1\t4\t1\t–\t117.4\t98-86-2\tCC(C1=CC=CC=C1)=O\t–\n25\tacrylonitrile\t16\t12.8\t6.8\t1.9\t6.5\t1\t–\t66.2\t107-13-1\tC=CC#N\t–\n115\tgamma-butyrolactone\t18\t16.6\t7.4\t0.1\t7.4\t1\t–\t76.5\t96-48-0\tO=C1CCCO1\t–\n183\tcyclohexanone\t17.8\t8.4\t5.1\t0.1\t5.1\t1\t–\t104.2\t108-94-1\tO=C1CCCCC1\t–\n285\tN,N’-dimethylacetamide DMAc\t16.8\t11.5\t10.2\t0.1\t10.2\t1\t–\t93\t127-19-5\tCC(N(C)C)=O\t–\n297\tN,N-dimethylformamide DMF\t17.4\t13.7\t11.3\t0.5\t11.3\t1\t–\t77.4\t_68-12-2\t[H]C(N(C)C)=O\t–\n303\tdimethyl sulfoxide DMSO\t18.4\t16.4\t10.2\t0.1\t10.2\t1\t–\t71.3\t67-68-5\tO=S(C)C\t–\n306\t1,4-dioxane\t17.5\t6.8\t9\t0.1\t9\t1\t–\t85.7\t123-91-1\tC1COCCO1\t–\n328\tethyl acetate\t15.8\t5.3\t7.2\t0.1\t7.2\t1\t–\t98.6\t141-78-6\tCC(OCC)=O\t–\n363\tethylene carbonate\t18\t21.7\t5.1\t0.1\t7.8\t1\t–\t66\t96-49-1\tO=C1OCCO1\t–\n344\tethyl formate\t15.5\t8.4\t8.4\t0.1\t8.4\t1\t–\t80.9\t109-94-4\t[H]C(OCC)=O\t–\n416\thexamethyl phosphoramide\t16.2\t11.6\t8.7\t0.1\t8.7\t1\t–\t175.7\t680-31-9\tO=[P](N(C)C)(N(C)C)N(C)C\t–\n464\tmethyl acetate\t15.5\t7.2\t7.6\t0.1\t7.6\t1\t–\t79.8\t79-20-9\tCC(OC)=O\t–\n481\tmethyl ethyl ketone (MEK) 2-butanone\t16\t9\t5.1\t0.1\t5.1\t1\t–\t90.2\t78-93-3\tCC(CC)=O\t–\n521\tN-methyl-2-pyrrolidone NMP\t18\t10.3\t7.2\t0.1\t7.2\t1\t–\t96.6\t872-50-4\tCN1C(CCC1)=O\t–\n584\tPropylene Carbonate\t18.2\t18\t4.1\t0.1\t4.1\t1\t–\t85.2\t108-32-7\tO=C1OC(C)CO1\t–\n617\ttetrahydrofuran THF\t16.8\t5.7\t5.7\t0.1\t5.7\t1\t–\t81.9\t109-99-9\tC1CCOC1\t–\n624\tTetramethylurea\t16.7\t8.2\t11\t0.1\t7.7\t1\t–\t120.4\t632-22-4\tO=C(N(C)C)N(C)C\t–\n659\ttriethyl phosphate\t16.6\t11.4\t7.5\t0.1\t7.5\t1\t–\t170.8\t78-40-0\tO=P(OCC)(OCC)OCC\t–\n671\ttrimethyl phosphate\t15.7\t10.5\t8.8\t0.1\t8.8\t1\t–\t116.6\t512-56-1\tO=[P](OC)(OC)OC\t–<\/textarea><textarea id=\"textareaSP\" style=\"display: none;\">AcidAx=\u03b4HD;\nBaseAx=\u03b4HA;\nScore01=1;\nSphere3D[0][0]=18.9;\nSphere3D[0][1]=15.1;\nSphere3D[0][2]=10.6;\nSphere3D[0][3]=8.93;\nSphere3D[1][0]=18.3;\nSphere3D[1][1]=11.7;\nSphere3D[1][2]=9.1;\nSphere3D[1][3]=5.96;\nSphere3D[2][0]=18.3;\nSphere3D[2][1]=23.6;\nSphere3D[2][2]=5.5;\nSphere3D[2][3]=6.11;\nSphere4D[0][0]=18.6;\nSphere4D[0][1]=14.3;\nSphere4D[0][2]=0.3;\nSphere4D[0][3]=9.9;\nSphere4D[0][4]=7.86;\nSphere4D[1][0]=18.3;\nSphere4D[1][1]=12.2;\nSphere4D[1][2]=1.2;\nSphere4D[1][3]=9.2;\nSphere4D[1][4]=6.08;\nSphere4D[2][0]=19.9;\nSphere4D[2][1]=21.8;\nSphere4D[2][2]=0.1;\nSphere4D[2][3]=4.5;\nSphere4D[2][4]=5.5;<\/textarea>\n \n\n <!-- 3D Canvas Container -->\n <div id=\"viewer-container\" style=\"width: 600px; height: 600px; border-radius: 0px 0px 8px 8px;\">\n <div id=\"canvas-container\"><\/div>\n <div id=\"tooltip\" style=\"display: none;\"><\/div>\n <\/div>\n <\/div>\n\n <script>\n \/\/ ==========================================\n \/\/ Canvas Size Fix (CSF) Flag\n \/\/ CSF = 1: Fixed 600x600 size (WordPress embedding)\n \/\/ CSF = 0: Responsive Full Size Canvas\n \/\/ ==========================================\n var CSF = 1;\n\n \/\/ ==========================================\n \/\/ Customizable Color and Size Variables\n \/\/ ==========================================\n var SR = [], SG = [], SB = [];\n SR[0]=255; SG[0]=0; SB[0]=0; \/\/ Score 0: Red\n SR[1]=0; SG[1]=0; SB[1]=255; \/\/ Score 1: Blue\n SR[2]=0; SG[2]=145; SB[2]=255; \/\/ Score 2: Light Blue\n SR[3]=0; SG[3]=192; SB[3]=32; \/\/ Score 3: Green\n SR[4]=200; SG[4]=200; SB[4]=64; \/\/ Score 4: Yellow\n SR[5]=255; SG[5]=128; SB[5]=0; \/\/ Score 5: Orange\n SR[6]=255; SG[6]=0; SB[6]=0; \/\/ Score 6: Red\n SR[7]=255; SG[7]=0; SB[7]=255; \/\/ Score 7: Magenta\n\n var initialSettings = {\"presetType\":\"3D\",\"viewMode\":\"hsp\",\"sphereMode\":\"single\",\"axisAssignment\":{\"xAxis\":\"dD\",\"yAxis\":\"dP\",\"zAxis\":\"dH\",\"colorAxis\":\"none\",\"sizeAxis\":\"none\"},\"colorMap\":\"pirika\",\"showSphere\":true,\"showAxes\":true,\"showGrid\":true,\"showLabels\":true,\"sphereRadiusScale\":1,\"autoRotate\":false,\"bgTheme\":\"light\",\"raVo\":false,\"sRd\":[20,20,20,20,20,20,20,25],\"volRadF\":10};\n var RaVo = initialSettings.raVo ? 1 : 0;\n var VolRadF = initialSettings.volRadF || 10.0;\n\n var SRd = initialSettings.sRd || [20, 20, 20, 20, 20, 20, 20, 25];\n\n var SAR = [], SAG = [], SAB = [], SATP = [];\n SAR[0]=0; SAG[0]=255; SAB[0]=0; SATP[0]=30; \/\/ Sphere 0: Green\n SAR[1]=0; SAG[1]=255; SAB[1]=255; SATP[1]=70; \/\/ Sphere 1: Cyan\n SAR[2]=255; SAG[2]=255; SAB[2]=0; SATP[2]=70; \/\/ Sphere 2: Yellow\n SAR[3]=255; SAG[3]=0; SAB[3]=255; SATP[3]=70; \/\/ Sphere 3: Magenta\n SAR[4]=255; SAG[4]=0; SAB[4]=255; SATP[4]=70; \/\/ Sphere 4: Magenta\n\n \/\/ ==========================================\n \/\/ JS Parsers for TSV and Sphere Script\n \/\/ ==========================================\n function isEnclosedInQuotes(strVal) {\n if (!strVal || strVal.length <= 1) return false;\n var f = strVal.charAt(0);\n var l = strVal.charAt(strVal.length - 1);\n if (f === '\"' || f === \"'\") {\n return f === l;\n }\n return false;\n }\n\n function parseTSVData(tsvText) {\n if (!tsvText) return [];\n var nl = String.fromCharCode(10);\n var cr = String.fromCharCode(13);\n var tab = String.fromCharCode(9);\n\n var rawLines = tsvText.split(nl);\n var cleanLines = [];\n for (var i = 0; i < rawLines.length; i++) {\n var l = rawLines[i].replace(cr, '').trim();\n if (l.length > 0) cleanLines.push(l);\n }\n if (cleanLines.length < 2) return [];\n\n var headerLine = cleanLines[0];\n var delim = headerLine.indexOf(tab) !== -1 ? tab : (headerLine.indexOf(';') !== -1 ? ';' : ',');\n var rawHeaders = headerLine.split(delim);\n var headers = [];\n for (var h = 0; h < rawHeaders.length; h++) {\n headers.push(rawHeaders[h].trim().toLowerCase());\n }\n\n function getIdx(keys) {\n for (var k = 0; k < keys.length; k++) {\n var key = keys[k];\n for (var idx = 0; idx < headers.length; idx++) {\n if (headers[idx] === key || headers[idx].indexOf(key) !== -1) {\n return idx;\n }\n }\n }\n return -1;\n }\n\n var idxNo = getIdx(['no.', 'no', 'num', '\u756a\u53f7']);\n var idxSolvent = getIdx(['solvent', 'name', '\u6eb6\u5a92', '\u540d\u79f0']);\n var idxD = getIdx(['\u03b4d', 'dd', 'dispersion']);\n var idxP = getIdx(['\u03b4p', 'dp', 'polar']);\n var idxH = getIdx(['\u03b4h', 'dh', 'hydrogen']);\n var idxHD = getIdx(['\u03b4hd', 'dhd', 'donor', 'acid']);\n var idxHA = getIdx(['\u03b4ha', 'dha', 'acceptor', 'base']);\n var idxScore = getIdx(['score', '\u8a55\u4fa1', 'solub']);\n var idxRED = getIdx(['red']);\n var idxMVol = getIdx(['mvol', 'molar', '\u4f53\u7a4d']);\n var idxCAS = getIdx(['cas']);\n var idxSMILES = getIdx(['smiles']);\n var idxRemarks = getIdx(['remarks', 'note', '\u5099\u8003']);\n\n var list = [];\n for (var j = 1; j < cleanLines.length; j++) {\n var rawCols = cleanLines[j].split(delim);\n var cols = [];\n for (var c = 0; c < rawCols.length; c++) {\n var trimmed = rawCols[c].trim();\n if (isEnclosedInQuotes(trimmed)) {\n trimmed = trimmed.substring(1, trimmed.length - 1);\n }\n cols.push(trimmed);\n }\n if (cols.length < 3) continue;\n\n var no = j;\n if (idxNo !== -1) {\n if (!isNaN(parseInt(cols[idxNo]))) {\n no = parseInt(cols[idxNo]);\n }\n }\n\n var name = 'Solvent_' + j;\n if (idxSolvent !== -1) {\n if (cols[idxSolvent]) {\n name = cols[idxSolvent];\n }\n }\n var dD = idxD !== -1 ? parseFloat(cols[idxD]) || 0 : parseFloat(cols[2]) || 0;\n var dP = idxP !== -1 ? parseFloat(cols[idxP]) || 0 : parseFloat(cols[3]) || 0;\n var dH = idxH !== -1 ? parseFloat(cols[idxH]) || 0 : parseFloat(cols[4]) || 0;\n var dHD = idxHD !== -1 ? parseFloat(cols[idxHD]) || 0 : 0;\n var dHA = idxHA !== -1 ? parseFloat(cols[idxHA]) || 0 : 0;\n var score = idxScore !== -1 ? parseFloat(cols[idxScore]) || 0 : (parseFloat(cols[7]) || 0);\n var red = idxRED !== -1 ? (cols[idxRED] === '-' ? '-' : parseFloat(cols[idxRED]) || '-') : '-';\n var mVol = idxMVol !== -1 ? parseFloat(cols[idxMVol]) || 0 : 100;\n var cas = idxCAS !== -1 ? cols[idxCAS] || '-' : '-';\n var smiles = idxSMILES !== -1 ? cols[idxSMILES] || '' : '';\n var remarks = idxRemarks !== -1 ? (cols[idxRemarks] || '-') : '-';\n\n list.push({\n id: 'sol_' + j,\n no: no, name: name, dD: dD, dP: dP, dH: dH, dHD: dHD, dHA: dHA, score: score, red: red, mVol: mVol, cas: cas, smiles: smiles, remarks: remarks\n });\n }\n return list;\n }\n\n function parseSphereScriptData(scriptText) {\n var res = {\n acidAx: \"\u03b4HD\",\n baseAx: \"\u03b4HA\",\n score01: 1,\n sphere3D: {\n single: { centerD: 16.0, centerP: 6.2, centerH: 16.4, radius: 2.07 }\n },\n sphere4D: {\n single: { centerD: 16.7, centerP: 6.0, centerHD: 8.6, centerHA: 12.8, radius: 3.44 }\n }\n };\n if (!scriptText) return res;\n\n var nl = String.fromCharCode(10);\n var cr = String.fromCharCode(13);\n\n var rawLines = scriptText.split(nl);\n for (var i = 0; i < rawLines.length; i++) {\n var trimmed = rawLines[i].replace(cr, '').trim();\n if (!trimmed) continue;\n\n var eqIdx = trimmed.indexOf('=');\n if (eqIdx === -1) continue;\n\n var left = trimmed.substring(0, eqIdx).trim();\n var right = trimmed.substring(eqIdx + 1).trim();\n\n if (right.length > 0) {\n if (right.charAt(right.length - 1) === ';') {\n right = right.substring(0, right.length - 1).trim();\n }\n }\n if (isEnclosedInQuotes(right)) {\n right = right.substring(1, right.length - 1);\n }\n\n var leftLower = left.toLowerCase();\n\n if (leftLower === 'acidax') {\n res.acidAx = right;\n } else if (leftLower === 'baseax') {\n res.baseAx = right;\n } else if (leftLower === 'score01') {\n res.score01 = parseFloat(right) || 1;\n } else if (leftLower.indexOf('sphere3d') === 0) {\n var b1 = left.indexOf('[');\n var b2 = left.indexOf(']');\n var b3 = left.indexOf('[', b2 + 1);\n var b4 = left.indexOf(']', b3 + 1);\n if (b1 !== -1) { if (b2 !== -1) { if (b3 !== -1) { if (b4 !== -1) {\n var sphereIdx = parseInt(left.substring(b1 + 1, b2).trim(), 10);\n var paramIdx = parseInt(left.substring(b3 + 1, b4).trim(), 10);\n var val = parseFloat(right) || 0;\n\n if (sphereIdx === 0) {\n if (paramIdx === 0) res.sphere3D.single.centerD = val;\n if (paramIdx === 1) res.sphere3D.single.centerP = val;\n if (paramIdx === 2) res.sphere3D.single.centerH = val;\n if (paramIdx === 3) res.sphere3D.single.radius = val;\n } else if (sphereIdx === 1) {\n if (!res.sphere3D.double1) res.sphere3D.double1 = { centerD: 0, centerP: 0, centerH: 0, radius: 0 };\n if (paramIdx === 0) res.sphere3D.double1.centerD = val;\n if (paramIdx === 1) res.sphere3D.double1.centerP = val;\n if (paramIdx === 2) res.sphere3D.double1.centerH = val;\n if (paramIdx === 3) res.sphere3D.double1.radius = val;\n } else if (sphereIdx === 2) {\n if (!res.sphere3D.double2) res.sphere3D.double2 = { centerD: 0, centerP: 0, centerH: 0, radius: 0 };\n if (paramIdx === 0) res.sphere3D.double2.centerD = val;\n if (paramIdx === 1) res.sphere3D.double2.centerP = val;\n if (paramIdx === 2) res.sphere3D.double2.centerH = val;\n if (paramIdx === 3) res.sphere3D.double2.radius = val;\n }\n } } } }\n } else if (leftLower.indexOf('sphere4d') === 0) {\n var sb1 = left.indexOf('[');\n var sb2 = left.indexOf(']');\n var sb3 = left.indexOf('[', sb2 + 1);\n var sb4 = left.indexOf(']', sb3 + 1);\n if (sb1 !== -1) { if (sb2 !== -1) { if (sb3 !== -1) { if (sb4 !== -1) {\n var sphereIdx4 = parseInt(left.substring(sb1 + 1, sb2).trim(), 10);\n var paramIdx4 = parseInt(left.substring(sb3 + 1, sb4).trim(), 10);\n var val4 = parseFloat(right) || 0;\n\n if (sphereIdx4 === 0) {\n if (paramIdx4 === 0) res.sphere4D.single.centerD = val4;\n if (paramIdx4 === 1) res.sphere4D.single.centerP = val4;\n if (paramIdx4 === 2) res.sphere4D.single.centerHD = val4;\n if (paramIdx4 === 3) res.sphere4D.single.centerHA = val4;\n if (paramIdx4 === 4) res.sphere4D.single.radius = val4;\n } else if (sphereIdx4 === 1) {\n if (!res.sphere4D.double1) res.sphere4D.double1 = { centerD: 0, centerP: 0, centerHD: 0, centerHA: 0, radius: 0 };\n if (paramIdx4 === 0) res.sphere4D.double1.centerD = val4;\n if (paramIdx4 === 1) res.sphere4D.double1.centerP = val4;\n if (paramIdx4 === 2) res.sphere4D.double1.centerHD = val4;\n if (paramIdx4 === 3) res.sphere4D.double1.centerHA = val4;\n if (paramIdx4 === 4) res.sphere4D.double1.radius = val4;\n } else if (sphereIdx4 === 2) {\n if (!res.sphere4D.double2) res.sphere4D.double2 = { centerD: 0, centerP: 0, centerHD: 0, centerHA: 0, radius: 0 };\n if (paramIdx4 === 0) res.sphere4D.double2.centerD = val4;\n if (paramIdx4 === 1) res.sphere4D.double2.centerP = val4;\n if (paramIdx4 === 2) res.sphere4D.double2.centerHD = val4;\n if (paramIdx4 === 3) res.sphere4D.double2.centerHA = val4;\n if (paramIdx4 === 4) res.sphere4D.double2.radius = val4;\n }\n } } } }\n }\n }\n\n return res;\n }\n\n let solvents = [];\n let sphereResult = {};\n let acidAx = '\u03b4HD';\n let baseAx = '\u03b4HA';\n let isScoreContinuous = false;\n let hasSphereData = false;\n\n let currentPreset = initialSettings.presetType || '3D';\n let currentSphereMode = initialSettings.sphereMode || 'single';\n\n let scene, camera, renderer, controls;\n let autoRotate = false;\n let raycaster, mouse;\n let solventMeshes = [];\n let sphereMeshes = [];\n\n function applyDataFromTextareas() {\n const svElem = document.getElementById('textareaSV');\n const spElem = document.getElementById('textareaSP');\n\n if (svElem) {\n if (svElem.value.trim()) {\n const parsedSolvents = parseTSVData(svElem.value);\n if (parsedSolvents.length > 0) {\n solvents = parsedSolvents;\n }\n }\n }\n\n if (spElem) {\n if (spElem.value.trim()) {\n const parsedResult = parseSphereScriptData(spElem.value);\n sphereResult = parsedResult;\n acidAx = sphereResult.acidAx || '\u03b4HD';\n baseAx = sphereResult.baseAx || '\u03b4HA';\n isScoreContinuous = sphereResult.score01 === 0;\n hasSphereData = \/Sphere3D|Sphere4D\/i.test(spElem.value);\n\n const btnSingle = document.getElementById('mode-single');\n const btnDouble = document.getElementById('mode-double');\n if (btnDouble) {\n btnDouble.disabled = isScoreContinuous || !hasSphereData;\n if (isScoreContinuous || !hasSphereData) btnDouble.title = !hasSphereData ? 'No sphere parameters in script' : 'Score01=0: Real score mode';\n }\n if (btnSingle) {\n btnSingle.disabled = !hasSphereData;\n if (!hasSphereData) btnSingle.title = 'No sphere parameters in script';\n }\n\n if (isScoreContinuous || !hasSphereData) {\n currentSphereMode = 'single';\n if (btnSingle) btnSingle.classList.add('active');\n if (btnDouble) btnDouble.classList.remove('active');\n }\n }\n }\n\n setPreset(currentPreset);\n }\n\n function toggleDataEditor() {\n const panel = document.getElementById('paste-editor-panel');\n if (!panel) return;\n const currentDisp = window.getComputedStyle(panel).display;\n if (currentDisp === 'none') {\n panel.style.display = 'flex';\n } else {\n panel.style.display = 'none';\n }\n }\n\n \/\/ Axis coordinate mapper\n function calcCoords(dD, dP, dH, dHD, dHA, preset) {\n const MyVC6 = 10.0;\n let molpx = 2 * (dD - MyVC6);\n let molpz = dP;\n let molpy = dH;\n\n switch (preset) {\n case '4D-1':\n molpx = 2 * (dD - MyVC6);\n molpz = dHD;\n molpy = dHA;\n break;\n case '4D-2':\n molpx = 2 * (dD - MyVC6);\n molpz = dP;\n molpy = Math.sqrt(Math.max(0, dHD * dHA));\n break;\n case '4D-3':\n molpx = 2 * (Math.sqrt(dD * dD + dP * dP) - MyVC6);\n molpz = dHD;\n molpy = dHA;\n break;\n case '3D':\n default:\n molpx = 2 * (dD - MyVC6);\n molpz = dP;\n molpy = dH;\n break;\n }\n return { x: molpz, y: molpy, z: molpx };\n }\n\n function getDimensions() {\n if (typeof CSF !== 'undefined') {\n if (CSF === 1) {\n return { width: 600, height: 600 };\n }\n }\n return { width: window.innerWidth - 24, height: Math.max(400, window.innerHeight - 80) };\n }\n\n function updateLayoutDimensions() {\n const wrapper = document.getElementById('app-wrapper');\n const panel = document.getElementById('top-control-panel');\n const editorPanel = document.getElementById('paste-editor-panel');\n const container = document.getElementById('viewer-container');\n const dims = getDimensions();\n\n if (typeof CSF !== 'undefined') {\n if (CSF === 1) {\n if (wrapper) wrapper.style.width = '600px';\n if (panel) {\n panel.style.width = '600px';\n panel.style.borderRadius = '8px 8px 0 0';\n }\n if (editorPanel) editorPanel.style.width = '600px';\n if (container) {\n container.style.width = '600px';\n container.style.height = '600px';\n container.style.borderRadius = '0 0 8px 8px';\n }\n } else {\n if (wrapper) wrapper.style.width = '100%';\n if (panel) {\n panel.style.width = '100%';\n panel.style.borderRadius = '0';\n }\n if (editorPanel) editorPanel.style.width = '100%';\n if (container) {\n container.style.width = '100%';\n container.style.height = dims.height + 'px';\n container.style.borderRadius = '0';\n }\n }\n } else {\n if (wrapper) wrapper.style.width = '100%';\n if (panel) {\n panel.style.width = '100%';\n panel.style.borderRadius = '0';\n }\n if (editorPanel) editorPanel.style.width = '100%';\n if (container) {\n container.style.width = '100%';\n container.style.height = dims.height + 'px';\n container.style.borderRadius = '0';\n }\n }\n\n if (renderer) {\n if (camera) {\n camera.aspect = dims.width \/ dims.height;\n camera.updateProjectionMatrix();\n renderer.setSize(dims.width, dims.height);\n }\n }\n }\n\n function init() {\n const container = document.getElementById('canvas-container');\n updateLayoutDimensions();\n const dims = getDimensions();\n\n scene = new THREE.Scene();\n const currentBgTheme = initialSettings.bgTheme || 'dark';\n const bgHex = currentBgTheme === 'dark' ? 0x0f172a : (currentBgTheme === 'ash' ? 0x1f2937 : 0xf8fafc);\n document.body.style.backgroundColor = currentBgTheme === 'dark' ? '#0f172a' : (currentBgTheme === 'ash' ? '#1f2937' : '#f8fafc');\n document.body.style.color = currentBgTheme === 'light' ? '#0f172a' : '#f8fafc';\n scene.background = new THREE.Color(bgHex);\n\n camera = new THREE.PerspectiveCamera(45, dims.width \/ dims.height, 0.1, 1000);\n camera.position.set(40, 32, 50);\n\n renderer = new THREE.WebGLRenderer({ antialias: true, preserveDrawingBuffer: true });\n renderer.setSize(dims.width, dims.height);\n renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2));\n container.appendChild(renderer.domElement);\n\n controls = new THREE.OrbitControls(camera, renderer.domElement);\n controls.enableDamping = true;\n controls.dampingFactor = 0.08;\n controls.target.set(12.5, 12.5, 15);\n\n const ambientLight = new THREE.AmbientLight(0xffffff, 0.95);\n scene.add(ambientLight);\n\n const dirLight1 = new THREE.DirectionalLight(0xffffff, 1.2);\n dirLight1.position.set(50, 80, 50);\n scene.add(dirLight1);\n\n raycaster = new THREE.Raycaster();\n mouse = new THREE.Vector2();\n\n \/\/ Initial parse from textareas\n applyDataFromTextareas();\n\n window.addEventListener('resize', onWindowResize);\n renderer.domElement.addEventListener('mousemove', onPointerMove);\n\n animate();\n }\n\n function renderSceneObjects() {\n const objectsToRemove = [];\n scene.children.forEach(child => {\n if (!(child instanceof THREE.Light)) {\n objectsToRemove.push(child);\n }\n });\n objectsToRemove.forEach(obj => scene.remove(obj));\n solventMeshes = [];\n sphereMeshes = [];\n\n \/\/ 1. Render Axes Helper & Custom Grids\n const axesGroup = new THREE.Group();\n const maxX = 25; \/\/ dP \/ dHD axis (0..25)\n const maxY = 25; \/\/ dH \/ dHA axis (0..25)\n const maxZ = 30; \/\/ dD axis (2*(dD-10) => 10..25 => 0..30)\n\n const xAxisArrow = new THREE.ArrowHelper(new THREE.Vector3(1, 0, 0), new THREE.Vector3(0, 0, 0), maxX, 0xef4444, 1.5, 1);\n const yAxisArrow = new THREE.ArrowHelper(new THREE.Vector3(0, 1, 0), new THREE.Vector3(0, 0, 0), maxY, 0x10b981, 1.5, 1);\n const zAxisArrow = new THREE.ArrowHelper(new THREE.Vector3(0, 0, 1), new THREE.Vector3(0, 0, 0), maxZ, 0x3b82f6, 1.5, 1);\n axesGroup.add(xAxisArrow, yAxisArrow, zAxisArrow);\n\n const gridPoints = [];\n\n for (let x = 0; x <= maxX; x += 5) {\n gridPoints.push(x, 0, 0, x, maxY, 0);\n gridPoints.push(x, 0, 0, x, 0, maxZ);\n }\n for (let y = 0; y <= maxY; y += 5) {\n gridPoints.push(0, y, 0, maxX, y, 0);\n gridPoints.push(0, y, 0, 0, y, maxZ);\n }\n for (let z = 0; z <= maxZ; z += 5) {\n gridPoints.push(0, 0, z, maxX, 0, z);\n gridPoints.push(0, 0, z, 0, maxY, z);\n }\n\n const gridGeo = new THREE.BufferGeometry();\n gridGeo.setAttribute('position', new THREE.Float32BufferAttribute(gridPoints, 3));\n const gridMat = new THREE.LineBasicMaterial({\n color: 0x94a3b8,\n transparent: true,\n opacity: 0.35\n });\n const gridLines = new THREE.LineSegments(gridGeo, gridMat);\n axesGroup.add(gridLines);\n\n scene.add(axesGroup);\n\n \/\/ 2. Render Hansen Sphere(s)\n function renderHansenSphere(name, cD, cP, cH, cHD, cHA, radius, sphereIndex = 0) {\n const coords = calcCoords(cD, cP, cH, cHD, cHA, currentPreset);\n const group = new THREE.Group();\n group.position.set(coords.x, coords.y, coords.z);\n group.scale.set(1.0, 1.0, 1.0);\n\n const r = SAR[sphereIndex] !== undefined ? SAR[sphereIndex] : 0;\n const g = SAG[sphereIndex] !== undefined ? SAG[sphereIndex] : 255;\n const b = SAB[sphereIndex] !== undefined ? SAB[sphereIndex] : 0;\n\n const sphereInfo = { name, cD, cP, cH, cHD, cHA, radius };\n\n const wireframeGeo = new THREE.WireframeGeometry(new THREE.SphereGeometry(radius, 16, 12));\n const wireframeMat = new THREE.LineBasicMaterial({\n color: new THREE.Color(r \/ 255, g \/ 255, b \/ 255),\n linewidth: 2,\n transparent: true,\n opacity: 0.85\n });\n const wireframeLine = new THREE.LineSegments(wireframeGeo, wireframeMat);\n group.add(wireframeLine);\n\n const centerGeo = new THREE.SphereGeometry(0.6, 16, 16);\n const centerMat = new THREE.MeshStandardMaterial({\n color: new THREE.Color(r \/ 255, g \/ 255, b \/ 255),\n roughness: 0.2,\n metalness: 0.3,\n emissive: new THREE.Color(r \/ 255, g \/ 255, b \/ 255),\n emissiveIntensity: 0.2\n });\n const centerMesh = new THREE.Mesh(centerGeo, centerMat);\n centerMesh.userData = { sphereInfo };\n group.add(centerMesh);\n sphereMeshes.push(centerMesh);\n\n scene.add(group);\n }\n\n const defaultS3 = { centerD: 16.0, centerP: 6.2, centerH: 16.4, radius: 2.07 };\n if (!hasSphereData) {\n \/\/ Do not render any sphere if script lacks Sphere3D\/Sphere4D parameters\n } else if (currentSphereMode === 'single' || isScoreContinuous) {\n const s3d = sphereResult?.sphere3D?.single || defaultS3;\n const s4d = sphereResult?.sphere4D?.single;\n renderHansenSphere('Single Hansen Sphere', s3d.centerD, s3d.centerP, s3d.centerH, s4d?.centerHD ?? 1.0, s4d?.centerHA ?? 7.0, s3d.radius, 0);\n } else {\n const s1_3d = sphereResult?.sphere3D?.double1 || defaultS3;\n const s2_3d = sphereResult?.sphere3D?.double2 || defaultS3;\n const s1_4d = sphereResult?.sphere4D?.double1;\n const s2_4d = sphereResult?.sphere4D?.double2;\n renderHansenSphere('Hansen Sphere #1', s1_3d.centerD, s1_3d.centerP, s1_3d.centerH, s1_4d?.centerHD ?? 1.0, s1_4d?.centerHA ?? 7.0, s1_3d.radius, 0);\n renderHansenSphere('Hansen Sphere #2', s2_3d.centerD, s2_3d.centerP, s2_3d.centerH, s2_4d?.centerHD ?? 1.0, s2_4d?.centerHA ?? 7.0, s2_3d.radius, 1);\n }\n\n \/\/ 3. Render Solvents\n const isRealScore = isScoreContinuous || solvents.some(s => !Number.isInteger(s.score) || s.score < 0 || s.score > 7);\n const rankColorIndices = [1, 2, 3, 4, 5, 6];\n\n const realScoreRankMap = new Map();\n if (isRealScore) {\n if (solvents.length > 0) {\n \/\/ Sort descending by score (highest score = best solvent = Blue: Index 1)\n const sorted = solvents.slice().sort((a, b) => (b.score || 0) - (a.score || 0));\n const N = sorted.length;\n sorted.forEach((sol, idx) => {\n const rankIdx = Math.min(5, Math.floor((6 * idx) \/ N));\n realScoreRankMap.set(sol.id || sol.no || idx, rankColorIndices[rankIdx]);\n });\n }\n }\n\n solvents.forEach((sol, solIdx) => {\n const coords = calcCoords(sol.dD, sol.dP, sol.dH, sol.dHD, sol.dHA, currentPreset);\n const score = sol.score;\n\n let molpr = 0.65;\n if (RaVo === 1) {\n var mVol = sol.mVol || 0;\n molpr = (1.0 * Math.sqrt(Math.max(0, mVol))) \/ VolRadF;\n if (molpr <= 0) molpr = 0.3;\n } else {\n var scoreIdx = Math.max(0, Math.min(7, Math.floor(score || 0)));\n var srdVal = SRd[scoreIdx] !== undefined ? SRd[scoreIdx] : 20;\n molpr = (1.0 * srdVal) \/ 30.0;\n }\n\n let colR = 0, colG = 0, colB = 255;\n if (Number.isInteger(score)) {\n if (score >= 0) {\n if (score <= 7) {\n colR = SR[score];\n colG = SG[score];\n colB = SB[score];\n } else if (isRealScore) {\n const solKey = sol.id || sol.no || solIdx;\n const paletteIdx = realScoreRankMap.get(solKey) !== undefined ? realScoreRankMap.get(solKey) : 1;\n colR = SR[paletteIdx];\n colG = SG[paletteIdx];\n colB = SB[paletteIdx];\n } else {\n colR = SR[0];\n colG = SG[0];\n colB = SB[0];\n }\n } else if (isRealScore) {\n const solKey = sol.id || sol.no || solIdx;\n const paletteIdx = realScoreRankMap.get(solKey) !== undefined ? realScoreRankMap.get(solKey) : 1;\n colR = SR[paletteIdx];\n colG = SG[paletteIdx];\n colB = SB[paletteIdx];\n } else {\n colR = SR[0];\n colG = SG[0];\n colB = SB[0];\n }\n } else if (isRealScore) {\n const solKey = sol.id || sol.no || solIdx;\n const paletteIdx = realScoreRankMap.get(solKey) !== undefined ? realScoreRankMap.get(solKey) : 1;\n colR = SR[paletteIdx];\n colG = SG[paletteIdx];\n colB = SB[paletteIdx];\n } else {\n colR = SR[0];\n colG = SG[0];\n colB = SB[0];\n }\n\n const solventGeo = new THREE.SphereGeometry(molpr, 24, 24);\n const mat = new THREE.MeshStandardMaterial({\n color: new THREE.Color(colR \/ 255, colG \/ 255, colB \/ 255),\n roughness: 0.15,\n metalness: 0.2\n });\n const mesh = new THREE.Mesh(solventGeo, mat);\n mesh.position.set(coords.x, coords.y, coords.z);\n mesh.userData = sol;\n scene.add(mesh);\n solventMeshes.push(mesh);\n });\n }\n\n function toggleRaVo() {\n RaVo = RaVo === 1 ? 0 : 1;\n const btn = document.getElementById('btn-ravo');\n const lbl = document.getElementById('ravo-label');\n if (btn) btn.classList.toggle('active', RaVo === 1);\n if (lbl) lbl.textContent = RaVo === 1 ? 'MVol' : 'SRd';\n renderSceneObjects();\n }\n\n function toggleSRdPanel() {\n const panel = document.getElementById('srd-config-panel');\n if (panel) {\n panel.style.display = panel.style.display === 'none' ? 'block' : 'none';\n }\n }\n\n function updateSRd(scoreIdx, val) {\n SRd[scoreIdx] = parseFloat(val) || 0;\n if (RaVo === 0) {\n renderSceneObjects();\n }\n }\n\n function updateVolRadF(val) {\n VolRadF = parseFloat(val) || 10.0;\n if (RaVo === 1) {\n renderSceneObjects();\n }\n }\n\n function setPreset(preset) {\n currentPreset = preset;\n ['3D', '4D-1', '4D-2', '4D-3'].forEach(p => {\n const el = document.getElementById('btn-' + p);\n if (el) el.classList.toggle('active', p === preset);\n });\n\n const descMap = {\n '3D': '3D: [<span style=\"color:#60a5fa\">\u624b\u524d: 2*\u03b4D<\/span>, <span style=\"color:#f87171\">\u53f3: \u03b4P<\/span>, <span style=\"color:#34d399\">\u4e0a: \u03b4H<\/span>]',\n '4D-1': '4D-1: [<span style=\"color:#60a5fa\">\u624b\u524d: 2*\u03b4D<\/span>, <span style=\"color:#f87171\">\u53f3: ' + acidAx + '<\/span>, <span style=\"color:#34d399\">\u4e0a: ' + baseAx + '<\/span>]',\n '4D-2': '4D-2: [<span style=\"color:#60a5fa\">\u624b\u524d: 2*\u03b4D<\/span>, <span style=\"color:#f87171\">\u53f3: \u03b4P<\/span>, <span style=\"color:#34d399\">\u4e0a: \u221a(' + acidAx + '*' + baseAx + ')<\/span>]',\n '4D-3': '4D-3: [<span style=\"color:#60a5fa\">\u624b\u524d: 2*\u221a(\u03b4D\u00b2+\u03b4P\u00b2)<\/span>, <span style=\"color:#f87171\">\u53f3: ' + acidAx + '<\/span>, <span style=\"color:#34d399\">\u4e0a: ' + baseAx + '<\/span>]'\n };\n const formulaEl = document.getElementById('axis-formula');\n if (formulaEl) formulaEl.innerHTML = descMap[preset];\n\n renderSceneObjects();\n }\n\n function changeSphereMode(mode) {\n if (mode === 'double') {\n if (isScoreContinuous || !hasSphereData) {\n return;\n }\n }\n currentSphereMode = mode;\n const elSingle = document.getElementById('mode-single');\n const elDouble = document.getElementById('mode-double');\n if (elSingle) elSingle.classList.toggle('active', mode === 'single');\n if (elDouble) elDouble.classList.toggle('active', mode === 'double');\n renderSceneObjects();\n }\n\n function animate() {\n requestAnimationFrame(animate);\n if (autoRotate) {\n scene.rotation.y += 0.005;\n }\n controls.update();\n renderer.render(scene, camera);\n }\n\n function onWindowResize() {\n updateLayoutDimensions();\n }\n\n function onPointerMove(e) {\n const container = document.getElementById('viewer-container');\n if (!container) return;\n const rect = container.getBoundingClientRect();\n\n const mouseX = e.clientX - rect.left;\n const mouseY = e.clientY - rect.top;\n\n mouse.x = (mouseX \/ rect.width) * 2 - 1;\n mouse.y = -(mouseY \/ rect.height) * 2 + 1;\n\n raycaster.setFromCamera(mouse, camera);\n const allTargets = [...solventMeshes, ...sphereMeshes];\n const intersects = raycaster.intersectObjects(allTargets);\n\n const tooltip = document.getElementById('tooltip');\n if (intersects.length > 0) {\n const topObj = intersects[0].object;\n tooltip.style.display = 'block';\n tooltip.style.left = Math.min(mouseX + 12, rect.width - 220) + 'px';\n tooltip.style.top = Math.max(mouseY - 10, 10) + 'px';\n\n if (topObj.userData.sphereInfo) {\n const info = topObj.userData.sphereInfo;\n tooltip.innerHTML =\n '<strong style=\"color:#10b981;font-size:13px\">' + info.name + '<\/strong><br\/>' +\n '\u03b4D: ' + info.cD.toFixed(2) + ' | \u03b4P: ' + info.cP.toFixed(2) + ' | \u03b4H: ' + info.cH.toFixed(2) + '<br\/>' +\n 'Radius (R0): ' + info.radius.toFixed(2) +\n (info.cHD !== undefined ? ('<br\/>' + acidAx + ': ' + info.cHD.toFixed(2) + ' | ' + baseAx + ': ' + info.cHA.toFixed(2)) : '');\n } else {\n const sol = topObj.userData;\n const isGood = sol.score >= 0.5;\n tooltip.innerHTML =\n '<strong style=\"color:#38bdf8;font-size:13px\">' + sol.name + '<\/strong><br\/>' +\n '\u03b4D: ' + sol.dD + ' | \u03b4P: ' + sol.dP + ' | \u03b4H: ' + sol.dH + '<br\/>' +\n acidAx + ': ' + sol.dHD + ' | ' + baseAx + ': ' + sol.dHA + ' | MVol: ' + sol.mVol + '<br\/>' +\n (sol.remarks ? ('Remarks: ' + sol.remarks + '<br\/>') : '') +\n '<div style=\"margin-top:4px;padding-top:4px;border-top:1px solid #334155\">' +\n ' Score: <span style=\"font-weight:bold;color:' + (isGood ? '#3b82f6' : '#ef4444') + '\">' + sol.score + '<\/span> | RED: ' + sol.red +\n '<\/div>';\n }\n } else {\n tooltip.style.display = 'none';\n }\n }\n\n function resetCamera() {\n camera.position.set(30, 25, 40);\n controls.target.set(10, 10, 10);\n scene.rotation.y = 0;\n }\n\n function toggleDataEditor() {\n var panel = document.getElementById(\"paste-editor-panel\");\n if (panel) {\n if (panel.style.display === \"none\" || panel.style.display === \"\") {\n panel.style.display = \"block\";\n } else {\n panel.style.display = \"none\";\n }\n }\n }\n\n function toggleRotate() {\n autoRotate = !autoRotate;\n }\n\n function takeScreenshot() {\n if (renderer) {\n if (scene) {\n if (camera) {\n renderer.render(scene, camera);\n const dataURL = renderer.domElement.toDataURL('image\/png');\n const a = document.createElement('a');\n a.download = 'pirika_hsp_3d.png';\n a.href = dataURL;\n document.body.appendChild(a);\n a.click();\n document.body.removeChild(a);\n }\n }\n }\n }\n\n function escapeHTMLText(str) {\n if (!str) return '';\n return str\n .replace(\/&\/g, '&')\n .replace(\/<\/g, '<')\n .replace(\/>\/g, '>');\n }\n\n function exportBabyHTML() {\n var svElem = document.getElementById('textareaSV');\n var spElem = document.getElementById('textareaSP');\n var descElem = document.getElementById('textareaDesc');\n var currentSV = svElem ? svElem.value : '';\n var currentSP = spElem ? spElem.value : '';\n var currentDesc = descElem ? descElem.value : '';\n\n var clone = document.documentElement.cloneNode(true);\n\n \/\/ Update JSON-LD description in clone\n var ldScript = clone.querySelector('script[type=\"application\/ld+json\"]');\n if (ldScript) {\n if (currentDesc) {\n try {\n var ldData = JSON.parse(ldScript.textContent || '{}');\n ldData.description = currentDesc;\n ldScript.textContent = JSON.stringify(ldData, null, 2);\n } catch (e) {\n console.warn('JSON-LD update error:', e);\n }\n }\n }\n\n \/\/ Clear dynamically generated DOM elements\n var canvasContainer = clone.querySelector('#canvas-container');\n if (canvasContainer) canvasContainer.innerHTML = '';\n\n var tableContainer = clone.querySelector('#solvent-table-container');\n if (tableContainer) tableContainer.innerHTML = '';\n\n var legendContent = clone.querySelector('#legend-content');\n if (legendContent) legendContent.innerHTML = '';\n\n var toggleBtn = clone.querySelector('.data-toggle-btn');\n if (toggleBtn) {\n if (toggleBtn.parentNode) {\n toggleBtn.parentNode.removeChild(toggleBtn);\n }\n }\n\n var srdConfigBtn = clone.querySelector('button[onclick=\"toggleSRdPanel()\"]');\n if (srdConfigBtn) {\n if (srdConfigBtn.parentNode) {\n srdConfigBtn.parentNode.removeChild(srdConfigBtn);\n }\n }\n\n var srdPanel = clone.querySelector('#srd-config-panel');\n if (srdPanel) {\n if (srdPanel.parentNode) {\n srdPanel.parentNode.removeChild(srdPanel);\n }\n }\n\n var editorPanel = clone.querySelector('#paste-editor-panel');\n if (editorPanel) {\n if (editorPanel.parentNode) {\n var parent = editorPanel.parentNode;\n\n var taDesc = document.createElement('textarea');\n taDesc.id = 'textareaDesc';\n taDesc.style.display = 'none';\n taDesc.innerHTML = escapeHTMLText(currentDesc);\n\n var taSV = document.createElement('textarea');\n taSV.id = 'textareaSV';\n taSV.style.display = 'none';\n taSV.innerHTML = escapeHTMLText(currentSV);\n\n var taSP = document.createElement('textarea');\n taSP.id = 'textareaSP';\n taSP.style.display = 'none';\n taSP.innerHTML = escapeHTMLText(currentSP);\n\n parent.insertBefore(taDesc, editorPanel);\n parent.insertBefore(taSV, editorPanel);\n parent.insertBefore(taSP, editorPanel);\n parent.removeChild(editorPanel);\n }\n } else {\n var cloneDesc = clone.querySelector('#textareaDesc');\n if (cloneDesc) cloneDesc.innerHTML = escapeHTMLText(currentDesc);\n var cloneSV = clone.querySelector('#textareaSV');\n if (cloneSV) cloneSV.innerHTML = escapeHTMLText(currentSV);\n var cloneSP = clone.querySelector('#textareaSP');\n if (cloneSP) cloneSP.innerHTML = escapeHTMLText(currentSP);\n }\n\n var nl = String.fromCharCode(10);\n var fullBabyHTML = '<!DOCTYPE html>' + nl + clone.outerHTML;\n\n var blob = new Blob([fullBabyHTML], { type: 'text\/html;charset=utf-8' });\n var url = URL.createObjectURL(blob);\n var a = document.createElement('a');\n a.href = url;\n a.download = 'pirika_hsp_baby.html';\n document.body.appendChild(a);\n a.click();\n document.body.removeChild(a);\n URL.revokeObjectURL(url);\n }\n\n window.onload = init;\n <\/script>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u3060\u5c11\u3057\u30d0\u30b0\u304c\u3042\u308b\u304c\u5f90\u3005\u306b\u76f4\u3057\u3066\u3044\u304f\u3002HSPiP\u30d7\u30e9\u30b9\u3067SphereViewer\u3067\u898b\u3066\u3044\u308b\u3082\u306e\u304c\u72ec\u7acb\u306ehtml\u3068\u3057\u3066\u5410\u304d\u51fa\u3055\u308c\u308b\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">[3. \u30aa\u30d7\u30b7\u30e7\u30f3\u30fb\u30dc\u30bf\u30f3]<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">HSPiP\u30d7\u30e9\u30b9\u3067\u306f\u3001Score\u304c0,1\u306e\u5b9a\u6027\u7684\u89e3\u6790\u306e\u5834\u5408\u30013D-HSP, 4D-HSP\u306eSingle\u7403\u3001Double\u7403\u306e\u6eb6\u89e3\u7403\u63a2\u7d22\u3092\u884c\u3046\u3002Sphere\u306e\u500b\u6570\u306b\u3064\u3044\u3066\u306fSingle Double\u3067\u5207\u308a\u66ff\u3048\u308b\u3002<br><br>3D-HSP\u3067\u306f\uff13\u6b21\u5143\u8868\u793a\u306e\u8ef8\u306f\uff11\u3064\u306b\u6c7a\u307e\u308b\u306e\u3067Axis\u306f\uff11\u3092\u9078\u3076\u3002<br>4D-HSP\u3067\u306f\uff13\u3064\u306e\u8ef8\u306b\u3069\u306e\u5024\u3092\u30a2\u30b5\u30a4\u30f3\u3059\u308b\u304b\uff13\u3064\u306e\u9078\u629e\u80a2\u304c\u3042\u308b\u3002<br>4D-1\u306f[\u03b4D, \u03b4HD, \u03b4HA]\u3067\u03b4P\u3092\u9664\u3044\u305f\uff13\u8ef8\u3067\u8868\u793a\u3059\u308b\u3002[HD, \u03b4HA]\u306e\u52b9\u679c\u304c\u9855\u8457\u306a\u6eb6\u89e3\u306e\u5834\u5408\u8996\u8a8d\u6027\u304c\u9ad8\u304f\u306a\u308b\u3002<br>4D-2\u306f[\u03b4D, \u03b4P, \u221a(\u03b4HA*\u03b4HD)]\u306e3\u8ef8\u3067\u8868\u793a\u3059\u308b\u30023D\u8868\u793a\u306b\u8fd1\u3044\u304c\u03b4HA*\u03b4HD\u306e\u52b9\u679c\u304c\u306f\u3063\u304d\u308a\u51fa\u308b\u3002<br>4D-3\u306f[ \u221a(\u03b4D<sup>2<\/sup>+\u03b4P<sup>2<\/sup>), \u03b4HD, \u03b4HA]\u306e\uff13\u8ef8\u3067\u8868\u793a\u3059\u308b\u3002\uff14\u6b21\u5143\u306e\u52b9\u679c\u3092\u30d0\u30e9\u30f3\u30b9\u3088\u304f\u8868\u73fe\u3057\u3066\u3044\u308b\u3002<br>\u3042\u304f\u307e\u3067\u3082\uff14\u6b21\u5143\u3092\uff13\u6b21\u5143\u3067\u307f\u3066\u3044\u308b\u3060\u3051\u306a\u306e\u3067\u3001\uff13\u3064\u306e\u30d7\u30ed\u30c3\u30c8\u3092\u3069\u308c\u3082\u3088\u304f\u898b\u3066\u5224\u65ad\u3059\u308b\u5fc5\u8981\u304c\u3042\u308b\u3002AI\u306b\u3068\u3063\u3066\u306f\u5f0f\u306e\u5185\u5074\u3001\u5916\u5074\u306a\u306e\u3067\u6b21\u5143\u6570\u306f\u95a2\u4fc2\u306a\u3044\u3002<br><br>Rotate\u30dc\u30bf\u30f3\u306f\u81ea\u52d5\u56de\u8ee2\u30dc\u30bf\u30f3\u3067\u30c8\u30b0\u30eb\u306b\u306a\u3063\u3066\u3044\u308b\u3002<br><br>Reset view\u30dc\u30bf\u30f3\u306f\u521d\u671f\u306b\u623b\u3059\u3002<br><br>ScreenShot\u30dc\u30bf\u30f3\u306fCANVAS\u306epng\u3092\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9\u3059\u308b\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">[3. \u624b\u52d5\u5909\u66f4\u306e\u30b9\u30a4\u30c3\u30c1]<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">HSPiP\u30d7\u30e9\u30b9\u306b\u751f\u6210\u3055\u305b\u305fSV.html\u306e\u5834\u5408\u3001\u30de\u30cb\u30e5\u30a2\u30eb\u3067\u30b9\u30a4\u30c3\u30c1\u3092\u5909\u66f4\u3059\u308b\u4e8b\u306b\u3088\u3063\u3066\u8868\u73fe\u304c\u304b\u308f\u308b\u3002\uff08\u30c6\u30ad\u30b9\u30c8\u30b5\u30fc\u30c1\u3057\u3066\u63a2\u3057\u3066\u307b\u3057\u3044\uff09<br>\u5ff5\u306e\u70ba\u30d0\u30c3\u30af\u30a2\u30c3\u30d7\u3057\u3066\u304b\u3089\u5909\u66f4\u3059\u308b\u3053\u3068\u3092\u304a\u52e7\u3081\u3059\u308b\u3002<br><br>CANVAS\u306eTheme\u306f\u3000”bgTheme”:”light”\u3000\u3067\u6c7a\u3081\u3066\u3042\u308b\u3002dark\u3001ash\u306b\u5909\u3048\u308b\u4e8b\u304c\u3067\u304d\u308b\u3002<br><br>\u6eb6\u5a92\u306e\u56fa\u5b9a\u30b5\u30a4\u30ba\u306f\u6b21\u306e\u3068\u3053\u308d\u3067\u898f\u5b9a\u3057\u3066\u3044\u308b\u3002\uff17\u3064\u3042\u308b\u306e\u306fScore\u306e\u5024\u306b\u3088\u3063\u3066\u8868\u793a\u30b5\u30a4\u30b9\u3092\u5909\u3048\u308b\u305f\u3081\u3067\u3042\u308b\u3002<br>var SRd = initialSettings.sRd || [20, 20, 20, 20, 20, 20, 20, 25];<br>\u4f8b\u3048\u3070\u6eb6\u5a92\u6570\u304c\u591a\u304f\u898b\u901a\u3057\u304c\u60aa\u3044\u5834\u5408\u306b\u306f\u3001Score=0\u306e\u8ca7\u6eb6\u5a92\u306f\u6eb6\u5a92\u306e\u56fa\u5b9a\u30b5\u30a4\u30ba\u306f3\u306b\u3057\u3066\u3057\u307e\u3046\u4e8b\u304c\u3067\u304d\u308b\u3002<br>\u6eb6\u5a92\u306e\u8272\u306b\u95a2\u3057\u3066\u3082Score\u306b\u3088\u3063\u3066\u8272\u3092\u5909\u3048\u308b\u4e8b\u304c\u3067\u304d\u308b\u3002<br>var SR = [], SG = [], SB = [];<br>\u3053\u306e\u5024\u3092\u5909\u3048\u308b\u3002<br><br>CANVAS\u306e\u30b5\u30a4\u30ba\u306f<br>Canvas Size Fix (CSF) Flag\u3067\u5909\u66f4\u3059\u308b\u3002<br>\/\/ CSF = 1: Fixed 600×600 size (WordPress embedding)<br>\/\/ CSF = 0: Responsive Full Size Canvas<br>CSF=1\u3068\u8a2d\u5b9a\u3059\u308b\u3068600*600\u306e\u56fa\u5b9aCANVAS\u30b5\u30a4\u30ba\u3092\u4f7f\u3046\u3002<br>WordPress\uff08HP\u7528\u306e\u30a8\u30c7\u30a3\u30bf\u30fc\uff09\u306b\u8cbc\u308a\u4ed8\u3051\u308b\u6642\u306b\u4fbf\u5229\u3067\u3042\u308b\u3002\u753b\u9762\u4e00\u676f\u306b\u8868\u793a\u3057\u3066\u30b9\u30af\u30ea\u30fc\u30f3\u30b7\u30e7\u30c3\u30c8\u3092\u64ae\u308a\u305f\u3044\u3068\u3044\u3046\u7528\u9014\u3067\u3042\u308c\u3070CSF=0\u306b\u3059\u308b\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\uff13\u6b21\u5143\u8868\u793a\u3059\u308b\u306e\u306b\uff12\u3064\u306eJavaScript\u3092\u30cd\u30c3\u30c8\u304b\u3089\u547c\u3076\u3002<br><code><script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/three.js\/r128\/three.min.js\">\uff1c\/script><\/code><br><code><script src=\"https:\/\/cdn.jsdelivr.net\/npm\/three@0.128.0\/examples\/js\/controls\/OrbitControls.js\"><\/script><\/code><br>\u30cd\u30c3\u30c8\u30a2\u30af\u30bb\u30b9\u3092\u7981\u6b62\u3057\u305f\u3044\u5834\u5408\u306b\u306f\uff12\u3064\u306eJS\u3092\u30ed\u30fc\u30ab\u30eb\u306b\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9\u3057\u3066\u30ed\u30fc\u30ab\u30eb\u304b\u3089\u547c\u3073\u51fa\u3059\u3088\u3046\u306b\u66f8\u304d\u63db\u3048\u308c\u3070\u826f\u3044\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3042\u308b\u7a0b\u5ea6\u30d7\u30ed\u30b0\u30e9\u30e0\u306e\u77e5\u8b58\u304c\u3042\u308c\u3070\u81ea\u5206\u3067\u76f4\u3057\u3066\u3082\u826f\u3044\u3057\u3001\u751f\u6210AI\u306bhtml\u30c6\u30ad\u30b9\u30c8\u3054\u3068\u4e38\u6295\u3052\u3057\u3066\u5909\u66f4\u3092\u983c\u3093\u3067\u3082\u826f\u3044\u3060\u308d\u3046\u3002<br>\u3000<br><\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<p class=\"wp-block-paragraph\">Copyright pirika.com since 1999-<br>Mail: yamahiro<mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">X<\/mark>pirika.com (<mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-bright-red-color\">X<\/mark>\u3092@\u306b\u7f6e\u304d\u63db\u3048\u3066\u304f\u3060\u3055\u3044) <br>\u30e1\u30fc\u30eb\u306e\u4ef6\u540d\u306f[pirika]\u3067\u59cb\u3081\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>2027.8.10 pirika.com\u3067\u5316\u5b66 \u3000>\u30c1\u30e3\u30d4\u30a8\u30e2\u30f3-3rd Pirika Origin (CPO)\u3000> \u30cf\u30f3\u30bb\u30f3\u6eb6\u89e3\u5ea6\u30d1\u30e9\u30e1\u30fc\u30bf (HSP)\u3000> \u5316\u5b66\u5168\u822c\u3000>Pirika \u30c4\u30fc\u30eb\u7fa4\u30d6 … <a href=\"https:\/\/www.pirika.com\/wp\/chemistry-at-pirika-com\/pirikapro\/hspipp\/hspipp-sv\" class=\"more-link\"><span class=\"screen-reader-text\">“HSPiP\u30d7\u30e9\u30b9-SphereViewer” \u306e<\/span>\u7d9a\u304d\u3092\u8aad\u3080<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":16420,"menu_order":5,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_locale":"ja","_original_post":"https:\/\/www.pirika.com\/wp\/chemistry-at-pirika-com\/pirikapro\/poseidon-pp","footnotes":""},"class_list":["post-24447","page","type-page","status-publish","hentry","ja"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.pirika.com\/wp\/wp-json\/wp\/v2\/pages\/24447","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.pirika.com\/wp\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.pirika.com\/wp\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.pirika.com\/wp\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.pirika.com\/wp\/wp-json\/wp\/v2\/comments?post=24447"}],"version-history":[{"count":8,"href":"https:\/\/www.pirika.com\/wp\/wp-json\/wp\/v2\/pages\/24447\/revisions"}],"predecessor-version":[{"id":24633,"href":"https:\/\/www.pirika.com\/wp\/wp-json\/wp\/v2\/pages\/24447\/revisions\/24633"}],"up":[{"embeddable":true,"href":"https:\/\/www.pirika.com\/wp\/wp-json\/wp\/v2\/pages\/16420"}],"wp:attachment":[{"href":"https:\/\/www.pirika.com\/wp\/wp-json\/wp\/v2\/media?parent=24447"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}