Everytime I tried exporting it to Image it gives me an error while exporting it to PDF returns blank page.
Here is my sample of GetOrgChart
http://mlm-ads-success.000webhostapp.com/kirk.html
This question has been answered before - Print is not working in orgchart.
So you just need to add additional surrounding DIV like this:
<div id="container">
<div id="people"></div>
</div>
Then the chart will print e.g. the part that is in the web browser view. Usually for larger charts this means enabling and exporting to PNG will be better alternative.
Related
I have this html and want to select only the div with class 'image-container landscape'.
<div class="image-container landscape">
...
</div>
...
<div class="image-container portrait">
...
</div>
Using $(element).find('.image-container') selects either one of the div, that comes first. But I only want the one with 'landscape'. I tried using $(element).find('.image-container landscape') but it doesn't work, maybe because it assumes landscape is a tag. How do I do this?
Yes, it would assume landscape was a tag.
You want either:
[class="image-container landscape"]
or
.image-container.landscape
This is just CSS3 for the record, you can probably read the full specs in less than an hour.
My goal is to create an input like the one described as being 'outline variant' in these Material docs.
How do I configure and/or what CSS should I add to materialize CSS forms to use the 'outline' variant?
There appears to be a few issues/requests for this outline variant, but the Materialize folks have indicated that it wasn't part of the spec at the time and have subsequently closed the issues.
I dug through some of the Material samples versus styling on the Materialize framework and noticed that they are handling things slightly different as far as padding, borders/shadows etc.
Achieving this outline variant as the default treatment is going to require some slightly destructive style updates that should probably be handled via the preprocessed files, but here is an example of some quick and dirty overrides
Note the addon class "input-outlined" in the markup:
<div class="col input-field input-outlined s6">
<input placeholder="Placeholder" id="first_name" type="text" class="validate">
<label for="first_name">First Name</label>
</div>
As far as I can tell, they're related but not the same project and do not use the same CSS files. I was using a CDN link for Materialize for a little while and none of the Material.io classes were taking effect.
Then I switched over to using the suggested Material.io CDN links, found here: https://material.io/develop/web/docs/getting-started/
Once I did that, I could use the HTML markup and class names that became visible on the page you provided after I clicked the "Web" tab.
It works. Here is a Codepen showing both styles of text inputs in action (this Codepen is using the Material.io CDN links in the settings).
The main difference between filled and outlined is that filled looks to be the default. I'm inferring that the Material.io design system has you repeat the classname and append a modifier if you wish to deviate from the default.
For instance, in the linked codepen, notice that the filled (default) text field is inside <div class="mdc-text-field"> while the outlined text field is inside <div class="mdc-text-field mdc-text-field--outlined"></div>.
I am using your dc js in node js for rendering dc chart via server but i am facing many problems.
First I found all result of the svg in variable, but i want to know how to render chart in web browser.
When i write that SVG tags to file like "index.html" trying to run that file to browser, Chart is displayed but filter is not wroking
How we can use dc.js with node.js in browser?
I have tried many ways to get result, but i am not successed. If you have any tutorial or any guid Please let me know
I have not experimented with using dc.js on the server side with node, but you should be able to write the svg tag into an html document.
For example, if you browse the DOM of a live site like http://dc-js.github.io/dc.js/ in the DOM, using the Elements tab of Chrome's Developer Tools, you'll see something like this:
<div class="row">
<div id="yearly-bubble-chart" class="dc-chart">
<strong>Yearly Performance</strong> (radius: fluctuation/index ratio, color: gain/loss)
<a class="reset" href="javascript:yearlyBubbleChart.filterAll();dc.redrawAll();" style="display: none;">reset</a>
<div class="clearfix"></div>
<svg width="990" height="250"><g>
...
Note: I don't think you can get the interactive features of dc.js using it this way.
Is there a way how to adjust HTML generated by xPage from document rich text field? I have q document from which the rich text field content is displayed on xPage using computed text control. Solution works nice except, that xPages engine generates strange HTML from the rich text field. When displaying page on web using standard form, all texts written by default font and default size doesn't contain markup arround so on could use CSS to style it. Not this way in xPages. Everything have tag around and its not funny seeing generated font tag around the div tag :-(
<div class="tcl-columns3-in">
<font size="2" face="sans-serif"></font>
<font size="2" face="sans-serif">
<b>Header text ...</b>
</font>
<font size="2" face="sans-serif">
<div class="tcl-box-outlined">
text ...<br>
</div>
</font>
</div>
Is there a way how to get rid of out of generated HTML?. I looked to html filtering option with ASF filter but it requires to adjust settings on filesystem, which not option for me ...
There are a number of steps you narrow down your problem. RichText -> MIME -> RichText is not a problem free relationship. As Carl pointed out, you can have a look at the raw RichText -> Mime conversion result. Does that look OK? Then you could use a Dijit ContentPane to pull that content in.
It also depends on what control you use to display the content. You might have different success with textbox and RichText editor. If you look for very high fidelity you either store your RT as mime (a property of a RT field) or use Coex Edit a commercial server plug-in
use a computedField in your Xapge, and set the value to something like this
var rt = document1.getDocument().getFirstItem("Body");
return rt.getUnformattedText()
using this technique you can also format the content the way you like as it is all text. I use this to display colored and formatted json and xml
So I load some simple HTML into a webview.
The html is in the format: (it is extracted html, therefore no body tags.
<p>..blah</p>
<div style="text-align:center;">
<a href="http://services.runescape.com/m=rswikiimages/en/2012/5/combat1-18140712.jpg" target="_blank">
<img src="http://services.runescape.com/m=rswikiimages/en/2012/5/combat1_thumb-18140804.jpg"></a></div>
<p>..blah</p>
In the webview activity class I add:
webInfo = "<body style=\"color:white;font-size:15px\">" + webInfo + "</body>";
//for setting the size and color of the text
I use the following to load the html:
webview.loadDataWithBaseURL(null,webInfo,"text/html","UTF-8",null);
// webInfo is an html string
and I do the following so that it doesn't scroll horizontally and so that the image fits within the screen.
webview.getSettings().setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN);|
If I don't use SINGLE_COLUMN, I'm always scrolling horizontally, even though the text fits nicely within the page. I thought it had finally solved the problem but I get overlapping html when i load it. This fixes itself if I zoom slightly in or out with my fingers.
Here's a picture of whats happening:
Question 1:
How do I fix that problem and display the image so it fits in the screen and no horizontal scrolling is required?
Question 2:
I've also been having trouble getting rid of the weird symbols too, my 's show up really weird.Tried using several different encodings like UTF-8, US-ACSII and lots of Windows ones, none of them seem to work to get rid of the symbols.
I hope I've been clear, any help is appreciated, I've been fiddling with this for a while O_O...
Add in webview settings:
webSettings.setLayoutAlgorithm(LayoutAlgorithm.TEXT_AUTOSIZING) //handle for font overlapping.