2a:null 2b:["$","title",null,{"children":"Custom tooltip to show weather | 廖晓娟 | Observable"}] 30:T6eb,html``31:Tb83,plot = new MultiView('container', { meta: { date: { sync: true }, minTemp: { min: 0, max: 30 }, maxTemp: { min: 0, max: 30 }, values: { min: 0, max: 30 }, }, tooltip: { showMarkers: false, enterable: true, domStyles: { 'g2-tooltip': { width: '200px', padding: 0, }, }, customContent: (title, items) => { const data = items[0]?.data || {}; const titleDom = ``; const tempDom = ``; const windDom = ``; let domClass; if (data.rain === true) { domClass = 'rain'; } else if (data.sunny === true) { domClass = 'sun'; } else { domClass = 'cloud'; } return `

${titleDom}${tempDom}${windDom}

`; }, }, views: [ { data: data.map((d) => { return { ...d, values: [d.minTemp, d.maxTemp] }; }), meta: { date: { sync: true }, minTemp: { min: 0, max: 30 }, maxTemp: { min: 0, max: 30 }, values: { min: 0, max: 30 }, }, axes: { date: {}, minTemp: false, maxTemp: false, values: { position: 'left', }, }, interactions: [{ type: 'active-region' }], geometries: [ { type: 'interval', xField: 'date', yField: 'values', mapping: { size: 4, style: { fill: '#EBEDF0' }, }, }, { type: 'point', xField: 'date', yField: 'minTemp', colorField: 'maxTemp', mapping: { style: { r: 5 }, shape: 'circle', color: ['#6ab7da', '#806bd9', '#da6bcc'], }, }, { type: 'point', xField: 'date', yField: 'maxTemp', colorField: 'maxTemp', mapping: { size: 5, shape: 'circle', color: ['#6ab7da', '#806bd9', '#da6bcc'], }, }, ], }, ], })32:[{"id":"aa153001916d0db1938deddc521ccebe528a45bf6c3610732d6fb9265ff3293dbf723f2950a7a2fac3a11d0c53c86e6a0c2668aa493a4f9414dc14bb1debd353","href":"https://static.observableusercontent.com/files/aa153001916d0db1938deddc521ccebe528a45bf6c3610732d6fb9265ff3293dbf723f2950a7a2fac3a11d0c53c86e6a0c2668aa493a4f9414dc14bb1debd353","name":"range-data.json","type":"application/json","lastModified":1619955309526.664,"size":4646}] 2e:{"id":"1eefbd5f13900c04","slug":"custom-tooltip-to-show-weather","title":"Custom tooltip to show weather","thumbnail":"542f0ee30995e9ef3f908db8bb7c24eb9b2e1d00f77e033cd4d08fa51544732c","access_level":"public","create_time":"$D2021-05-02T11:32:06.660Z","update_time":"$D2021-05-02T13:34:57.359Z","view_time":null,"first_public_time":"$D2021-05-02T11:41:37.827Z","fork":false,"stars":9,"starred":false,"owner":{"type":"team","id":"43eb0216033f303e","login":"visiky","name":"廖晓娟","avatar_url":"https://avatars-next.observableusercontent.com/f525ef0af81c7728535c96eda2de2ea96c17ff10563acfdf254c6b5f3fd1c7b4","tier":"starter_2024"},"version":40,"publish_version":40,"role":null,"authored":false,"authors":[{"type":"individual","id":"6c057a398a73f6b0","login":"visiky","name":"廖晓娟","avatar_url":"https://avatars-next.observableusercontent.com/f525ef0af81c7728535c96eda2de2ea96c17ff10563acfdf254c6b5f3fd1c7b4","tier":null}],"members":[{"type":"individual","id":"6c057a398a73f6b0","login":"visiky","name":"廖晓娟","avatar_url":"https://avatars-next.observableusercontent.com/f525ef0af81c7728535c96eda2de2ea96c17ff10563acfdf254c6b5f3fd1c7b4","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":true,"trashed":false,"subscribed":null,"forks":4,"collection":{"id":"9da9749f29a75950","slug":"g2plot","title":"Visualization of G2/G2Plot","owner":{"id":"43eb0216033f303e","login":"visiky","name":"廖晓娟"}},"type":"notebook","body":{"title":"Custom tooltip to show weather","cells":[{"id":0,"value":"md`# Custom tooltip to show weather`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2,"value":"html`

`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":38,"value":"$30","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":10,"value":"MultiView = G2Plot.MultiView;","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":27,"value":"$31","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":25,"value":"data = FileAttachment(\"range-data.json\").json()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":33,"value":"plot.render()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":5,"value":"G2Plot = require('@antv/g2plot')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"}],"files":"$W32","stdlib":"1","titling":"auto"}} 2f:"$2e:body"