deep-viz
Version:
A React component library, provide concise and beautiful diversity charts with Canvas, SVG, E-map, WebGL, Dom, based on data visualization experience and commercial data display practice.
1 lines • 4.63 kB
JavaScript
;Object.defineProperty(exports,"__esModule",{value:!0});var _createClass=function(){function r(e,t){for(var o=0;o<t.length;o++){var r=t[o];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(e,t,o){return t&&r(e.prototype,t),o&&r(e,o),e}}(),_react=require("react"),_react2=_interopRequireDefault(_react),_propTypes=require("prop-types"),_propTypes2=_interopRequireDefault(_propTypes),_echartsForReact=require("echarts-for-react"),_echartsForReact2=_interopRequireDefault(_echartsForReact),_Basic2=require("./Basic"),_Basic3=_interopRequireDefault(_Basic2);function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function _possibleConstructorReturn(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function _inherits(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}require("../assets/echarts/map/china");var ScatterCartesian=function(){function e(){return _classCallCheck(this,e),_possibleConstructorReturn(this,(e.__proto__||Object.getPrototypeOf(e)).apply(this,arguments))}return _inherits(e,_Basic3.default),_createClass(e,[{key:"setSymbolSize",value:function(e,t,o,r,a){return e?r<=a&&t<=e<=o?(e-t)*(a-r)/(o-t)+r:e||0:20}},{key:"getOption",value:function(e){var i=this,l=e.config,t=e.onTooltipFormat,o=l.options,e=l.color,n={silent:!0,data:[{name:"平均线",type:"average",valueIndex:0},{name:"平均线",type:"average",valueIndex:1}],label:{normal:{formatter:function(e){return"平均值\n"+(e.value&&e.value.toFixed(0)||"")}}},lineStyle:{normal:{color:this.fontColor}}},s={color:e||this.color,toolbox:{show:!!l.isToolboxShow,itemSize:this.fontSize,right:"0%",top:0,iconStyle:{normal:{borderColor:this.fontColor},emphasis:{borderColor:this.emphasisColor}},feature:{mark:{show:!0},dataZoom:{show:!0},dataView:{show:!0,readOnly:!1},restore:{show:!0},saveAsImage:{show:!0}}},grid:{show:!1,left:l.grid&&l.grid.left||30,right:l.grid&&l.grid.right||20,top:l.grid&&l.grid.top||10,bottom:l.grid&&l.grid.bottom||10,borderColor:this.gridColor,containLabel:!0},legend:{y:"top",x:"center",data:[],textStyle:{color:this.fontColor}},tooltip:{showDelay:0,axisPointer:{show:!0,type:"cross",lineStyle:{type:"dashed",width:1}}},xAxis:{name:l.xName,nameTextStyle:{color:this.fontColor,fontSize:this.fontSize},splitLine:{lineStyle:{color:this.gridColor,type:"dashed"}},axisLabel:{show:!0,textStyle:{color:this.fontColor,fontSize:this.fontSize}},scale:!0},yAxis:{name:l.yName,nameTextStyle:{color:this.fontColor,fontSize:this.fontSize},splitLine:{lineStyle:{color:this.gridColor,type:"dashed"}},axisLabel:{show:!0,textStyle:{color:this.fontColor,fontSize:this.fontSize}},scale:!0},series:[]};return t&&(s.tooltip.formatter=function(e){return t(e)}),l.title&&(s.title={text:l.title.text,subtext:l.title.subtext,textStyle:{color:this.titleColor,fontSize:this.titleSize}}),o.forEach(function(e,t){var o=[];e.data.forEach(function(e){o.push(e[2])});var r=Math.max.apply(Math,o),a=Math.min.apply(Math,o);s.legend.data.push(e.name),s.series.push({name:e.name,data:e.data,type:"scatter",symbolSize:function(e){return i.setSymbolSize(e[2],a,r,10,50)},markLine:e.markLine?n:"",label:{normal:{show:l.isLabelShow,position:"top",color:l.color&&Array.isArray(l.color[t])?l.color[t][1]:null,formatter:function(e){return e.data[3]||e.seriesName}}},itemStyle:l.color?{normal:{shadowBlur:5,shadowColor:l.color[t][1],shadowOffsetY:2,color:Array.isArray(l.color[t])?{type:"radial",x:.4,y:.4,r:.6,colorStops:[{offset:0,color:l.color[t][0]},{offset:1,color:l.color[t][1]}],globalCoord:!1}:l.color[t]}}:null})}),s}},{key:"render",value:function(){return _react2.default.createElement(_echartsForReact2.default,{option:this.getOption(this.props),notMerge:!0,lazyUpdate:!1,style:this.props.style||{height:250,width:"100%"},onEvents:this.props.onEvents})}}]),e}();(exports.default=ScatterCartesian).propTypes={dataConfig:_propTypes2.default.shape({options:_propTypes2.default.object.isRequired,grid:_propTypes2.default.object,title:_propTypes2.default.object,color:_propTypes2.default.array}),style:_propTypes2.default.object,onTooltipFormat:_propTypes2.default.func,onEvents:_propTypes2.default.object};