I'm using Konva in a Vue application, and I can't suppress Konva's warnings in browser console.
According to Konva docs, there is an option for this, Konva.showWarnings = false. (I understood the warning itself and am aware of its possible implications).
I've checked this: Turn off Konvajs warnings, but to no avail, the answer here just explains that such a setting exists.
What I'm doing in my main.js file:
import VueKonva from 'vue-konva'
Vue.use(VueKonva)
and then I'm trying to apply the setting:
VueKonva.showWarnings = false
I've also tried adding it inside Vue.use as option:
Vue.use(VueKonva, {showWarnings: false})
...but to no avail.
What am I missing here?
You should do the same:
import Konva from 'konva';
Konva.showWarnings = false;
Are you sure you want to disable them?
edited: as the final solution to the problem, I'm adding #lavrton's comment from below:
For the showWarnings property to work in vue-konva, you need to import both the original konva library, and the vue one for vue-bindings.
The working code now looks like this:
import VueKonva from "vue-konva";
import Konva from "konva";
Konva.showWarnings = false;
Vue.use(VueKonva);
Vue.use(Konva);
Related
I am currently using jupyter-manim since it is the most efficient way for me to use manim. I'm running my code on Kaggle and every time I use TextMobject in manim, it outputs an error that says Latex error converting to dvi. See log output above or the log file: media/Tex/54dfbfee288272f0.log. I've tried TexMobject and Text function, but only the Text function works. The Text function is limited however, and I'm not sure how to change the font. Is there a way to fix this or is it something that comes with using jupyter-manim? It seems that all the other functions work such as drawing shapes, animating scenes, etc.
%%manim
class Text(Scene):
def construct(self):
first_line = TextMobject('Hi')
second_line = TexMobject('Hi')
#Only one that works
third_line = Text('Hi')
I tried your Manim program and it worked as expected for me. I would try making sure
include from manimlib.imports import * in your first line (importing Manim library)
include self.play(...) so you can see them
I think you already have these, but I'm putting them in case you don't.
You may also be getting the error because you do not have a LaTeX distribution installed on your system (i.e. MikTex or Texlive).
I think part of your problem may be the name of the class you chose. I had problems with your code until I changed the name from Text to TextTest. Here is a minimally working example that works fine in my Jupyter notebook (after running import jupyter_manim of course).
%%manim TextTest -p -ql
from manim import *
class TextTest(Scene):
def construct(self):
first_line = TextMobject('Hi 1')
second_line = TexMobject('Hi 2').shift(DOWN)
third_line = Text('Hi 3').shift(UP)
self.add(first_line)
self.add(second_line)
self.add(third_line)
self.wait(1)
Also, you should be aware that TextMobject and TexMobject have been deprecated.
Another learning project in the works... I am trying to use paperjs in an electron app.
According to the instructions, I think I should be using paper-jsdom (please correct me if I'm wrong). BTW, I am using TypeScript if that makes a difference. I have an HTML document with nothing but an empty <canvas> and a <script> tag referencing this:
import paper, {Color, Point, Path} from 'paper-jsdom'
window.onload = (): void => {
let canvas = document.getElementById("workspace") as HTMLCanvasElement;
paper.setup(canvas);
let path = new Path();
path.strokeColor = Color.random();
let start = new Point(100, 100);
path.moveTo(start);
path.lineTo(start.add(new Point(200, -50)));
paper.view.update();
};
So right off the bat I get:
Uncaught TypeError: paper_jsdom_1.Path is not a constructor
Ugh... So I tried a few random things (it's late, I'm tired...) and changing my import to:
import paper from 'paper'
import {Color, Point, Path} from 'paper-jsdom'
works, or at least the code above works.
Am I supposed to be importing some things from 'paper' and others from 'paper-jsdom'? What is the correct way to use paperjs in an electron app?
Unfortunately paper-jsdom doesn't seem to have any type info for TS.
Thanks!!
Since you are using Paper.js in the renderer process of Electron, you are using it in the browser context and not in Node.js context so you should use the common paper package which relies on browser Canvas API (and not paper-jsdom which targets browserless usage).
So you should be able to use Paper.js as you would for a website.
From your code example, I see that you are using TypeScript so you can have a look at this simple quickstart project that I made to play with Paper.js and TypeScript.
It uses this kind of import:
import * as paper from 'paper';
And then access Paper.js classes through the imported paper object:
new paper.Path.Circle({
center : paper.view.center,
radius : 50,
fillColor: 'orange',
});
Edit
Here is a repository showing the simplest way of using Paper.js in an Electron app.
I'm using codemirror latest (v5.49.0). for my electron text editor app, sometimes line numbers are rendered overlapped with the text. cannot reproduce the bug because it doesn't happen always. easily it can reproduce by refreshing the app several times. Anyone have an idea? or may be this is a known issue for you?
I was having this issue as well but what worked for me was this answer from Github.
const Editor = CodeMirror.fromTextArea(element, { lineNumbers: true });
Editor.refresh();
This answer worked for me.
import CodeMirror from 'codemirror';
import htmlembedded from 'codemirror/mode/htmlembedded/htmlembedded';
import js from 'codemirror/mode/javascript/javascript';
import 'codemirror/lib/codemirror.css';
import 'codemirror/addon/display/autorefresh';
// ...
const codeEditor = CodeMirror.fromTextArea(this.$('#isCalculatedValueTextField')[0], {
lineNumbers: true,
autoRefresh:true,
// ...
});
I'm trying to get the react-rails gem (version 2.1) working in my Rails 4.2.4 app. I've gone through the setup steps in the Readme and I'm using webpacker for the js preprocessing. I have a component inside of app/javascript/components/label.js that looks like this:
import React, {PureComponent} from 'react';
import ReactDOM from 'react-dom'
export default class Label extends PureComponent {
render () {
return (
<div>Something rendered in React</div>
)
}
}
And then I reference this in my view with the following line:
= react_component("Label")
As far as I can see from the Readme, this should be all that is necessary in order to render the component (provided the application pack is included in the layout, which it is)
= javascript_pack_tag 'application'
So I'm confused as to why I'm getting the error in my browser that the component is not defined.
Uncaught ReferenceError: Label is not defined
Opening app/javascript/packs/application.js I can see the following:
console.log('Hello World from Webpacker')
// Support component names relative to this directory:
var componentRequireContext = require.context("components", true)
var ReactRailsUJS = require("react_ujs")
ReactRailsUJS.useContext(componentRequireContext)
First I verified that the console log is displayed in the browser (it is). I'm not sure what componentRequireContext does, but if it is relative to the current file, then it seems odd that it points to components and not ../components, but changing this doesn't render the component. However, I can get the component rendering if I add the following line:
window.Label = require('../components/label.js');
I thought the React Rails gem took care of this though, provided the components were saved in the app/javascript/components directory? There's nothing in the Readme that says that I need to explicitly declare and require the component, or am I mistaken?
It looks like you have a capitalization issue. You named the file 'label.js' but you are looking for '= react_component("Label")' So it looks and doesn't find what Label is. Then when you set Label on the window then react is like "Oh ok, Label is actually label.js." and it does stuff. TLDR capitalization matters.
How can import and use any third party javascript libraries in dart..? I want to use snapsvg in my dart application to render svg. But not sure how to add dependencies to add and import it.
I added js: any to my pubspec.yaml and imported packages/browser/interop.js into my html. Where do I place downloaded snapsvg.js and import it to my dart source file to use it.
I am trying to use following javascript code using snapsvg framework from dart.
s = Snap(800, 600);
s.rect(0, 0, 100, 100).attr({
fill: 'white',
stroke: 'black'
});
I tried this code from in dart:
import 'package:js/js.dart' as js;
void main() {
var s = js.context.Snap(800, 600);
s.rect(0, 0, 100, 100);
}
This works fine in dartium, but when I Run as Javascript after build, I got javascript error "method zm not found in object"
I believe this is not right way and I should use be using callMethod on proxy. So I changed code like this
import 'dart:js' show context, JsObject;
void main() {
var snap = context['Snap'];
snap.callMethod('rect', 0,0,100,100);
}
This is not working in Dartium as itself. I would appreciate if someone can provide example of how to call constructor Snap(800, 600) from dart and also rect and attr methods in my example code.
You add them to the HTML file using <script> tags.
You can call JavaScript functions from Dart using dart-js-interop.
There are many examples here on Stackoverflow under this tag - just click on the tag below your question.
When you provide a more concrete example it is easier to help.
You can call into JavaScript with the built-in dart:js library. Please try to avoid using /package/ js, which is what you install by adding js: any to your pubspec. The js package is likely to cause the dart2js output to be bloated and we're probably going to deprecate it at some point.
You can reference JavaScript files like you would in any HTML page, via script tags. You don't actually import them into Dart source, you use dart:js to access JavaScript via its top-level context property.