github svg not rendering at all - svg

I am trying to create a markdown file in github and would like to put a svg image in it. github is not rendering the image at all. I tried with <img />, with ![](). Is simply not working! Anyone has seen this?
Just modified the repository so that is public: https://github.com/michelucci/deepbook
Thanks in advance, Umberto

It seems like GitHub now requires the http query parameters sanitize=true at the end of the SVG string. If you're linking to an image in your repository from a wiki, you may already have parameters at the end of the URL. So either add ?sanitize=true if there are no query parameters, or &sanitize=true otherwise
<img alt="my image" src="https://raw.githubusercontent.com/user/branch/images/myimage.svg?example=foo&sanitize=true>

GitHub's markdown seems to be blocking SVG files, but you can always use bare HTML tags:
<img src="neuron_fig1.svg"/>

Update 2022: a simple drag & drop is enough.
Original answer (2017)
See issue 458 regarding any inline HTML, but since it is not your issue, you can compare your page to this one: it does display a lot of svg pictures, and its source is here.
"source": [
"## Python Objects\n",
"\n",
"We begin with a look at a Python object. In Python, objects are stored in memory blocks independently allocated on the heap. A single floating point value looks something like this:\n",
"\n",
"![Python Float](fig/python_float.svg)\n",
"\n",
"This doesn’t look too bad, in a dynamically typed system we need to store some metadata about the type, and we need to store the data containing the value."
]
},
So relative URL (to docs/intro-01/fig) does work.
Your code:
"source": [
" ![](neuron_fig1.svg) \n",
" **Fig. 1** The structure of a neuron. $x_i$ are the input, $w_i$ are the weights."
]

Related

translate on .ts File on Angular #ngx-translate

I am working on a meteor-Angular project, where I am using #ngx-translate for translation.
Now when it comes to HTML files the translation works perfectly fine with a translation JSON file.
But when it comes to the ts file I do not know how to translate the words. Here is an example -
I have tried a lot how to translate .ts file but somehow I couldn't find a single solution to this problem. Does anyone know how to solve this problem?
you can use the instant method in the component.
https://github.com/ngx-translate/core#methods
this.column : [
{header : this.translate.instant('ACCOUNT_TYPE')},
{header : this.translate.instant('NAME')},
...
]
you can look my answer
for currect working after f5 u need to use appInitializerFactory (don't forgot add it to providers like in answer)
you should translate when sending to HTML whit the pipe.
If the column is a FOR, also for each word use the pipe. ( column[0] | translate)

How to use Modern UI Icons in AppBarButton

I'm developing a Windows 8.1 Store App. I have a CommandBar control with a couple of AppBarButtons inside. Using the standard icons is easy, I just set the icon property to the appropriate string like so :
<AppBarButton Icon="Download" Label="Download Files"/>
I'd like to use a couple of custom icons from the very nice free collection Modern UI Icons. Ideally, I'd like to be able to set the icon property in much the same way :
<AppBarButton Icon="transit.distance.to" Label="Distance to destination"/>
This would refer to this icon : PNG / XAML
Is this possible ?
If not, what are the alternatives ?
Tim Heuer proposes using a font file, although at present the font files available here only cover a sub-set of the icons, and also this code is quite unreadable :
<FontIcon FontFamily="ms-appx:///modernuiicons.ttf#Modern-UI-Icons---Social" Margin="0,2,0,0" Glyph="" FontSize="37.333" />
Would you believe that shows a twitter icon?!
Tim Heuer also proposes using vector data, and one of the commenters explains how the vector data can be rolled into a style. I could do that, but then I would have to copy and paste the path data for each icon I want to include ?
Should I be using the PNG files, as explained in this question ? That looks pretty messy as well.
What a nightmare!
I'm not sure what the nightmare part is -- you want to use a custom icon that isn't present in the 200+ supplied defaults. You have options:
Use SymbolIcon and supply your own font. You note that you don't like that the code feels unreadable. Unicode ranges are universally used for symbol fonts and I agree that Unicode isn't human-readable, but a simple code comment would help ;-) Fonts give you the most ease and flexibility because they are also vectors.
PathIcon. You convert your image into vector geometries we can render. This would be the second best, but also requires a bit fine tuning of the vectors to get right. For people not familiar with working with geometries this can be annoying at first. Blend and Inkscape are helpful tools here.
BitmapIcon. This would allow you to use your PNG, however you now must supply multiple of them for different scales and states. This is my least favorite option as it requires most work, but for some may be the simplest. Now your problem you will hit is there is an issue with BitmapIcon for non-rectangular shapes (which looks like your icon is). This won't have the fidelity you seek due to a bug in rasterizing.
Contact metroicon author and see if he can put it into the font file so you can use option #1 :-)
Maybe this is what you're looking for:
<AppBarButton Label="Transit">
<AppBarButton.Icon>
<PathIcon Data="F1 M 3.912,17.38C 4.89067,17.38 5.688,18.2653 5.688,19.3586C 5.688,20.448 4.89067,21.3333 3.912,21.3333C 2.92667,21.3333 2.136,20.448 2.136,19.3586C 2.136,18.2653 2.92667,17.38 3.912,17.38 Z M 16,17.38C 16.984,17.38 17.776,18.2653 17.776,19.3586C 17.776,20.448 16.984,21.3333 16,21.3333C 15.016,21.3333 14.224,20.448 14.224,19.3586C 14.224,18.2653 15.016,17.38 16,17.38 Z M 21.3333,18.9626L 18.464,18.9626C 18.292,17.62 17.2547,16.5933 16,16.5933C 14.7453,16.5933 13.708,17.62 13.536,18.9626L 6.37467,18.9626C 6.20267,17.62 5.16667,16.5933 3.912,16.5933C 2.656,16.5933 1.62,17.62 1.448,18.9626L 0,18.9626L 0,10.2706C 0,9.396 0.636,8.69196 1.42133,8.69196L 19.5573,8.69196C 20.3387,8.69196 20.9787,9.396 20.9787,10.2706M 20.4427,10.2706L 19.1973,10.2706L 19.1973,15.8013L 20.62,15.8013M 17.776,13.432L 17.776,10.2706L 14.224,10.2706L 14.224,13.432M 13.5107,10.2706L 9.95333,10.2706L 9.95333,13.432L 13.5107,13.432M 9.24533,10.2706L 5.688,10.2706L 5.688,13.432L 9.24533,13.432M 4.97867,10.2706L 1.42133,10.2706L 1.42133,13.432L 4.97867,13.432M 14.5787,2.36932L 12.4427,0L 15.2867,0L 17.776,2.45862L 17.776,0L 19.1973,0L 19.1973,6.31732L 17.776,6.31732L 17.776,3.85864L 15.2867,6.31732L 12.4427,6.31732L 14.5787,3.948L 7.73467,3.948C 7.41733,5.31195 6.30267,6.31732 4.97867,6.31732C 3.40667,6.31732 2.136,4.90533 2.136,3.16132C 2.136,1.41064 3.40667,0 4.97867,0C 6.30267,0 7.41733,1.00531 7.73467,2.36932L 14.5787,2.36932 Z " HorizontalAlignment="Center" VerticalAlignment="Center"/>
</AppBarButton.Icon>
</AppBarButton>
Hope this helps!

How to encode a PHP file with base64

:)
I have one ridiculously silly question and most of you would like to reffer me to Google right away, but that didn't helped me out within the first hour. I suppose I didn't knew how to look for. I'm having a PHP file and I'd like to have it in base64 yet I can't get it to work anyhow.
1) I encoded my PHP script to base64(and included the PHP tags). It'll look as following : JTNDJTNGcGhwJTIwVGhpcyUyMGlzJTIwdGhlJTIwUEhQJTIwY29kZSUyMCUzRiUzRQ==
This kind of base64 won't execute so I added the PHP tags to it although the encoded file already had it. Still didn't worked out. Removed the tags from the base64 and tried again, but still didn't worked. Then I tried adding the PHP tags and inside of them added :
eval(gzinflate(base64_decode('base64 here')));
Still didn't worked out anyhow. Is anyone here kind enough to tell the kiddo how to run a base64 encoded PHP file properly?
Would be really appreaciated. :)
A simple code:
$source = "JTNDJTNGcGhwJTIwVGhpcyUyMGlzJTIwdGhlJTIwUEhQJTIwY29kZSUyMCUzRiUzRQ==";
$code = base64_decode($source);
eval($code);
or even shorter:
eval(base64_decode("JTNDJTNGcGhwJTIwVGhpcyUyMGlzJTIwdGhlJTIwUEhQJTIwY29kZSUyMCUzRiUzRQ=="));
Do you want to encrypt your code? If so, this is not the right way. Use a accelerator like this one or this one. They will crypt your codes and make them even faster!
If you are going to use base_64 to encode your php file then the encoded text need to seat in between the php tags including the base_64 tag.
Example:
If your code is:
JTNDJTNGcGhwJTIwVGhpcyUyMGlzJTIwdGhlJTIwUEhQJTIwY29kZSUyMCUzRiUzRQ
Then your code should look like:
<?php eval("?>".base64_decode("JTNDJTNGcGhwJTIwVGhpcyUyMGlzJTIwdGhlJTIwUEhQJTIwY29kZSUyMCUzRiUzRQ")); ?>
Basically your basic code will look like this:
<?php eval("?>".base64_decode("Code Goes here")); ?>
There are more simple tools that can give you this option
Check this out: PHP Encoder & Decoder with Domain Lock

openlayers kml with external styles

I'm trying to move my kml styles to an external document for use with OpenLayers. The styles work when they are included directly in the kml file.
At first I thought I could use straight kml for this with the styleUrl tag:
<styleUrl>http://localhost/map.kml#myIcon</styleUrl>
However, when I try to do that, the map.kml file never gets requested, and the markers don't show up. I've verified that the styleUrl url works.
I'm loading my kml using:
new OpenLayers.Layer.GML('Name', 'kml_path', {
format: OpenLayers.Format.KML,
formatOptions: {
extractStyles: true,
extractAttributes: true
},
projection: map.displayProjection
});
There are some tantalizing options called 'styles' and 'styleBaseUrl' in the OpenLayers.Format.KML API, but I cannot find any documentation about what they are for or how to use them. Does anyone have any experience with these?
One way could be, have a separate SLD external file with styles and apply it to your GML layer.
Take a look at the SLD OpenLayers code example at http://openlayers.org/dev/examples/sld.html and just replace the example layers with your layer and replace the styles in the sld-tasmania.xml file. This way, you would not need the option extractStyles in the formatOptions.
In formatOptions, try adding maxDepth:10 or some such integer. Here is the api definition.
maxDepth:{Integer} Maximum depth for recursive loading external KML URLs Defaults to 0: do no external fetching
With it defaulting to 0, I would suspect that it downloads 0 external kml files.
I really don't have any experience on KML, so I'm sorry if this is totally off. I just read the code for KML layers, especially the style portions. From your styleUrl tag it looks as the styleBaseUrl should be http://localhost/map.kml, based on the code in KML.js:
parseStyleMaps():
this.styles[(options.styleBaseUrl || "") + "#" + id] =
this.styles[(options.styleBaseUrl || "") + styleUrl];
parseStyles():
var styleName = (options.styleBaseUrl || "") + "#" + style.id;
The styles parameter seems to be initialized and rewritten each time the code reads the data, so that won't do any good I think.

How do I get the HTML in an element using Capybara?

I’m writing a cucumber test where I want to get the HTML in an element.
For example:
within 'table' do
# this works
find('//tr[2]//td[7]').text.should == "these are the comments"
# I want something like this (there is no "html" method)
find('//tr[2]//td[7]').html.should == "these are the <b>comments</b>"
end
Anyone know how to do this?
You can call HTML DOM innerHTML Property:
find('//tr[2]//td[7]')['innerHTML']
Should work for any browser or driver.
You can check all available properties on w3schools
This post is old, but I think I found a way if you still need this.
To access the Nokogiri node from the Capybara element (using Capybara 1.0.0beta1, Nokogiri 1.4.4) try this:
elem = find('//tr[2]//td[10]')
node = elem.native
#This will give you a Nokogiri XML element
node.children[1].attributes["href"].value.should == "these are the <b>comments</b>"
The last part may vary for you, but you should be able to find the HTML somewhere in that node variable
In my environment, find returns a Capybara::Element - that responds to the :native method as Eric Hu mentioned above, which returns a Selenium::WebDriver::Element (for me). Then :text gets the contents, so it could be as simple as:
results = find(:xpath, "//td[#id='#{cell_id}']")
contents = results.native.text
if you're looking for the contents of a table cell. There's no content, inner_html, inner_text, or node methods on a Capybara::Element. Assuming people aren't just making things up, perhaps you get something different back from find depending on what else you have loaded with Capybara.
Looks like you can do (node).native.inner_html to get the HTML content, for example with HTML like this:
<div><strong>Some</strong> HTML</div>
You could do the following:
find('div').native.inner_html
=> '<strong>Some</strong> HTML'
I ran into the same issue as Cyril Duchon-Doris, and per https://github.com/teampoltergeist/poltergeist/issues/629 the way to access the HTML of an Capybara::Poltergeist::Node is via the outerHTML property, e.g.:
find('//tr[2]//td[7]')['outerHTML']
Most of the other answers work only in Racktest (as they use Racktest-specific features).
If your driver supports javascript evaluation (like Selenium) you can use innerHTML :
html = page.evaluate_script("document.getElementById('my_id').innerHTML")
If you're using the Poltergeist driver, these methods will allow you to inspect what matches:
http://www.rubydoc.info/gems/poltergeist/1.5.1/Capybara/Poltergeist/Node
For example:
page.find('[name="form-field"]').native.value == 'something'
try calling find('//tr[2]//td[10]').node on it to get at the actual nokogiri object
Well, Capybara uses Nokogiri to parse, so this page might be appropriate:
http://nokogiri.org/Nokogiri/XML/Node.html
I believe content is the method you are looking for.
You could also switch to capybara-ui and do the following:
# define your widget, in this case in your role
class User < Capybara::UI::Role
widget :seventh_cell, [:xpath, '//tr[2]//td[7]']
end
# then in your tests
role = User.new
expect(role.widget(:seventh_cell).html).to eq(<h1>My html</h1>)

Resources