3f:null 40:["$","title",null,{"children":"Plot Legend Position | brightxml | Observable"}] 46:[] 44:{"id":"c437f7c546f2531f","slug":"plot-legend-position","title":"Plot Legend Position","thumbnail":"36d06a6a0228b9f88ce5b555c5ec1fa1bcef21b9c15e5c30e5f34105bd54e8f9","access_level":"public","create_time":"$D2026-09-22T02:43:56.542Z","update_time":"$D2026-09-22T04:49:28.017Z","view_time":null,"first_public_time":"$D2026-09-22T05:11:47.778Z","has_unpublished_edits":null,"fork":false,"stars":1,"starred":false,"owner":{"type":"team","id":"868bf1d0c7297704","login":"brightxml","name":"","avatar_url":"https://avatars-next.observableusercontent.com/e90b76e29e9ca325f38541919540de2d8eb5b7e1321ab930656d31ede45a9882","tier":"starter_2024","bio":"","following":false},"version":205,"publish_version":205,"role":null,"authored":false,"authors":[{"type":"individual","id":"9d39a6f2f92c6b87","login":"brightxml","name":"","avatar_url":"https://avatars-next.observableusercontent.com/e90b76e29e9ca325f38541919540de2d8eb5b7e1321ab930656d31ede45a9882","tier":null,"bio":"","following":false}],"members":[{"type":"team","id":"868bf1d0c7297704","login":"brightxml","name":"","avatar_url":"https://avatars-next.observableusercontent.com/e90b76e29e9ca325f38541919540de2d8eb5b7e1321ab930656d31ede45a9882","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Plot Legend Position","cells":[{"id":1,"value":"# Plot Legend Position","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":19,"value":"# default","pinned":true,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"Plot.lineY(aapl, {x: \"Date\", y: \"Close\", z:null,stroke: \"Close\"}).plot({y: {grid: true},color:{legend:true}})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"# bottom center","pinned":true,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2,"value":"{\n const chart = Plot.plot({\n marks:[\n Plot.lineY(aapl,{x:'Date',y:'Close',z:null,stroke:'Close'})\n ]\n });\n\n const legend = Plot.legend({color: {type:\"sequential\",scheme: \"RdBu\"}});\n\n return html`

\n ${chart}\n ${legend}\n

`;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":21,"value":"# top left","pinned":true,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":17,"value":"{\n const chart = Plot.plot({\n marks: [\n Plot.lineY(aapl, { x: 'Date', y: 'Close',z:null,stroke:'Close'})\n ],\n color: { type: \"sequential\", scheme: \"RdBu\", legend: false } // 关闭内置图例，防止双图例\n });\n const legend = Plot.legend({ color: { type: \"sequential\", scheme: \"RdBu\" } });\n\n return html`\n

\n \n

\n ${legend}\n

\n ${chart}\n

\n `;\n}\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":23,"value":"# top center","pinned":true,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":15,"value":"{\n const chart = Plot.plot({\n marks:[\n Plot.lineY(aapl,{x:'Date',y:'Close',z:null,stroke:'Close'})\n ]\n });\n\n const legend = Plot.legend({color: {type:\"sequential\",scheme: \"RdBu\"}});\n\n return html`

\n ${legend}\n ${chart}\n

`;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":24,"value":"","pinned":true,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":16,"value":"{\n const chart = Plot.plot({\n marks: [\n Plot.lineY(aapl, { x: 'Date', y: 'Close',z:null,stroke:'Close'})\n ],\n color: { type: \"sequential\", scheme: \"RdBu\", legend: false } // 关闭内置图例，防止双图例\n });\n const legend = Plot.legend({ color: { type: \"sequential\", scheme: \"RdBu\" } });\n\n return html`\n

\n \n

\n ${legend}\n

\n ${chart}\n

\n `;\n}\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"# right","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"{\n const chart = Plot.plot({\n marks:[\n Plot.lineY(aapl,{x:'Date',y:'Close',z:null,stroke:'Close'})\n ],\n color: {legend: false}\n });\n const legend = Plot.legend({\n color: {type:\"linear\"}\n });\nreturn html`\n

\n ${chart}\n

${legend}

\n`;\n}\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":27,"value":"# symbol legend","pinned":true,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":26,"value":"{\n const chart = Plot.plot({\n grid: true,\n x: {label: \"Body mass (g)\"},\n y: {label: \"Flipper length (mm)\"},\n symbol: {legend: false},\n marks: [\n Plot.dot(penguins, {x: \"body_mass_g\", y: \"flipper_length_mm\", stroke: \"species\"})\n ]\n })\n const legend = Plot.legend({columns: \"1\",\n color: {type:\"categorical\",domain:new Set(penguins.map(d=>d.species))},\n symbol:{domain:new Set(penguins.map(d=>d.species))}\n });\nreturn html`\n

\n ${chart}\n ${legend}\n