31:T969,viewof plot = { const scaleOptions = {grid: true, type:'log', tickSize: 0, ticks: 5 } const markOptions = {x: 'downloads', y: 'releases'} const colors = {stroke: "#788182", annotation: "#bac1c2", highlight: "#f7bd6f", selection: "#ffb726", background: "#fcfdff", tip: '#7c3aed', lightTip: '#fafafc'} const plot = Plot.plot({ height: side, width: side, marginRight: 70, marginTop: 50, marginLeft: 0, style: { color: colors.stroke, background: colors.background, }, y: { ...scaleOptions, axis: 'right', labelOffset: 40, label: '↑ releases' }, x: { ...scaleOptions, labelAnchor: 'left', label: "downloads →" }, color: { legend: false, scheme: 'PuBuGn', reverse: true, type: 'log' }, marks: [ Plot.dot(data, { ...markOptions, fill: 'updatedAgo', fillOpacity: 'updatedOpacity', stroke: "#788182", strokeWidth: .5, strokeOpacity: 'updatedOpacity' }), Plot.dot(data, Plot.pointer({ ...markOptions, stroke: colors.tip, r: 5, strokeWidth: 4, strokeOpacity: .9 })), Plot.tip(data, Plot.pointer({ ...markOptions, anchor: 'bottom', frameAnchor: 'bottom', fontWeight: 'bold', stroke: colors.tip, fill: colors.lightTip, strokeWidth: 1, title: (d) => d.name })), Plot.dot(pluginFilter, { ...markOptions, fill: null, stroke: colors.highlight, strokeWidth: 15, strokeOpacity: .35 }), Plot.text(['niche & crafty'],{ frameAnchor: 'top-left', textAnchor: 'start', dx: 50, dy: 50, fill: colors.annotation, stroke: 'white' }), Plot.text(['popular & discontinued'],{ frameAnchor: 'bottom-right', textAnchor: 'end', dx: -50, dy: -50, fill: colors.annotation, stroke: 'white' }), ] }) const plotLegend = plot.legend("color", { label: "when was the last release", width: width < 600 ? width : side, tickFormat: d => d > 2 ? `${d} days ago` : '', ticks: [10, 100, 1000], style: { color: "#788182" }, }) set(viewof legend, html`

${plotLegend}

`) return plot }32:T156b,obsidian = svg` `33:Ta32,displayPlugin = (plugin) => { const colors = { text: "#2e3338", background: "#fcfdff", statsBackground: "#e6e6ed", statsText: "#8c849c", glow: "#7c3aed", lightGlow: '#fafafc' } const blockWidth = width < 600 ? width + "px" : (side * .96) + "px" const style = ` ` const elements = (plugin) => { if (plugin) { return `

${plugin.description}

by ${plugin.author}

${plugin.releases} releases ${plugin.downloads} downloads last updated on ${d3.timeFormat('%B %-d, %Y')(plugin.updated)}

`} else { return html`

${obsidian}

` } } return html` ${style} ${elements(plugin)} ` }34:[] 2f:{"title":"State of obsidian plugins","cells":[{"id":0,"value":"# State of obsidian plugins","pinned":false,"hidden":false,"mode":"md"},{"id":566,"value":"md`**Source**: [official plugin list](https://github.com/obsidianmd/obsidian-releases)`","pinned":false,"hidden":false,"mode":"ojs"},{"id":505,"value":"viewof pluginFilter = Inputs.search(data, {\n required: false,\n format: d => '',\n placeholder: 'Search plugins',\n columns: ['name', 'description']\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":337,"value":"displayPlugin(plot)","pinned":false,"hidden":false,"mode":"ojs"},{"id":264,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":790,"value":"legend","pinned":false,"hidden":false,"mode":"ojs"},{"id":564,"value":"---","pinned":false,"hidden":false,"mode":"md"},{"id":733,"value":"*dependencies*","pinned":false,"hidden":false,"mode":"md"},{"id":735,"value":"*data*","pinned":false,"hidden":false,"mode":"md"},{"id":789,"value":"data = {\n const urls = ({\n descriptions: 'https://raw.githubusercontent.com/obsidianmd/obsidian-releases/HEAD/community-plugins.json',\n stats: 'https://raw.githubusercontent.com/obsidianmd/obsidian-releases/HEAD/community-plugin-stats.json'\n });\n const today = new Date();\n const stats = await d3.json(urls.stats);\n let descriptions = await d3.json(urls.descriptions);\n const stats_plugins = Object.keys(stats)\n // Filter only plugins with available stats\n descriptions = descriptions.filter(r => stats_plugins.includes(r.id))\n return descriptions.map(r => ({\n ...r,\n downloads: stats[r.id].downloads,\n updated: new Date(stats[r.id].updated),\n updatedAgo: parseInt((today - stats[r.id].updated) / (1000 * 60 * 60 * 24)), // how many days ago?\n updatedOpacity: today - (1000 * 60 * 60 * 24) * 182 < stats[r.id].updated ? .8 : .3, // more opaque if older than 6 months \n releases: Object.keys(stats[r.id]).length - 2,\n }))}","pinned":false,"hidden":false,"mode":"ojs"},{"id":740,"value":"*the plot*","pinned":false,"hidden":false,"mode":"md"},{"id":423,"value":"side = 800","pinned":false,"hidden":false,"mode":"ojs"},{"id":323,"value":"function set(input, value) {\n input.value = value;\n input.dispatchEvent(new Event(\"input\", {bubbles: true}));\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":325,"value":"viewof legend = {\n const element = htl.html`

`;\n element.value = md``;\n return element\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":742,"value":"*the plugin card*","pinned":false,"hidden":false,"mode":"md"},{"id":551,"value":"html`\n \n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":620,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":335,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":727,"value":"---","pinned":false,"hidden":false,"mode":"md"}],"files":"$W34","stdlib":"1","titling":"auto"}