2b:null 2c:["$","title",null,{"children":"Colour, Copyright and Printing. | wolfiex | Observable"}] 31:T470, 32:[{"id":"c13d9f857a682f79866d645d9b897bca724306f10f9be8163f151c242eb47b872c1f3d240effb38107fe7dbe2007a5fc76d1ecebbd9d260e8df849428fb90d55","href":"https://static.observableusercontent.com/files/c13d9f857a682f79866d645d9b897bca724306f10f9be8163f151c242eb47b872c1f3d240effb38107fe7dbe2007a5fc76d1ecebbd9d260e8df849428fb90d55","name":"Screenshot 2026-01-07 at 21.47.07.png","type":"image/png","lastModified":1767822434712.977,"size":223471},{"id":"6979963b8bb241c2671109e5eed76bff438c40a6483a102c04184c751c9e0665f78bfee01e4e9310989c95d159f0fc20a21254dc0dece187e8cf77c6c99edde6","href":"https://static.observableusercontent.com/files/6979963b8bb241c2671109e5eed76bff438c40a6483a102c04184c751c9e0665f78bfee01e4e9310989c95d159f0fc20a21254dc0dece187e8cf77c6c99edde6","name":"Screenshot 2026-01-07 at 21.22.19.png","type":"image/png","lastModified":1767820948063.048,"size":177531}] 2f:{"id":"5b070c67d6a26cc2","slug":null,"title":"Colour, Copyright and Printing.","thumbnail":"d8c776e4251c49ae33b723dd956e878df73f90600deb2199ec65b27af0a4f1cd","access_level":"public","create_time":"$D2026-01-07T21:21:16.347Z","update_time":"$D2026-01-07T22:24:17.328Z","view_time":null,"first_public_time":"$D2026-01-07T21:22:58.385Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"5ac3a182adb31463","login":"wolfiex","name":"","avatar_url":"https://avatars-next.observableusercontent.com/920ad9da2e8dc46272a1a9d71eb3bddb5e1daea20ee8a2ee301b59af578ad9af","tier":"starter_2024"},"version":99,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"3e68e1c0f733af7c","login":"wolfiex","name":"","avatar_url":"https://avatars-next.observableusercontent.com/920ad9da2e8dc46272a1a9d71eb3bddb5e1daea20ee8a2ee301b59af578ad9af","tier":null}],"members":[{"type":"individual","id":"3e68e1c0f733af7c","login":"wolfiex","name":"","avatar_url":"https://avatars-next.observableusercontent.com/920ad9da2e8dc46272a1a9d71eb3bddb5e1daea20ee8a2ee301b59af578ad9af","tier":null,"role":"editor"},{"type":"team","id":"5ac3a182adb31463","login":"wolfiex","name":"","avatar_url":"https://avatars-next.observableusercontent.com/920ad9da2e8dc46272a1a9d71eb3bddb5e1daea20ee8a2ee301b59af578ad9af","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Colour, Copyright and Printing.","cells":[{"id":0,"value":"# Colour, Copyright and Printing. \nIf you need a figure to appear in colour on screen and gray in print, or in our case the other way around you can use the media print css styling for you svg code. Using this the `@media print` CSS property allows us to manipulate the figure and make it prettier when printing. \n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":5,"value":"\n","pinned":true,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":60,"value":"## Printing\nPressing CTRL+P or CMD+P to print will then produce the following print dialogue with the saturation returned to 1. ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":7,"value":"{\n const img = await FileAttachment(\n \"Screenshot 2026-01-07 at 21.22.19.png\"\n ).image();\n img.style.width = \"700px\";\n // console.warn(img);\n return img;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"# Protecting content with a printable watermark\n\nIt is also possible to add a watermark on your image which only becomes apparent when printing. ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":10,"value":"$31","pinned":true,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":28,"value":"This will render the following image when printed. ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":25,"value":"screenshot20260107At214707 = FileAttachment(\n \"Screenshot 2026-01-07 at 21.47.07.png\"\n).image()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":65,"value":"Alternative uses for this would be to add the extraction timestamp of a dataset should someone take a copy. Unfortunately this does not work should someone take a screenshot or embeds the image into a pdf - as the CSS property is not invoked. ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":73,"value":"# Working with two styles\nIf we are working with a print and a general version, the simplest way to do this would be to load two different stylesheets depending on what we are after: \n\n```\n\n\n\n```","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":79,"value":"# Copying text and items. \nFinally we can change what is copyable, for instance if we try to copy text, we can use javascript to change the contents. ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":83,"value":"\n

Try to copy this text

\n\n\n","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":91,"value":"{\n const whencopied = function (e) {\n e.preventDefault();\n\n const selection = window.getSelection().toString();\n\n // e.clipboardData.setData(\"text/plain\", selection + \"\\n\\n© danielellisresearch.com\");\n e.clipboardData.setData(\n \"text/plain\",\n \"Copying denied:\\n\\n© danielellisresearch.com\"\n );\n };\n\n document.addEventListener(\"copy\", whencopied);\n\n document.querySelector(\"#test\").addEventListener(\"copy\", whencopied);\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":85,"value":"This will copy the following text instead: \n\n```\nCopying denied:\n\n© danielellisresearch.com\n```","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"}],"files":"$W32","stdlib":"1","titling":"auto"}} 30:"$2f:body"