My codes works perfect in Chrome but doesn't render in IE and FF.
Find the codes here: https://jsfiddle.net/smylla/on35n04v/1/
What could be the problem. Please help.
It is not a problem with Highcharts. Your endpoint's timeseries value is not a valid date format according to ECMAScript spec.
Date() constructor has more flexible implementation then other browsers' implementations (Firefox, IE, Safari).
You should parse the date to be valid for the date constructor, e.g. like this:
var jdatetime = new Date(value.TIME_SERIES.replace(/^(\d\d)-(\d\d)-(\d{4}) /, "$3-$1-$2T"));
example: https://jsfiddle.net/u49xmns3/
Related
I'm using selectPDF html to pdf converter to convert an svg document to pdf. I'm using the webkitRestricted browser engine to ensure it runs correctly on azure. Generally speaking, everything is working correctly, including using pattern definitions. I recently added the use of the patternTransform attribute with the rotate option. This does not appear to be recognized by the webkitrestricted engine and is not working. If i take the underlying html into either firefox or chrome latest versions, the patternTransform attribute does function correctly. Is there a way to overcome this issue using selectpdf ? I'm not clear which version of webkit is being called by selectpdf and whether i can control this in any fashion ?
-ms-text-security:disc and -moz-text-security:disc is not working for IE and mozilla. Is there any other way around? I want to use it mask text field with bullets. -webkit-text-security:disc is working for chrome.
As per --webkit-text-security property is only applicable to those browsers using the WebKit as the engine.
I've been doing some work with SVG, and have been both writing it from scratch and generating it with javascript (including d3js).
One thing I have just noticed is that when I create a new element in javascript, ie by using
var pathNode = document.createElementNS(svgns,"path");
var pathElement = svg.appendChild(pathNode);
The resulting HTML is <path></path>. I've checked lots of D3 demos and this is how D3 produces the HTML too.
In all the docs I've read about SVG, I've never seen any mention of writing an SVG element this way. Do browsers treat the two identically? In all the browsers I've tested, the SVG displays correctly, and the W3C validator validates both versions so it would appear to be the case, but can anyone just clarify this to give me peace of mind?
SVG is an XML language and in XML <x></x> is exactly the same as <x/>. Per the XML specification
Empty-element tags may be used for any element which has no content, whether or not it is declared using the keyword EMPTY
In HTML5, elements can have arbitrary metadata stored in XML attributes whose names start with data- such as <p data-myid="123456">. Is this part of the SVG spec too?
In practice this technique works fine for SVG docs in many places. But I'd like to know if it's part of the official SVG spec or not, because the format is young enough that there's still a lot of incompatibility between browsers, especially in mobile. So before committing to code I'd like know if I can expect future browsers to converge on supporting this.
I found this message from the working group mailing list saying they "expect [they] will" support it. Did this become official?
While other answers are technically correct, they omit the fact that SVG provides an alternative mechanism for data-*. SVG allows any attribute and tag to be included, as long as it doesn't conflict with existing ones (in other words: you should use namespaces).
To use this (equivalent) mechanism:
use mydata:id instead of data-myid, like this: <p mydata:id="123456">
make sure you define the namespace in SVG opening tag, like this: <svg xmlns:mydata="http://www.myexample.com/whatever">
EDIT: SVG2, currently W3C Candidate Recommendation (04 October 2018), will support data- directly (without namespaces, the same as HTML). It will take some time before the support is widespread though. Thanks #cvrebert for pointing this out.
The data-* attribute is part of HTML5. It’s not a generic XML attribute.
The current SVG W3C Recommendation is SVG 1.1 (from 2011-08). It doesn’t allow this attribute, as you can check in the attributes list.
The same is the case for the SVG 2 Working Draft (from 2012-08). Update (2015): It seems that it’s intended to support data-* attributes in SVG 2 (currently still a Working Draft).
data-* attributes on SVG elements are officially supported in the current draft of SVG2. See:
w3c/svgwg commit 1cb4ee9: Added SVGElement.dataset and allowed data-* attributes on all SVG elements.
ACTION-3694: Add "data-*" attributes notes to spec. (Created on: January 15, 2015)
RESOLUTION: We will reserve "data-*" attributes to be used in SVG content. The API for handling them is on Element. (from SVG WG Telecon on 15-Jan-2015)
https://lists.w3.org/Archives/Public/www-svg/2014Dec/0022.html
there is a more general mechanism.
svg supports desc elements which may contain arbitrary xml from other namespaces. link instances of this elements or child nodes from you own namespace by dependent ids or refid attributes.
this is the relevant part of the spec (5.4).
I have some YUI2 code (v2.8.1) that looks like this:
YAHOO.util.Dom.setStyle('foo', 'opacity', 0.5);
and:
var t = new YAHOO.util.Anim(this._splashSlide.shutter, {opacity: {from: 1.0, to: 0}}, 1, YAHOO.util.Easing.easeBoth);
It has been working fine for a number of years and it automatically decides whether it can use style.opacity or whether (for IE) it has to use the IE style.filter to achieve opacity. For a variety of reasons, it is not worth porting this code to YUI3.
Along comes IE 10, which (in standards mode) no longer has the style.filter property and only supports the standard style.opacity property. That's all good, but the YUI2 version I'm running against doesn't know about IE 10 and is apparently still using the style.filter property which no longer works.
So, my question is whether there is an update to YUI2 that is IE10 compatible and uses the opacity property for IE versions where that property exists?
If it was just a simple style setting, I could work around it, but I have a number of YUI animations and I can't find an easy way to work around those (nor do I want to spend the time doing so).
Has Yahoo fixed this for YUI2? Anyone aware of a work-around, particularly for the animation functions that call YD.setStyle() internally?
I guess I found an answer to my own question. YUI2 v2.9.0 changes their setStyle() function to use feature detection so they now properly use style.opacity on browsers that support it and only use IE's style.filter when style.opacity is not supported.
If ever one wanted a poster child for why browser detection is bad and feature detection is good, this is a perfect example. Because YUI2 originally used browser detection, it is now broken on IE10. If they had used feature detection in the first place, the older versions of YUI2 would work on IE10 without requiring an update.
Now, to see if I can get the site where my code runs to upgrade to YUI v2.9.0. If not, I'll have to code a messy workaround.