I've never worked with Bokeh before, so apologies if this question doesn't make sense. I have a plot that someone else generated using Bokeh and it has a huge JSON object (docs_json) that is all on the same line. I need to import this plot into a WordPress site which has a line length limit. Is there any way I can get Bokeh to generate that JSON in a prettified form rather than squishing the whole thing onto one line?
I'm in a situation where I'm working with 100s of plots being generated continuously, so I'd prefer not to have to manually touch each plot after it is generated.
Yes, the simplest way is to use the BOKEH_PRETTY environment variable when running any Bokeh code, e.g.
BOKEH_PRETTY=true python iris.py
Results in HTML output with embedded JSON that looks like:
<script type="application/json" id="4074acb8-0b70-4591-8d43-99873a9e1bc4">
{
"9d745210-1f6a-4c22-b8ca-c3d2b3829a8f": {
"roots": {
"references": [
{
"attributes": {
"bottom_units": "screen",
"fill_alpha": {
"value": 0.5
},
...
],
"root_ids": [
"ce2c1a38-e3e5-4155-9a80-6860dc284dbc"
]
},
"title": "Bokeh Application",
"version": "0.12.15dev1"
}
}
</script>
All of Bokeh's settings and their associated environment variables are documented in the reference guide:
https://docs.bokeh.org/en/latest/docs/reference/settings.html
Related
With Symfony UX, in order to assure that a custom chart could be rendered, I started with the sample from documentation. The rendered page is effectively blank. In the browser's console is this string:
<canvas data-controller="symfony--ux-chartjs--chart" data-symfony--ux-chartjs--chart-view-value="{"type":"line","data":{"labels":["January","February","March","April","May","June","July"],"datasets":[{"label":"My First dataset","backgroundColor":"rgb(255, 99, 132)","borderColor":"rgb(255, 99, 132)","data":[0,10,5,2,20,30,45]}]},"options":{"scales":{"y":{"suggestedMin":0,"suggestedMax":10}}}}"></canvas>
I interpreted that string to mean that the rendering process got as far as chart.js. But what later step(s) could prevent the chart from being fully rendered? Earlier step(s)?
assets\controllers.json:
{
"controllers": {
"#symfony/ux-chartjs": {
"chart": {
"enabled": true,
"fetch": "eager"
}
}
},
"entrypoints": []
}
package.json includes:
"devDependencies": {
...
"#symfony/ux-chartjs": "file:vendor/symfony/ux-chartjs/assets",
...
"chart.js": "^3.4.1",
...
}
../node_modules/chart.js/dist/chart.js: Chart.js v3.9.1
Thankfully(?), there are no discussions of Chart.js at the Mozilla forums. Applying the principle of pressing buttons until things change, I learned that the ad blocker I use was preventing the chart from being rendered. Why That, Firefox?
Problem
I am currently create a React web app and I am creating my own components that also have their own CSS files. Currently I have to create a matching CSS file everytime I create a component. I was hoping for something sort of how like when you create a project in Visual Studio is will create a .aspx page as well as a .cs file along with it.
My current structure is ../src/components/DashNav.js and the matching stylesheet would be ../src/styles/components/DashNav.scss
Question
Does anyone know if there is a way to trigger a creation of a new file each time a js file is created?
If not, is there any extensions that anyone would recommend? I have already seen VSCODE Create File Folder but that doesn't do me really any good since I can just do this in the terminal.
Folder Templates is the extension that I'm using for this right now. Here is how I've set up my folder structure and and file templates in settings.json
"folderTemplates.structures": [
{
"name": "My Custom Template",
"omitParentDirectory": true,
"structure": [
{
"fileName": "<FTName>.js",
"template": "React Functional Component"
},
{
"fileName": "<FTName>.module.css",
"template": "CSS Module"
}
]
}
],
"folderTemplates.fileTemplates": {
"React Functional Component": [
"import styles from '<FTName>.module.css';",
"",
"export const <FTName> = (props) => {",
" return <div></div>;",
"};"
],
"CSS Module": ".<FTName | lowercase> {}"
}
I'm trying generate multiple css files with webpack for a white labeled application.
I want to run the webpack css/sass loaders one time for each 'brand' and output it in to a separate file. I want to do this as I have a separate variable file for each brand and would want the sass to compile one css file for each brand.
I think I can do this with grunt/gulp, but I wanted to avoid including them in this project.
I've been working on this exact problem lately. I found the i18n example config to be illustrative of how it's possible to do this. Basically the webpack config can be an array. You could do something like this.
import webpack from 'webpack';
export default [
{
entry: {
'brand-1': ['path/to/vars-1.scss', 'path/to/my.scss'],
}
// ...
},
{
entry: {
'brand-2': ['path/to/vars-2.scss', 'path/to/my.scss'],
}
// ...
},
];
Obviously you could generate the list, but I wrote it out for clarity. Our SCSS variables are dynamic, so I wrote a script that creates the webpack config and then injects the variables using the sassLoader.data option.
You may also want to use webpack-merge in order to separate the configs.
const common = {
module: {
loaders: {
// ...
},
},
};
export default BRANDS.map((brand) => (
merge(
common,
{
entry: {
[brand.name]: [brand.variableFile, 'path/to/my.scss'],
},
// If you needed something like this.
plugins: [
webpack.DefinePlugin({
BRAND_NAME: brand.name,
}),
],
},
)
));
I'm using the ExtractTextPlugin, and I instantiate one for each brand. I'm not sure if that's the correct thing to do.
I also have not figured out how this interacts with the CommonChunksPlugin, but I hope I can work something out.
If I were to change user/site dashboard preset(s), is it possible to effect the change(s) to already created users in alfresco?
See this Share webscript : /components/dashboard/customise-dashboard
I use this script a long time ago, so I don't remind very well the parameters needed... but there is a property in the object parameter you must avoid...
EDIT : execute script /components/dashboard/customise-dashboard with POST method
Here an example of the request body :
{
"dashboardPage": "site/site1/dashboard",
"templateId": "dashboard-2-columns-wide-right",
"dashlets": [
{
"url": "/components/dashlets/site-links",
"regionId": "component-1-1",
"originalRegionId": "component-1-1"
},
{
"url": "/components/dashlets/calendar",
"regionId": "component-1-2",
"originalRegionId": "component-1-2"
},
{
"url": "/components/dashlets/wiki",
"regionId": "component-1-3",
"originalRegionId": "component-2-3"
},
{
"url": "/components/dashlets/docsummary",
"regionId": "component-2-1",
"originalRegionId": "component-2-1"
},
{
"url": "/components/dashlets/activityfeed",
"regionId": "component-2-2",
"originalRegionId": "component-2-2"
}
]
}
This I have only tried out in 4.2.c.
I navigated to the surf-config/components directory in the explorer (Very well hidden so use the left explorer pane) and manually deleted the xml configs for users. (Or run a javascript script from javascript console which does the same thing), afterwards I used the surf console tool to refresh all components and it worked.
I have installed Zen Coding for Sublime Text 2. It works while expanding abbreviations outside of the tags, but it does not inside those script tags (which makes sense since js is expected there). However, it would be useful while editing Handlebars templates.
Does anyone know, how to configure/modify Zen Coding ST2 plugin to achieve this?
Thanks
The command it's now called expand_abbreviation_by_tab (I'm using Sublime Text 3).
In order to use Emmet inside the embedded js (the x-handlebars script scope) just paste this command inside your keymap file Key Bindings — User:
{
"keys": [
"tab"
],
"command": "expand_abbreviation_by_tab",
"context": [
{
"operand": "source.js.embedded.html",
"operator": "equal",
"match_all": true,
"key": "selector"
}
]
}
Add whichever scope you need Emmet to work as a value of the operand key.
Best of all you don't need to restart Sublime. It start working right away!
In ./ZenCoding/Default.sublime-keymap there is a set of context scope selectors that define what actions are active when editing different portions of the file. These are the same scope selectors that TextMate uses.
The default scope for the expand_zen_abbreviation_on_tab command (at the time of writing this it's the last entry in the file) does not include a selector for <script> tags. We need to add it.
In order to find the correct scope, place your cursor somewhere in a ST2 document and hit ctrl+shift+p. The status bar will show you the selectors for the region you're in. In the case of a script tag saved in a .html file, it returns:
text.html.basic source.js.embedded.html
Given this information, we add the source.js.embedded.html entry to the operand property of the expand_zen_abbreviation_on_tab command and voilà, zen coding will work inside script tags.
Here is my expand_zen_abbreviation_on_tab with the context added...
{"command": "expand_zen_abbreviation_on_tab",
"context": [{"key": "selector",
"match_all": true,
"operand": "source.css - source.css.embedded, text.xml, text.html -source -meta.tag, meta.scope.between-tag-pair.html -source, source.js.embedded.html",
"operator": "equal"},
{"key": "selection_empty",
"match_all": true,
"operand": true,
"operator": "equal"},
{"key": "is_zen", "match_all": true}],
"keys": ["tab"]}]
at line 31 of “zencoding/zen_settings.py” change 'filters': 'html,css', to 'filters': 'html,css,hbs' can also add other file types here as well such as erb if you are using rails.