网站dns查询百度实时热点排行榜

网站dns查询,百度实时热点排行榜,宁波妇科,建筑工程网课代字幕Highcharts 扩展开发 自版本2.3起#xff0c;Highcharts采用模块化设计#xff0c;便于扩展。 主要的图表概念对应于 JavaScript 的原型或“类”#xff0c;这些类在 Highcharts 命名空间中显示出来#xff0c;且可以方便地进行修改。例如 Highcharts.Series, Highcharts…Highcharts 扩展开发自版本2.3起Highcharts采用模块化设计便于扩展。主要的图表概念对应于 JavaScript 的原型或“类”这些类在 Highcharts 命名空间中显示出来且可以方便地进行修改。例如Highcharts.Series,Highcharts.Tooltip,Highcharts.Chart,Highcharts.Axis,Highcharts.Legend等。查看 完整列表 的类。构造函数的逻辑因此被保留在一个方法中init以便覆盖初始化过程。添加事件可以通过addEvent:Highcharts.addEvent(chart, load, someFunction);一些原型和属性列在 api.highcharts.com 上但并非全部。未列出的原型和属性意味着它们可能会在未来的版本中发生变化因为我们在优化和调整库。我们并不反对使用这些成员但提醒您您的插件应在未来版本的 Highcharts 中进行测试。可以通过检查 Highcharts 命名空间以及开发者工具中生成的图表对象或者研究highcharts.src.js的源代码来识别这些成员。封装一个插件Highcharts插件应当包裹在一个匿名自执行函数中以防止变量污染全局作用域。一个好的做法是这样包裹插件(function(H){const{Chart,Series}H;// shortcuts to Highcharts classesletlocalVar;// local variabledoSomething();}(Highcharts));在图表初始化时加载扩展事件可以添加到类和实例中。为了在每个图表上都初始化扩展可以在Chart类上添加一个事件监听器。H.addEvent(H.Chart,load,function(e){constcharte.target;H.addEvent(chart.container,click,function(e){echart.pointer.normalize(e);console.log(Clicked chart at${e.chartX},${e.chartY});});H.addEvent(chart.xAxis[0],afterSetExtremes,function(e){console.log(Set extremes to${e.min},${e.max});});});上手试一试封装原型函数JavaScript 具有极强的动态特性在实时修改脚本行为方面非常强大。在 Highcharts 中我们创建了一个名为wrap的工具它可以包装现有的原型方法“方法”允许你在其前后添加自己的代码。wrap函数的第一个参数是父对象第二个参数是要包裹的函数名第三个参数是一个回调替代函数。原始函数作为第一个参数传递给替代函数原始参数紧随其后。代码示例H.wrap(H.Series.types.line.prototype,drawGraph,function(proceed){// Before the original functionconsole.log(We are about to draw the graph: ,typeofthis.graph);// Now apply the original function with the original arguments,// which are sliced off this functions argumentsproceed.apply(this,Array.prototype.slice.call(arguments,1));// Add some code after the original functionconsole.log(We just finished drawing the graph: ,typeofthis.graph);});上手试一试在加载ES模块时可以 直接访问模块 。扩展示例案例客户希望在Highcharts Stock的柱状系列中使用标记“轨迹球”。目前标记功能仅支持线性系列。为了实现这个功能可以编写一个小插件。这个插件会在每个系列中添加一个轨迹球前提是该系列尚未支持或包含标记。为此我们从以下代码开始创建一个自执行函数来包含这个插件(function(H){// This is a self executing function// The global variable Highcharts is passed along with a reference H}(Highcharts));之后我们需要为Tooltip.prototype.refresh和Tooltip.prototype.hide方法添加额外的功能。为此我们会对这些方法进行包装(function(H){H.wrap(H.Tooltip.prototype,refresh,function(proceed,points){// When refresh is called, code inside this wrap is executed});}(Highcharts));当调用刷新时我们希望它在每个系列的当前点上绘制一个轨迹球。如果某个系列已经包含标记则应跳过此功能。H.wrap(H.Tooltip.prototype,refresh,function(proceed,points){// Run the original proceed methodproceed.apply(this,Array.prototype.slice.call(arguments,1));// For each point add or update trackballH.each(points,function(point){// Function variablesvarseriespoint.series,chartseries.chart,pointXpoint.plotXseries.xAxis.pos,pointYH.pick(point.plotClose,point.plotY)series.yAxis.pos;// If trackball functionality does not already existif(!series.options.marker){// If trackball is not definedif(!series.trackball){// Creates a new trackball with same color as the seriesseries.trackballchart.renderer.circle(pointX,pointY,5).attr({fill:series.color,stroke:white,stroke-width:1,zIndex:5}).add();}else{// Updates the position of the trackballseries.trackball.attr({x:pointX,y:pointY});}}});});现在轨迹球会显示出来但我们还需要在工具提示被移除时将其隐藏。因此隐藏方法中也需要添加一些额外的功能。在包含插件的函数内部添加了一个新的包装H.wrap(H.Tooltip.prototype,hide,function(proceed){varseriesthis.chart.series;// Run original proceed methodproceed.apply(this);// For each series destroy trackballH.each(series,function(serie){vartrackballserie.trackball;if(trackball){serie.trackballtrackball.destroy();}});});就是这些 整个示例可以在jsFiddle中查看 。