Merge branch 'next' into tooltip

587e3fc7 · susiwen8 · 09f54fd9 · aff984a9 · 587e3fc7 · 587e3fc7
5 changed file
--- a/src/chart/line/LineSeries.ts
+++ b/src/chart/line/LineSeries.ts
@@ -61,7 +61,9 @@ export interface LineDataItemOption extends SymbolOptionMixin,

 export interface LineSeriesOption extends SeriesOption<LineStateOption, ExtraStateOption & {
    emphasis?: {
-        lineStyle?: LineStyleOption
+        lineStyle?: LineStyleOption | {
+            width?: 'bolder'
+        }
        areaStyle?: AreaStyleOption
    }
    blur?: {
@@ -146,7 +148,10 @@ class LineSeriesModel extends SeriesModel<LineSeriesOption> {
        },

        emphasis: {
-            scale: true
+            scale: true,
+            lineStyle: {
+                width: 'bolder'
+            }
        },
        // areaStyle: {
            // origin of areaStyle. Valid values:
@@ -188,4 +193,4 @@ class LineSeriesModel extends SeriesModel<LineSeriesOption> {

 SeriesModel.registerClass(LineSeriesModel);

-export default LineSeriesModel;
\ No newline at end of file
+export default LineSeriesModel;
--- a/src/chart/line/LineView.ts
+++ b/src/chart/line/LineView.ts
@@ -544,11 +544,18 @@ class LineView extends ChartView {
            {
                fill: 'none',
                stroke: visualColor,
-                lineJoin: 'bevel'
+                lineJoin: 'bevel' as CanvasLineJoin
            }
        ));

        setStatesStylesFromModel(polyline, seriesModel, 'lineStyle');
+
+        const shouldBolderOnEmphasis = seriesModel.get(['emphasis', 'lineStyle', 'width']) === 'bolder';
+        if (shouldBolderOnEmphasis) {
+            const emphasisLineStyle = polyline.getState('emphasis').style;
+            emphasisLineStyle.lineWidth = polyline.style.lineWidth + 1;
+        }
+
        // Needs seriesIndex for focus
        graphic.getECData(polyline).seriesIndex = seriesModel.seriesIndex;
        enableHoverEmphasis(polyline, focus, blurScope);
@@ -569,7 +576,7 @@ class LineView extends ChartView {
                {
                    fill: visualColor,
                    opacity: 0.7,
-                    lineJoin: 'bevel'
+                    lineJoin: 'bevel' as CanvasLineJoin
                }
            ));

@@ -881,4 +888,4 @@ class LineView extends ChartView {

 ChartView.registerClass(LineView);

-export default ChartView;
\ No newline at end of file
+export default ChartView;
--- a/src/chart/radar/RadarView.ts
+++ b/src/chart/radar/RadarView.ts
@@ -205,6 +205,8 @@ class RadarView extends ChartView {
            const areaStyleModel = itemModel.getModel('areaStyle');
            const polygonIgnore = areaStyleModel.isEmpty() && areaStyleModel.parentModel.isEmpty();

+            polygon.ignore = polygonIgnore;
+
            zrUtil.each(['emphasis', 'select', 'blur'] as const, function (stateName) {
                const stateModel = itemModel.getModel([stateName, 'areaStyle']);
                const stateIgnore = stateModel.isEmpty() && stateModel.parentModel.isEmpty();

--- a/src/coord/cartesian/GridModel.ts
+++ b/src/coord/cartesian/GridModel.ts
@@ -34,7 +34,7 @@ export interface GridOption extends ComponentOption, BoxLayoutOptionMixin, Shado
    borderWidth?: number;
    borderColor?: ZRColor;

-    tooltop?: any; // FIXME:TS add this tooltip type
+    tooltip?: any; // FIXME:TS add this tooltip type
 }

 class GridModel extends ComponentModel<GridOption> implements CoordinateSystemHostModel {

--- a/test/line-boldWhenHover.html
+++ b/test/line-boldWhenHover.html
+<!DOCTYPE html>
+<!--
+Licensed to the Apache Software Foundation (ASF) under one
+or more contributor license agreements.  See the NOTICE file
+distributed with this work for additional information
+regarding copyright ownership.  The ASF licenses this file
+to you under the Apache License, Version 2.0 (the
+"License"); you may not use this file except in compliance
+with the License.  You may obtain a copy of the License at
+
+   http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing,
+software distributed under the License is distributed on an
+"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+KIND, either express or implied.  See the License for the
+specific language governing permissions and limitations
+under the License.
+-->
+<html>
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <script src="lib/esl.js"></script>
+    <script src="lib/config.js"></script>
+    <script src="lib/facePrint.js"></script>
+    <script src="lib/testHelper.js"></script>
+    <link rel="stylesheet" href="lib/reset.css" />
+</head>
+
+<body>
+    <div id="main0"></div>
+    <div></div>
+    <script>
+        var chart;
+        var myChart;
+
+        require([
+            'echarts'
+        ], function (echarts) {
+            var option = {
+                legend: {
+                    left: 'center',
+                    bottom: 'bottom'
+                },
+                xAxis: {
+                    type: 'category',
+                    data: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12],
+                },
+                yAxis: {
+                    type: 'value'
+                },
+                series: [
+                    {
+                        name: 'line series 1',
+                        type: 'line',
+                        data: [28.5, 70.5, 108.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
+                        symbolSize: 10,
+                        symbol: 'square',
+                        emphasis: {
+                            focus: 'series',
+                            lineStyle: {
+                                width: 5
+                            }
+                        }
+                    },
+                    {
+                        name: 'line series 2',
+                        type: 'line',
+                        data: [226.9, 194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5],
+                        symbolSize: 10,
+                        symbol: 'circle',
+                        emphasis: {
+                            focus: 'series'
+                        }
+                    }
+                ]
+            };
+
+            chart = myChart = testHelper.create(echarts, 'main0', {
+                title: [
+                    'The line should be bolder when hovering on it'
+                ],
+                option: option
+            });
+        });
+
+    </script>
+</body>
+
+</html>